Front-End/JavaScript

[You Don't Know JS] #01 자바스크립트의 타입

koh1018 2022. 4. 5. 16:50
반응형

 

 

/* 이 글은 카일 심슨의 You Don't Know JS를 읽으며 배운 것들을 개인적으로 정리하고 기록하기 위한 글입니다. */

 

 

 

자바스크립트에는 다음과 같은 7가지의 내장 타입이 있다.

  • null
  • undefined
  • boolean
  • number
  • string
  • object
  • symbol (ES6부터 추가되었다.)

 

여기서 object를 제외한 타입들을 원시타입(Primitives)라고 한다.

 

값의 타입은 typeof 연산자로 알 수 있다.

그런데 놀라운 점은 typeof 반환 값은 항상 7가지 내장 타입과 1:1로 정확히 매칭되지는 않는다는 것이다.

 

undefined, boolean, number, string, object는 자신의 명칭과 동일한 문자열을 반환한다. (symbol은 여기서 다루지 않겠다.)

 

자신의 명칭과 다른 문자열을 반환하는 것에는 null이 있다.

typeof null === "object";	// true

이것은 20년간 이어져온 버그이고 이제와서 손보면 잘 돌아가던 웹 소프트웨어에 문제가 생길 수 있기에 해결될 가능성이 낮다고 한다. (상식적으로는 null이 반환되는게 맞다.)

 

따라서 null은 false와 다름없는 'falsy'한 유일한 원시 값이지만 타입은 'object'인 특별한 존재이다.

 

이 밖에 배열 또한 객체(object)이다.

typeof [1,2,3] === "object";	// true

배열은 키가 문자열인 객체와 반대로 숫자 인덱스를 가지며, length 프로퍼티가 자동으로 관리되는 등의 추가 특성을 지닌 객체의 '하위 타입'이라고 할 수 있다.

 

 

typeof가 반환하는 문자열은 하나 더 있다. 바로 function이다.

typeof function a(){ /* ... */ } === "function";	// true

위 반환 결과를 보면 마치 function이 최상위 레벨의 내장 타입처럼 보일 수 있다.

하지만 실제로는 객체의 '하위 타입'이다.

(함수는 '호출 가능한 객체(Callable Object / 내부 프로퍼티 [[Call]]로 호출할 수 있는 객체)'이다.)

 

함수에 선언된 인자 개수는 함수 객체의 length 프로퍼티로 알 수 있다.

 

 

 


 

 

자바 스크립트는 타입 강제(Type Enforcement)를 하지 않는다. 변숫값이 처음에 할당된 값과 동일한 타입일 필요는 없다.

값에는 타입이 있지만 변수엔 따로 타입이 없다.

변수는 언제라도, 어떤 형태의 값이라도 가질 수 있는 접시와 같은 존재이다.

 

값이 없는 변수의 값은 undefined이다.

 

var a;

typeof a;	// "undefined"

var b = 42;
var c;

b = c;

typeof b;	// "undefined"
typeof c;	// "undefined"

"undefined"(값이 없는)와 "undefined"(선언되지 않은(사실 undeclared가 의미가 맞다.))를 동의어처럼 생각하기 쉬운데 자바스크립트 엔진은 둘을 전혀 다르게 취급한다. 즉, 둘은 완전히 다른 개념이다.

 

재밌는 것은 선언되지 않은 변수도 typeof를 하면 "undefined"가 나온다는 점이다. 이것은 typeof만의 독특한 안전 가드(safety guard)라고 한다.

var a;
typeof a;	// "undefined"
typeof b;	// "undefined"

// b는 선언도 안했는데 오류가 뜨지않고 undefined가 나온다.

 

이렇게 자바스크립트는 값이 없는 경우와 선언되지 않은 경우의 용어를 undefined로 대충 섞어버려, 에러 메시지와 typeof 반환 값 모두 "undefined"로 뭉뚱그린다.

 

그래도 typeof 안전 가드 덕분에 선언되지 않은(undeclared) 변수에 사용하면 쓸만하게 사용할 수 있다.

반응형