[JavaScript] 형변환 (parseInt, parseFloat) + isNaN

🔻형변환, Casting🔻

형변환 내장 함수(Built-in Function)

1. number parseInt(value) : value를 정수로 변환한다.

2. number parseFloat(value) : value를 실수로 변환한다.

---

number parseInt(value)

    <script>
        var n1 = 3.14;
        console.log(parseInt(n1));      //3

        n1 = 3.99;      //반올림되지 않음
        console.log(parseInt(n1));      //3
    </script>

변수의 값을 절삭하여 정수로 반환한다.

 

 

    <script>
        var n2 = '300';
        console.log(n2, typeof n2);     //string
        console.log(parseInt(n2));      //300
        console.log(n2, typeof parseInt(n2));     //number
    </script>

숫자를 문자형으로 표현한 데이터도 정수로 변환이 가능하다.

 

    <script>
        var n3 = '홍길동';
        console.log(parseInt(n3));   //NaN
    </script>

단, 문자데이터만 있는 경우 NaN 값을 반환한다.

(NaN : Not a Number, 숫자가 아니다)

 

 

    <script>
        var n4 = '100점';
        console.log(parseInt(n4));  //100

        n4 = '스코어90';
        console.log(parseInt(n4));  //NaN

        n4 = '100점이 아닌 95점';
        console.log(parseInt(n4));  //100
    </script>

숫자가 앞에 나오면 앞에 나온 숫자만 인식하여 반환한다.

 

    <script>
        var width = '200px';
        console.log(width + 100);           //200px100
        console.log(parseInt(width)+100);   //300
    </script>

javascript에서 css 조작할 때 위와 같이 사용하기도 한다.

 

---

number parseFloat(value)

parseInt 와 동일하다.

    <script>
        var size = '1.5em';
        console.log(parseFloat(size))       //1.5
        
    </script>

 

---

boolean isNaN(value)

• 'value가 숫자가 아닙니까'를 의미한다.
• true : 숫자가 아니다.
• false : 숫자이다.

    <script>
        var age = 20;
        console.log(isNaN(age));    //false 

        age = '20세';
        console.log(isNaN(age));    //true
    </script>

 

유효성검사 할 때 편리하다.

    <script>
        age = '20세';

        if (isNaN(age)){
            console.log('나이가 올바르지 않습니다.');
        } else {
            console.log('올바른 나이입니다.');
        }
    </script>