JavaScript/데이터 타입/타입 변환

자바스크립트의 모든 값은 타입을 가지고 있습니다.
자바스크립트는 변수의 타입이 고정되어 있지 않습니다.
변수에 다른 타입의 값을 대입할 수 있습니다.
타입변환은 기존 원시값을 사용해 다른 타입의 새로운 원시값을 생성하는 것입니다.

let a = 10; // 숫자형
a = 'Hello World!'; // 문자열형 변환

1. 자동 타입 변환 (암묵적 타입 변환)

타입의 값을 기대하는 곳에 다른 타입의 값이 오면 자동으로 타입을 변환해서 사용합니다.

자바스크립트 엔진은 표현식을 평가할 때 컨텍스트(Context, 문맥)에 고려하여 암묵적 타입 변환을 실행합니다.

const a = '20'; // 문자열
const b = '10'; // 문자열

let result = a + b;
console.log(result); // 2010
result = a - b;
console.log(result); // 10
result = a * b;
console.log(result); // 200
result = a / b;
console.log(result); //2

const c = 'JavaScript';
result = c - a;
console.log(result); // NaN

+'1' + // 1 number
'str' + // NaN
null + // 0
undefined; // NaN

NaN (Not a Number)

정의되지 않은 값이나 표현할 수 없는 값

숫자로 변환할 수 없는 연산을 시도한 경우

자바스크립트 엔진은 불리언타입이 아닌 값을 Truthy 값(참으로 평가되는 값) 또는 Falsy 값(거짓으로 평가되는 값)으로 구분합니다.

false로 평가되는 Falsy 값

• false

• undefined

• null

• 0, -0

• NaN

• "" (빈 문자열)

2. 명시적 타입 변환

직접 타입을 변환할 필요가 있을 때 함수를 통해 타입 변환합니다.

• Number() : 문자를 숫자로 변환

• String() : 숫자나 불리언등을 문자형으로 변환

  • Object.prototype.toString() 메소드를 사용할 수도 있습니다.

• Boolean() : 문자나 숫자등을 불리언형을 변환

• Object() : 모든 자료형을 객체형으로 변환

• parseInt() : 문자열형을 int형(정수)으로 변환

• parseFloat() : 문자열형을 float(소수)형으로 변환

// Number()

const a = '20'; //문자열형
const b = '10'; //문자열형

const result1 = Number(a) + Number(b);
console.log(result1); // 30
const result2 = Number(a + b); // (x) 2010
console.log(result2); // 2010 (x) 원하는 답을 얻을 수 없다.
// String()
const c = 1;

console.log(String(c)); // '1'

console.log((1).toString()); // '1'

// Boolean()

Boolean(10); // true
Boolean(null); //false

// parseInt()

parseInt('10.5'); // 10

// parseFloat()

parseInt('10.5'); // 10.5

Reference

• 모던 자바스크립트 Deep Dive -이웅모
• 위키백과
• MDN