• 회원가입
  • 로그인
  • 구글아이디로 로그인

[Basic] JS - Math 객체 - JS수학객체 (= JS산수객체 = Math객체 = Math Object = 매스 객체 = 메스 객체)

목차
  1. Math 객체 특징
  2. Math.min() 메서드 - 최소값 반환
  3. Math.max() 메서드 - 최대값 반환
  4. Math.random() 메서드 - 0~1사이 랜덤 숫자 반환
  5. Math.round() 메서드 - 기본 반올림
  6. Math.ceil() 메서드 - 천장 반올림
  7. Math.floor() 메서드 - 바닥 반올림
  8. 0≤값≤10 범위의 랜덤 정수 생성
  9. Math 객체 내장 상수 종류 (8개)
  10. Math 객체 내장 메서드 종류

 

Math 객체 특징

[주의] 대소문자 구분하므로 표기할 때 주의.


1.

Math 객체는 숫자 이용한 수학적인 처리 가능케 함.


2.

Math 객체엔  여러 수학 메서드(methods) 내장 중임.

(예) 

  • Math.random() - 랜덤 숫자 생성
  • Math.min() - 최소값 얻기
  • Math.max() - 최대값 얻기
  • ...


3.

Math는 생성자(constructor)가 없음. 어떠한 메서드이든 Math 객체를 먼저 생성할 필요가 없음.

 

 

Math.min() 메서드 - 최소값 반환


<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML =
    Math.min(12, 34, 0, -34, -12)//  -34
}
</script>

결과값: -34

 

Math.max() 메서드 - 최대값 반환

 

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML =
    Math.max(12, 34, 0, -34, -12); // 34
}
</script>


결과값: 34

 

Math.random() 메서드 - 0~1사이 랜덤 숫자 반환


<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML = Math.random()// 0~ 1사이 랜덤 숫자
}
</script>

결과값 예:0.46805146150290966

 

Math.round() 메서드 - 일반 반올림

[예제1] - 0.5 미만 시 아래로 반올림

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML = Math.round(3.45)// 3
}
</script>


결과값: 3


[예제2] - 0.5 이상 시, 위로 반올림

 

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML = Math.round(3.55)// 4
}
</script>


결과값: 4

 

Math.ceil() 메서드 - 천장 반올림

※ 천장 반올림: 소수수점 이하가 0.5 넘든 안 넘든 무조건 반올림

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML = Math.ceil(3.44); // 소수점 이하가 0.44지만 무조건 반올림
}
</script>


결과값: 4

 

Math.floor() 메서드 - 바닥 반올림

※ 바닥 반올림: 소수점 이하 숫자 무조건 떼고 정수 만듦.

<button onclick="homzzang()">클릭</button>

<p id="demo"></p>

<script>
function homzzang() {
    document.getElementById("demo").innerHTML = Math.floor(3.54); // 3
}
</script>
 
결과값: 3

 

0≤값≤10 범위의 랜덤 정수 생성

 

<button onclick="homzzang()">클릭</button>


<p id="demo"></p>


<script>

function homzzang() {

    document.getElementById("demo").innerHTML =

    Math.floor(Math.random() * 11); // 0~10 사이 랜덤 정수

}

</script>

 

결과보기

 

Math 객체 내장 상수 종류 (8개)


<button onclick="homzzang()">클릭</button>


<p id="demo"></p>


<script>

function homzzang() {

    document.getElementById("demo").innerHTML = 

    Math.E + "<br>" + // 자연 로그의 밑인 Euler(오일러)의 상수. 약 2.718

    Math.PI + "<br>" +  // 원주율. 약 3.14159

    Math.SQRT2 + "<br>" +  // 2의 제곱근. 약 1.414

    Math.SQRT1_2 + "<br>" +  // 0.5의 제곱근 값 또는 1을 2의 제곱근으로 나눈 값. 약 0.707

    Math.LN2 + "<br>" +  // 2의 자연 로그. 약 0.693

    Math.LN10 + "<br>" + // 10의 자연 로그. 약 2.302

    Math.LOG2E + "<br>" +  // 밑이 2인 자연 로그. 약 1.443

    Math.LOG10E + "<br>"; // 밑이 10인 자연 로그. 약 0.434

}

</script>


결과값:

2.718281828459045

3.141592653589793

1.4142135623730951

0.7071067811865476

0.6931471805599453

2.302585092994046

1.4426950408889634

0.4342944819032518

 

Math 객체 내장 메서드 종류

 메서드
   의미
Math.abs(x)  숫자 x의 절대값(absolute value) 반환
Math.acos(x)  
Math.asin(x)  
Math.atan(x)  
Math.atan2(y,x)  
Math.ceil(x)  무조건 더 큰 정수로 반환 
Math.cos(x)
 
Math.exp(x)   
Math.floor(x)   무조건 소수점 이하를 뗀 정수로 반환
Math.log(x)   
Math.max(x,y,z,...,n)   독립변수들 중 가장 큰 값 반환
Math.min(x,y,z,...,n)   독립변수들 중 가장 작은 값 반환
Math.pow(x,y)   x의 y승 (예제) 2의 3승 경우, 2 x 2 x 2 = 8
Math.random()   0과 1사이의 임의의 숫자를 반환
Math.round(x)   소수점 이하를 반올림해서 정수로 반환
Math.sin(x)   
Math.sqrt(x)   
Math.tan(x)   
※ 빈 애들은 몰라도 됨. ㅡㅡ;

방문 감사합니다. (즐겨찾기 등록: Ctrl + D)

분류 제목
Basic JS - Home (JS입문) + Javascript Framework (프레임워크) 종류
Basic JS - Intro (JS소개)
Basic JS - Where To (JS위치) - JS구문 / JS코드위치 / JS사용법 ※ JS외부링크 주의사항
Basic JS - Output (JS출력= JS쓰기) ★★★★★
Basic JS - Syntax (JS구문) ★
Basic JS - Statement (JS구문= JS명령문)
Basic JS - Comment (JS주석)
Basic JS - Variable (JS변수) ★★★★★
Basic JS - Operator (연산자) - JS연산자 ★★★★★
Basic JS - Data Type - 데이터유형 ★★★★★ (= 데이터형식 = 데이터타입 = 데이터종류 = 자료형…
Basic JS - Function - JS함수 ★★★★★ ※ 일반함수 특징 2
Basic JS - Object - JS객체 ★★★★★
Basic JS - Scope - JS유효범위 (= JS접근범위 = 변수 종류) ★★★★★★★★★★
Basic JS - Event - JS이벤트 (= JS코드실행방법) ★★★★★
Basic JS - Strings - JS문자열
Basic JS - String Methods - JS문자열메서드
Basic JS - Number - JS숫자
Basic JS - Number Method - JS숫자메서드
Basic JS - Math 객체 - JS수학객체 (= JS산수객체 = Math객체 = Math Object = 매스 …
Basic JS - Dates - JS날짜
1/3
목록
찾아주셔서 감사합니다. Since 2012