[Basic] JS - Number Method - JS숫자메서드

round 숫자1 up to 숫자2
숫자1을 반올림해서 숫자2로 만들다.
(예) 3.45 경우 반올림해서 소수점 1자리 표기시, 3.5

round 숫자1 down to 숫자2
숫자1을 반올림해서 숫자2로 만들다.
(예) 3.44 경우 반올림해서 소수점 1자리 표기시, 3.4

1. toString() 메서드은 숫자를 문자열로 반환합니다.

2. 모든 숫자 메서드은 어떠한 유형의 숫자 (문자열, 변수, 표현식)에도 사용 가능합니다.

<p id="homzzang"></p>

<script>

var x = 345;

document.getElementById("homzzang").innerHTML =

    x.toString() + "<br>" +  // 변수 x에 할당된 값을 문자열로 반환

   (345).toString() + "<br>" + // 할당된 값 자체를 문자열로 반환

   (300 + 45).toString(); // 연산식으로 표현된 값을 문자열로 반환

</script>

결과값:
345
345
345

1. toExponential(숫자) 메서드은 반올림해서 지수표기법으로 써진 문자열을 반환함.

2. 괄호 안의 숫자는 소수점 자리수를 의미함.

<p id="homzzang"></p>

<script>

var x = 3.456; // 변수 x 선언하고, 숫자 3.456을 할당

document.getElementById("homzzang").innerHTML =

    x.toExponential() + "<br>" +  // 소수점 없이 지수표기법으로 표현된 문자열을 반환

    x.toExponential(2) + "<br>" +  // 반올림해서 소수점 2자리까지 나오게 지수표기법으로 표현된 문자열을 반환

    x.toExponential(3) + "<br>" +  // 반올림해서 소수점 3자리까지 나오게 지수표기법으로 표현된 문자열을 반환

    x.toExponential(4); // 반올림해서 소수점 4자리까지 나오게 지수표기법으로 표현된 문자열을 반환

</script>

결과값:
3.456e+0
3.46e+0   ※ 반올림해서 3.45e+0 아닌 3.46e+0 된 것임
3.456e+0
3.4560e+0

3. 소수점 이하 자리수를 표기하는 숫자는 선택사항입니다. 만약 안 적으면, 숫자의 모든 소수점을 그대로 보여줍니다.

1. toFixed(숫자) 메서드은 주어진 숫자를 반올림해서 숫자 자리의 소수점 이하까지 표기된 문자열로 반환합니다.
   이 메서드은 금전을 표기할 때 아주 유용합니다.

<p id="homzzang"></p>

<script>

var x = 3.456; // 변수 x에 소수점 3자리 숫자인 3.45이 할당

document.getElementById("homzzang").innerHTML =

    x.toFixed(0) + "<br>" +  // 반올림해서 소수점 없는 문자열로 반환. 결과값은 3

    x.toFixed(2) + "<br>" +  // 반올림해서 소수점 2자리까지 표기된 문자열로 반환. 결과값은 3.46

    x.toFixed(4) + "<br>" + // 반올림해서 소수점 4자리까지 표기된 문자열로 반환. 결과값은 3.4560

    x.toFixed(6);  // 반올림해서 소수점 6자리 표기된 문자열로 반환. 결과값은 3.456000

</script>


결과값:
3
3.46
3.4560
3.456000

2. toFixed(2) 경우, 미국 달러를 표시할 때 유용한 함. 왜냐하면, 미국 돈은 (1달러 = 100 센트)이므로... ^!~

1. toPrecision() 메서드은 숫자를 반올림해서 특정 길이의 문자열로 표현합니다.  대소문자 구분하니 주의해서 적을 것.

<p id="homzzang"></p>

<script>

var x = 3.456;

document.getElementById("homzzang").innerHTML = 

    x.toPrecision() + "<br>" +  // 숫자를 있는 그대로 반환. 결과값 3.456

    x.toPrecision(1) + "<br>" +  // 반올림해서 처음 1글자만 반환. 결과값 3

    x.toPrecision(3) + "<br>" + // 반올림해서 처음 3글자만 반환. 결과값 3.46

    x.toPrecision(5);    // 반올림해서 처음 5글자만 반환. 결과값 3.

</script>

결과값:
3.456
3
3.46    ※ 숫자를 반올림하므로, 3.45가 아니라 3.46임
3.4560

2. toPricision(숫자)에서 괄호 안의 숫자는 전체 문자열의 길이를 의미

Number() 메서드

parseInt() 메서드

parseFloat() 메서드

<p id="homzzang"></p>

<script>

document.getElementById("homzzang").innerHTML = 

    Number(true) + "<br>" +    // 참거짓의 참인 true를 숫자로 전환. 결과값 1

    Number(false) + "<br>" +  // 참거짓의 거짓인 false를 숫자로 전환. 결과값 0

    Number(new Date()) + "<br>" +  // 함수가 실행되는 시점에 날짜 및 시간 데이터를 숫자로 전환. 실행시마다 달라짐.

    Number("  34") + "<br>" + // 앞에 공백있는 숫자를 숫자로 전환. 결과값 34

    Number("34  ") + "<br>" +  // 뒤에 공백있는 숫자를 숫자로 전환. 결과값 34

    Number("34 5");    // 숫자와 숫자 사이에 공백이 있는 숫자를 숫자로 전환. 결과값 NaN  즉, 숫자가 아닌 걸로 봄.

</script>

결과값:

1
0
1421532748308
34
34
NaN

<p id="homzzang"></p>

<script>

document.getElementById("homzzang").innerHTML = 

    parseInt("34") + "<br>" +  // 결과값 34

    parseInt("34.55") + "<br>" +  // 소수점은 숫자로 안 보므로, 앞에 있는 숫자 34만 숫자로 간주해 결과값 34 반환

    parseInt("34 5") + "<br>" +     // 숫자 중간 공백이 들어가도 숫자로 보긴 하지만, 앞 부분만 숫자로 반환. 결과값 34

    parseInt("34 years") + "<br>" +    // 숫자 공백 문자 순으로 적힌 경우, 숫자 부분만 반환. 결과값 34    

    parseInt("34years") + "<br>" +    // 숫자문자 순으로 적힌 경우, 숫자 부분만 반환. 결과값 34

    parseInt("years 34");    // 문자 공백 숫자 순으로 적힌 경우, 전체를 숫자로 보지 않음. 결과값 NaN   

    parseInt("years34");    // 문자숫자 순으로 적힌 경우, 전체를 숫자로 보지 않음. 결과값 NaN

</script>

결과값:
34
34
34
34
34
NaN
NaN

<p id="homzzang"></p>

<script>

document.getElementById("homzzang").innerHTML = 

    parseFloat("34") + "<br>" + 

    parseFloat("34.55") + "<br>" +  // 위의 parseInt() 메서드과 달리 소수점을 숫자 일부로 인식해, 소수점 이하까지 반환

    parseFloat("34 5") + "<br>" +    

    parseFloat("34 years") + "<br>" + 

    parseFloat("34years") + "<br>" +   

    parseFloat("years 34") + "<br>" +  

    parseFloat("years34");  

</script>

결과값:
34
34.55
34
34
34
NaN
NaN

① valueOf() 메서드은 숫자를 숫자로 반환함. 이 경우, 숫자 유형은 (변수에 할당된 수, 숫자 자체, 연산식)이든 상관 없음

<p id="homzzang"></p>

<script>

var x = 345;   변수 x를 선언하고, 숫자 345를 할당.

document.getElementById("homzzang").innerHTML =   // 아이디가 homzzang인 곳에 아래 결과값을 출력시켜라.

    x.valueOf() + "<br>" +   // 숫자 345가 할당된 변수 x의 숫자를 반환. 결과값 345

    (345).valueOf() + "<br>" + // 숫자 345의 숫자를 반환. 결과값 345   [주의] 숫자 적을 때 소괄호로 묶어야 함.

    (300 + 45).valueOf(); // 숫자 300과 45를 더한 값을 숫자로 반환. 결과값 345

</script>

결과값:
345
345
345

② JS에서 숫자는 기초 데이터로서의 숫자와 객체로 선언된 경우의 객체가 될 수 있습니다.
   valueOf() 메서드은 객체화 된 숫자를 다시 기초 데이터로서의 숫자로 전환할 때 사용합니다.
   따라서, 이 코드를 사용할 이유가 없습니다.  즉, 숫자를 객체로 전환했다가, 다시 숫자로 전환할 이유가 없는 것이죠.

③ JS에서 모든 데이터는 그 유형에 관계없이 valueOf() 와 toString() 메서드은 가질 수 있습니다.