[javascript] 자바스트립트 형변환 함수 정리

728x90

목 차

• 1. 문자열 변환 (String())
• 1-1. String() 사용 방법
• 1-2. String() 사용 예제
• 2. 숫자 변환 (Number())
• 2-1. Number() 사용 방법
• 2-2. Number() 사용 예제
• 3. 불리언 변환 (Boolean())
• 3-1. Boolean() 사용 방법
• 3-2. Boolean() 사용 예제
• 4. parseInt()와 parseFloat()
• 4-1. parseInt()와 parseFloat() 사용 방법
• 4-2. parseInt()와 parseFloat() 사용 예제
• 5. toString() 메서드
• 5-1. toString() 사용 방법
• 5-2. toString() 사용 예제
• 6. JSON.stringify()와 JSON.parse()
• 6-1. JSON.stringify()와 JSON.parse() 사용 방법
• 6-2. JSON.stringify()와 JSON.parse() 사용 예제

 

자바스크립트 형변환 함수들 정리해보기

JavaScript에는 데이터 타입을
다른 형식으로 변환하는 다양한 형변환 함수들이 존재합니다.
이들 함수는 값을 명시적으로 변환할 때 사용되며,
숫자와 문자열, 불리언, 객체 등
다양한 타입 간에 자유롭게 전환할 수 있습니다.

1. 문자열 변환 (String())

• String() 함수는 숫자, boolean, 객체 등 다양한 데이터 타입을 문자열로 변환합니다.

 

1-1. String() 사용 방법

• 매개변수 value 값을 문자열 타입으로 변환합니다.

String(value)

 

1-2. String() 사용 예제

String(123);        // "123"
String(true);       // "true"
String(null);       // "null"
String(undefined);  // "undefined"
String([1, 2, 3]);  // "1,2,3" (배열은 쉼표로 구분된 문자열로 변환)

 

2. 숫자 변환 (Number())

• Number() 함수는 주어진 값을 숫자 타입으로 변환합니다. 변환할 수 없는 경우에는 NaN을 반환합니다.

 

2-1. Number() 사용 방법

• 매개변수 value 값을 숫자 타입으로 변환합니다.

Number(value)

 

2-2. Number() 사용 예제

Number("123");       // 123
Number("123.45");    // 123.45
Number("hello");     // NaN (변환 불가)
Number(true);        // 1 (true는 1로 변환)
Number(false);       // 0 (false는 0으로 변환)
Number(null);        // 0
Number(undefined);   // NaN (undefined는 숫자로 변환할 수 없음)

 

3. 불리언 변환 (Boolean())

• Boolean() 함수는 값을 불리언 값(true 또는 false)으로 변환합니다. False 값(0, "", null, undefined, NaN)은 false로, 나머지 값은 true로 변환됩니다.

 

3-1. Boolean() 사용 방법

• 매개변수 value의 값을 boolean 데이터 타입으로 변환합니다. (true 또는 false)

Boolean(value)

 

3-2. Boolean() 사용 예제

Boolean(1);           // true
Boolean(0);           // false
Boolean("hello");     // true
Boolean("");          // false (빈 문자열)
Boolean(null);        // false
Boolean(undefined);   // false
Boolean(NaN);         // false

 

4. parseInt()와 parseFloat()

4-1. parseInt()와 parseFloat() 사용 방법

parseInt() : 문자열을 정수형 숫자로 변환합니다. 문자열 내의 숫자 부분만 변환하며, 첫 번째로 나타나는 숫자가 아닌 문자를 만날 때까지 변환을 수행합니다. 또한 매개변수 radix는 변환할 진수 2부터 36 사이의 값이 가능합니다. 기본값은 10입니다.

parseInt(string, [radix])

 

parseFloat() : 문자열을 소수점 숫자로 변환합니다. 소수점을 포함한 숫자를 변환할 때 유용하며, parseInt()와 같이 숫자가 아닌 문자를 만나면 그 부분에서 변환을 멈춥니다.

parseFloat(string)

 

4-2. parseInt()와 parseFloat() 사용 예제

parseInt("123");         // 123
parseInt("123abc");      // 123 (문자 이후 무시)
parseInt("0xF", 16);     // 15 (16진수)
parseInt("101", 2);      // 5 (2진수)
parseInt("hello");       // NaN (숫자로 시작하지 않음)
parseFloat("123.45");    // 123.45
parseFloat("123.45abc"); // 123.45 (문자 이후 무시)
parseFloat("hello");     // NaN

 

5. toString() 메서드

• toString() 메서드는 숫자, 불리언, 객체, 배열 등 모든 타입을 문자열로 변환하는 메서드입니다. 또한 다른 진법으로 변환할 때 사용 가능합니다.

 

5-1. toString() 사용 방법

• radix: 변환할 진법 (2~36 사이의 값으로 지정 가능, 기본값 10)

value.toString([radix])

 

5-2. toString() 사용 예제

(123).toString();       // "123"
(123).toString(2);      // "1111011" (2진수로 변환)
true.toString();        // "true"
[1, 2, 3].toString();   // "1,2,3" (배열을 쉼표로 구분된 문자열로 변환)

 

6. JSON.stringify()와 JSON.parse()

• JSON.stringify()와 JSON.parse()는 JavaScript 객체를 JSON 문자열로 변환하거나, JSON 문자열을 JavaScript 객체로 변환하는 데 사용됩니다.

 

6-1. JSON.stringify()와 JSON.parse() 사용 방법

JSON.stringify() : JavaScript 객체나 배열을 JSON 형식의 문자열로 변환합니다. 

JSON.stringify(value, [replacer, space])

 

JSON.parse() : JSON 문자열을 JavaScript 객체로 변환합니다.

JSON.parse(text)

 

6-2. JSON.stringify()와 JSON.parse() 사용 예제

//JSON.stringify() 예제
const obj = { name: "John", age: 30 };
JSON.stringify(obj);      // '{"name":"John","age":30}'

//JSON.parse() 예제
const jsonString = '{"name":"John","age":30}';
JSON.parse(jsonString);  // { name: "John", age: 30 }