자바스크립트에서 자료형 변환
자바스크립트는 자료형을 유연하게 다룰 수 있지만, 문자 ↔ 숫자 간 변환은 실무에서 자주 필요하다. 여기서는 숫자, 문자, 불리언 간 변환 방법을 설명한다.
1. 숫자를 문자로 바꾸기
숫자를 문자로 변환할 때는 String()
함수나 문자열 연산을 사용할 수 있다.
// 방법 1: String() 함수 사용
let age = 30;
let ageAsString = String(age); // "30"
console.log(typeof ageAsString); // "string"
// 방법 2: 빈 문자열과 더하기
let score = 100;
let scoreAsString = score + ""; // "100"
console.log(typeof scoreAsString); // "string"
- 실제 사용 팁:
String()
함수는 명시적이고 직관적이다.+ ""
방법은 간결하지만 코드의 의도를 명확히 드러내지 않아 초보자에게는 헷갈릴 수 있다.
2. 문자를 숫자로 바꾸기
숫자로만 이루어진 문자열은 아래 방법으로 숫자로 변환할 수 있다.
// 방법 1: Number() 함수 사용
let height = "175";
let heightAsNumber = Number(height); // 175
console.log(typeof heightAsNumber); // "number"
// 방법 2: 곱하기 연산 사용
let width = "200";
let widthAsNumber = width * 1; // 200
console.log(typeof widthAsNumber); // "number"
// 주의: 문자가 포함된 문자열은 NaN을 반환한다.
let invalidNumber = Number("123abc"); // NaN
console.log(invalidNumber); // NaN
- 실제 사용 팁:
Number()
함수는 명시적으로 변환 의도를 드러낸다.- 곱하기 연산(
1
)은 간결하지만 의도를 드러내지 않아 코드 가독성을 떨어뜨릴 수 있다.
3. 자료형을 불리언(true/false)으로 바꾸기
자바스크립트에서 0
, null
, undefined
, NaN
, ""
는 false
로 평가되며, 나머지는 모두 true
로 평가된다.
3.1. 문자를 true/false로 변환
let greeting = "Hello";
// Boolean() 함수 사용
console.log(Boolean(greeting)); // true
// if 문에서 바로 사용
if (greeting) {
console.log("greeting은 true로 평가됩니다.");
}
let emptyString = "";
console.log(Boolean(emptyString)); // false
- 핵심: 빈 문자열(
""
)은false
, 나머지 문자열은 내용과 상관없이true
로 평가된다.
3.2. 숫자를 true/false로 변환
let number = 42;
console.log(Boolean(number)); // true (0이 아닌 숫자는 true)
let zero = 0;
console.log(Boolean(zero)); // false (0은 false)
// if 문에서 사용
if (number - zero) {
console.log("0이 아닌 결과는 true로 평가됩니다.");
}
- 핵심: 0은
false
, 나머지 숫자는 모두true
로 평가된다.
4. 예외 및 주의사항
4.1. 문자열에 숫자가 섞여 있는 경우
let invalid = "123abc";
console.log(Number(invalid)); // NaN
console.log(invalid * 1); // NaN
- 숫자로 변환하려는 문자열에 문자가 포함되어 있으면 NaN(Not a Number)이 반환된다. 데이터가 숫자인지 검증이 필요하다.
4.2. 불리언 평가 주의
console.log(Boolean("0")); // true ("0"은 빈 문자열이 아니므로 true)
console.log(Boolean(0)); // false (숫자 0은 false)
- 문자열
"0"
은true
로 평가된다. 숫자0
과 혼동하지 않도록 주의해야 한다.
5. 요약
- 숫자 ↔ 문자 변환
String(value)
또는value + ""
로 숫자를 문자로 변환.Number(value)
또는value * 1
로 문자를 숫자로 변환.
- 불리언 변환
Boolean(value)
또는if (value)
로true/false
평가.0
, 빈 문자열,null
,undefined
,NaN
은false
, 나머지는 모두true
.
'바닐라 코드 > Java Script' 카테고리의 다른 글
9. 연산 (1) | 2024.12.11 |
---|---|
8. 브라우저 알림창 띄우기 (0) | 2024.12.10 |
6. 자바스크립트의 자료형 (0) | 2024.12.06 |
5. 변수와 상수 (3) | 2024.12.05 |
4. use strict (1) | 2024.12.04 |