자바스크립트 문자 -> 숫자 형변환(parseInt, number)

문자형과 10과 문자형 10을 더하게 되면 계산이 되는 것이 아닌
단순히 1010으로 붙여서 표시되어 나온다.

이번시간에는 문자형을 숫자형으로 변경하는 방법에 대해서 알아보겠습니다.
먼저 기본적인 자료형은 다음과 같습니다.
String() : 문자형으로 변환
Number() : 숫자형으로 변환 -> ""로 입력하면 NAN을 반환하니 주의
Boolean() : 불린 형으로 변환 -> 0, "", null, undefined, NAN -> false이고 나머지는 true

---

문자형 계산식 결과

프롬프트에 값을 입력받아서 계산한 결과입니다.
결과는 85가 나와야 정상이지만 다른 결과값인 4045를 보여줍니다.

const mathscore = prompt("수학 점수를 입력하세요", "점수"); //80
const engscore = prompt("영어 점수를 입력하세요","점수"); //90
const result = (mathscore + engscore) / 2; //8090 / 2 = 4045
console.log(result);

결과 "8090"은 문자형 / 2로 오류가 나야 정상이지만 / 같은 계산식은 자동형변환이 일어나서
"8090"문자형을 숫자형으로 자동변경하여 계산하기 때문에 4045라는 결과값이 나왔습니다.

 

따라서 prompt로 입력받은 값인 mathscore, engscore의
숫자 계산을 위해서는 명시적으로 숫자형으로 변경해야함

 

1. 입력을 숫자받는방법

const mathscore = 80;
const engscore = 90;
const result = (mathscore + engscore) / 2; //170 / 2 = 85

console.log(result); // 85

2. Number 사용하기 (숫자형으로 변경)

const mathscore = prompt("수학 점수를 입력하세요", "점수"); //80
const engscore = prompt("영어 점수를 입력하세요","점수"); //90
const result = (parseInt(mathscore) + parseInt(engscore)) / 2; //170 / 2 = 85

console.log(result); //85

3. parseInt 사용하기 (정수로 파싱해주는 역할)

const mathscore = prompt("수학 점수를 입력하세요", "점수"); //80
const engscore = prompt("영어 점수를 입력하세요","점수"); //90
const result = (parseInt(mathscore) + parseInt(engscore)) / 2; //170 / 2 = 85

console.log(result); //85

 

4. 문자형 정리

다양한 문자형을 정리해 보았다.

        //문자형 String
        console.log(
            String(123),        //123     
            String("이름"),     //이름
            String(true),       //true
            String(false),      //false
            String(null),       //null
            String(undefined)   //undefined90
        )
        //숫자형 Number()
        console.log(
            Number(123),        //123
            Number("이름"),     //NaN
            Number(true),       //1
            Number(false),      //0
            Number(null),       //0
            Number(undefined),  //NaN

        )
        //불린형 Boolean() 
        console.log(
            Boolean(0),         //false 
            Boolean("0"),       //true
            Boolean(""),        //false 
            Boolean(" "),       //true
            Boolean(null),      //false 
            Boolean(undefined), //false 
            Boolean(NaN)        //false 
        )