IT/JavaScript

10. 자바스크립트(JavaScript) 자료형 변환

뀨뿌뀨뿌 2021. 10. 24. 21:43

1. 자료형 변환

  • 자바스크립트에서는 자료형 간 변환을 지원합니다.
  • 숫자형 변수값을 문자형으로 변환하거나 문자형 변수값을 숫자형으로 변환할 수 있습니다.
    => 이를 자료형 변환(type coercion) 또는 형 변환이라고 합니다.
  • 자료형을 변환하기 위한 방법으로는 개발자가 직접 명시적으로 자료형을 변환하거나, 자바스크립트 엔진에 의해 자동으로 자료형이 변환되는 방법이 있습니다.
  • 보통 console 로 값을 문자열로 출력할 때, 내장 객체의 함수나 연산자를 사용하여 자료형 변환이 가능합니다.
  • 엔진에 의해 자동으로 자료형이 변환되는 것은 자바스크립트가 동적 자료형 언어이기 때문에 적용되는 특징입니다.
    => 개발자가 작성한 코드가 어떠한 의도를 품고 있던 간에 자바스크립트가 미리 정해놓은 규칙에 따라 자료형이 변환됩니다.
// 자동으로 자료형이 변환되는 경우 연산자에 따라 반환 결과가 다름
// + 연산자는 대입된 값에 따라 숫자형 또는 문자형으로 반환
// 뺄셈, 곱셈, 나눗셈 연산자는 항상 숫자형을 반환
console.log("5" +  1)          // 51
console.log("5" - 1)           // 4
console.log("5" * 2)           // 10
console.log("There is " + 5)   // There is 5
console.log("Five" * 2)        // NaN

// 연산자를 활용한 자료형 변환
let str = 5 + "1"
console.log(str)               // 51
console.log(typeof str)        // String
/*
문자열 5와 숫자형 1을 더한 표현식은 1이 문자열 "1"로 변환되어 51을 반환
+ 연산자가 다른 자료형끼리의 연산에서 숫자형보다 문자열을 우선 순위로 처리함
=> 자료형을 확인하면 문자형이 출력됨
*/

let num = +str
console.log(num)               // 51
console.log(typeof num)        // number
// 단항 양수(+)를 통해 문자형을 숫자형으로 변환할 수 있음

// 함수를 활용한 자료형 변환
str = String(num)
console.log(str)               // 51
console.log(typeof str)        // String

num = Number(str)
console.log(num)               // 51
console.log(typeof num)        // number
// 명시적으로 자료형을 변환할 때에는 내장 객체 함수를 사용
// String 객체에 값을 넣으면 문자형으로, Number 객체에 값을 넣으면 숫자형으로 변환