형변환

유튜브 코딩앙마 채널의 '자바스크립트 기초 강좌' 를 공부하며 정리한 내용입니다.

String() 은 문자형으로 Number() 는 숫자형으로 Boolean() 은 불린형으로 변환합니다. 자료형이 다르면 의도치 않은 동작이 발생할 수 있습니다. "100"+200=?

수학과 영어의 점수를 받아 평균을 구하는 코드를 써본다고 할 때

const mathScore = prompt("수학 몇점?");
const engScore = prompt("영어 몇점?");
const result = (mathScore+engScore)/2;
console.log(result);

위와 같은 식으로 평균은 구할 수 없습니다. prompt로 입력한 데이터는 문자열로 출력됩니다. 80과 90을 입력하면 8090이 됩니다. 8090은 문자형이지만 나누기같은 표현식과 만나면 숫자형으로 자동 변환이 되어서 계산됩니다. 이를 자동 형변환이라고 합니다. 이런 동작은 이후에 원인을 찾을 수 없는 에러를 발생시킬 수 있습니다. 그래서 잘 동작하더라도 명시적 형변환을 해주어야 합니다. 의도를 가지고 원하는 타입으로 변환시켜줘야 합니다.

---

String() 은 괄호 안의 타입을 문자형으로 바꿔줍니다.

console.log(
	String(3),
	String(true),
    String(false),
    String(null),
    String(undefined)
)

---

Number() 는 괄호 안의 타입을 숫자형으로 바꿔줍니다. 사용자에게 입력받은 값이 문자형인 경우 자주 사용합니다.

console.log(
	Number('1234') // 숫자 1234가 나옵니다.
)
console.log(
	Number('1234sfdasdf') // 문자가 섞이면 NaN이 나오니 주의해야 합니다.
)
console.log(
	Number(true) // true 의 숫자형은 1입니다.
 	Number(false) // false 의 숫자형은 0입니다.
)

---

Boolean() 은 false 케이스만 기억하면 됩니다. 숫자 0 빈문자열 null undefined NaN 이런 값들은 모두 false 이고 나머지는 true 입니다.

---

몇가지 주의사항입니다.

Number(null) // 0
Number(undefined) // NaN
// 사용자로부토 정보를 입력받는데 그냥 취소버튼을 누르면 null 이 됩니다. 그럼 넘버는 0입니다. 

Boolean(0) // false
Boolean('0') // true - 0이란 문자가 들어간 것

Boolean('') // false - 빈 문자열은 false
Boolean(' ') // true - 문자열에 공백이 들어가면 true