[JavaScript] 자바스크립트 데이터 타입 변환하기

2022. 6. 6. 20:54Program/JavaScript

073_자바스크립트 데이터 타입 변환하기

[적용]

  • 숫자를 문자열로 변환하고 싶을 때
  • 문자열을 숫자로 변환하고 싶을 때

[문법]

메소드 의미 반환
Boolean(데이터) 데이터를 진리값 타입으로 변환  진리값
String(데이터) 데이터를 문자열 타입으로 변환  문자열
Number(데이터) 데이터를 숫자 타입으로 변환 숫자
parseInt(문자열) 문자열을 숫자(정수) 타입으로 변환 숫자
parseFloat(문자열) 문자열을 숫자(부동 소수점) 타입으로 변환 숫자

[내용]

숫자 100과 문자열 '200'의 덧셈 계산을 하려면 먼저 문자열을 숫자 타입으로 변환해야 한다.

number()를 사용해 타입 변환 후 덧셈을 계산하는샘플을 확인해 보자.

const result = 100 + Number('200');
console.log(result);  // 결과: 300

 

다음에서 타입의 변환을 확인해 보자. Boolean()과 String() 등의 메소드를 사용해 데이터 타입을 변환하는 것을

명시형 변환이라고 한다.

Boolean(1);  // true
Boolean(0);  // false
Boolean('사자');  // true
Boolean('');  // false

String(1);  // "1"

Number('1');  // 1
Number(0);  // 0
Number('사자);  // NaN
Number(true);  // 1
Number(false);  // 0

[Appendix 1]

암시형 변환

데이터 타임이 자동으로 변환되는 것을 암시형 변환이라고 한다.

명시형 변환과 반대의 의미다.

console.log(100 + '200');  // 결과: '100200' (숫자 100이 문자열 타입으로 변환됨)
console.log('200' - 100);  // 결과: 100 (문자열 '200'이 숫자 타입으로 변환됨)
console.log(1 == '1');  // 결과: true (숫자 1이 문자열 타입으로 변환됨)

암시형 변환의 숫자 타입과 문자열 타임의 + 연산은 타입 위치에 따라 결과가 바뀐다.

모든 법칙을 다 외워서 사용하는 데는 무리가 있고 가독성도 떨어지므로 해결책으로 명시형 변환을 사용한다.

데이터와 타입을 모두 비교하는 경우는 == 가 아닌 ===를 사용한다.


[Appendix 2]

변수의 동적 타입 변환

자바스크립트의 데이터는 문자열, 숫자, 질리값 등의 타입이 필수 요소이다.다음의 코드는 변수 a의 선언에 숫자 타입을 대입하지만, 이어서 문자열을 대입한다.문자열 '사자'를 대입하면 변수 a는 문자열 타입으로 변환된다. 자바스크립트는 동적 타입 변환을 하는 언어로, 다음과 같은 코드에서도 에러가 발생하지 않는다.

let a = 10; // a는 숫자 타입
a = '사자';  // a가 문자열 타입으로 변환됨

 

 

 

 

 

 

참조 :
실무에 바로 적용하는 자바스크립트 코드레시피 278
아케다 야스노부, 카노 타케시 지음 / 이춘혁 옮김