본문은 JavaScript 언어에 대한 이해를 높이기 위해 "You Don't Know JS(카일 심슨 저)"를 읽고 공부한 내용을 정리한 글입니다. 공부가 목적이기 때문에 필요에 따라 생략이나 수정, 추가된 부분이 있을 수 있습니다.
1. 자바스크립트의 내장 타입
7가지 내장 타입
자바스크립에는 다음 7가지 내장 타입이 있으며, object를 제외한 나머지 6가지 타입을 원시 타입(Primitives)라고 한다.
- null
- undefined
- boolean
- number
- string
- object
- symbol (ES6부터 추가)
typeof를 이용한 타입 확인
값 타입은 typeof 연산자를 이용해 알 수 있는데, undefined, boolean, number, string, object, symbol의 6가지 타입은 자신의 명칭과 동일한 문자열을 반환하지만, null은 'object'를 반환한다.
typeof undefined === "undefined" // trie
typeof true === "boolean" // true
typeof 42 === "number" // true
typeof "42" === "string" // true
typeof { a: 1 } === "object" // true
typeof Symbol() === "symbol" // true
typeof null === "object" // true
따라서 타입으로 null 값을 정확히 확인하기 위해선 아래와 같이 작성해야 한다.
const a = null;
(!a && typeof a === "object") // true
또한, typeof는 다음과 같은 결과를 반환한다.
typeof function a(){ /*...*/ } === "function" // true
typeof [1, 2, 3] === "object" // true
위 결과를 보면 function이 최상위 레벨의 내장 타입처럼 보이지만, 실제로는 object의 하위타입이며 보다 정확히 말하자면 함수는 호출 가능한 객체(Callable Object)다. 마찬가지로 배열도 object의 하위타입이다.
2. 값은 타입을 가진다.
값은 타입이 있지만, 변수엔 따로 타입이 없다. 또한, 변수는 언제라도, 어떤 형태의 값이라도 가질 수 있다. 왜냐하면 자바스크립트는 타입 강제(Type Enforcement)를 하지 않기 때문이다.
값이 없는 vs 선언되지 않은
'undefined'(값이 없는)와 'undeclared'(선언되지 않은)은 자바스크립트에서 완전히 다른 개념이다.
- undefined: 접근 가능한 스코프 내에서 변수가 선언되었으나 현재 아무런 값도 할당되지 않은 상태
- undeclared: 접근 가능한 스코프 내에서 변수 자체가 선언조차 되지 않은 상태
여기서 파생되는 몇가지 문제가 있다.
모호한 에러 메시지
const a
a // undefined
b // ReferencError: b is not defined
b라는 변수는 분명 선언되지 않은 상태이지만, "b is not defined"라는 에러메시지가 출력된다. 따라서 자바스크립트 내에서 "b is undefined"와 "b is not defined"는 다르다는 것을 주의해야 한다.
typeof 연산
const a
typeof a // "undefined"
typeof b // "undefined"
typeof 연산의 결과로 값이 없는 변수와 선언되지 않은 변수 모두 undefined를 반환한다.
3. 정리
- 자바스크립트엔 7가지 내장 타입(null, undefined, boolean, number, string, object, symbol)이 존재하며, typeof 연산자로 타입을 확인할 수 있다.
- 변수는 타입이 없지만 값은 타입이 있고, 타입은 값의 내제된 특성을 정의한다.
- 자바스크립트 내에서 'undefined'와 'undeclared'는 엄연히 다른 개념이다.
'프로그래밍 언어 > JavaScript + TypeScript' 카테고리의 다른 글
[스크랩] JavaScript(ES6), TypeScript, Node.js 개발자를 위한 무료 e북 4가지 (0) | 2021.06.22 |
---|---|
[You Don't Know JS] 2. 값(Value) (0) | 2021.06.22 |
[JavaScript] 함수 선언문 vs 함수 표현식 (0) | 2021.03.23 |
[JavaScript] 펼침 연산자: spread operator (0) | 2021.02.17 |
[JavaScript] 변수 선언: const, let, var 차이 (2) | 2021.02.14 |