매일 해내는 개발/자바스크립트

[자바스크립트] 기본 자료형, 형변환

해야지 2022. 11. 9. 20:03
반응형

자바스크립트의 기본 자료형 정리

자바스크립트에서 값은 항상 문자열이나 숫자형 같은 특정한 자료형에 속한다.

자바스크립트에는 여덟 가지 기본 자료형이 있다.
자바스크립트의 변수는 자료형에 관계없이 모든 데이터일 수 있다.
따라서 변수는 어떠한 순간에 문자열일 수 있고 다른 순간엔 숫자가 될 수도 있다.

//no error
let message = "hello";
message = 123456;

1. 숫자형
정수, 부동 소수점 숫자 등의 숫자를 나타낼 때 사용, 정수의 한계는 ±2의 53승이다.
일반적인 숫자 외에 Infinity, -Infinity, NaN 같은 특수 숫자 값이 포함된다.
Infinity는 어떤 숫자보다 더 큰 특수 값, 무한대를 나타내고
NaN은 계산 중에 에러가 발생했다는 것을 나타낸다.

2. bigInt 
길이 졔약 없이 정수를 나타낼 수 있다.
 암호 관련 작업같이 아주 큰 숫자가 필요한 상황이거나 아주 높은 정밀도로 작업을 해야 할 때는 이런 큰 숫자가 필요하다.
숫자 끝에 'n'이 붙으면 BigInt형 자료이다.
*IE 브라우저에서는 지원하지 않는다

const bitInt = 1234567890123456789012345678901234567890n;

3. 문자형
따옴표로 묶는다. 글자형(char)은 없다.
*따옴표의 종류
  1) 큰따옴표: "Hello"
  2) 작은따옴표: 'Hello'
  3) 역따옴표(백틱): `Hello`

큰따옴표와 작은따옴표는 기본적인 따옴표로 자바스크립트에서는 이 둘에 차이를 두지는 않는다.
역따옴표는 백틱 안에 ${...}을 넣어 원하는 변수나 표현식을 문자열 중간에 손 쉽게 넣을 수 있다.

let name = "John";

// 변수를 문자열 중간에 삽입
alert( `Hello, ${name}!` ); // Hello, John!

// 표현식을 문자열 중간에 삽입
alert( `the result is ${1 + 2}` ); // the result is 3

4. 불린형(논리 타입)
true, false를 나타낼 때 사용합니다.

5. null
null 값만을 위한 독립 자료형이다. null은 알 수 없는 값을 나타낸다.

6. undefined
undefined 값만을 위한 독립 자료형입니다. undefined는 할당되지 않은 값을 나타냅니다.

7. 객체형
복잡한 데이터 구조를 표현할 때 사용한다.

8. 심볼형
객체의 고유 식별자를 만들 때 사용한다.


자바스크립트 형변환

1. 문자형으로 변환하는 방법
String() 함수 사용

let value = true
console.log(typeof value); //boolean

value = String(value);
console.log(typeof value); //string


2.  숫자형으로 변환
  1) 수학과 관련된 함수와 표현식에서 자동으로 일어난다.

console.log("6"/"2"); //3

  2) Number() 함수 사용

let str="123";
console.log(typeof str); // string

let num = Number(str);
console.log(typeof num); // number

만약 숫자 이외의 글자를 숫자로 형변환 하려고 한다면

전달받은 값형 변환 후

전달받은 값 형 변환 후
undefined NaN
null 0
true and falsue 1과 0
string 문자열의 처음과 끝 공백이 제거됩니다. 공백 제거 후 남아있는 문자열이 없다면 0, 그렇지 않다면 문자열에서 숫자를 읽습니다. 변환에 실패하면 NaN이 된다.
alert( Number("   123   ") ); // 123
alert( Number("123z") );      // NaN ("z"를 숫자로 변환하는 데 실패함)
alert( Number(true) );        // 1
alert( Number(false) );       // 0

 

3. 불린형으로 변환
논리 연산을 수행할 때 발생한다. Boolean()를 호출하면 명시적으로 형 변환을 수행할 수 있다.

전달받은 값 형 변환 후
0, null, undefined, NaN, "" false
그 외의 값 true
alert( Boolean(1) ); // 숫자 1(true)
alert( Boolean(0) ); // 숫자 0(false)

alert( Boolean("hello") ); // 문자열(true)
alert( Boolean("") ); // 빈 문자열(false)

 

형변환 시 예외 사항

  • 숫자형으로 변환 시 undefined는 0이 아니라 NaN이 됩니다.
  • 문자열 "0"과 " "같은 공백은 불린형으로 변환 시 true가 됩니다.
반응형