상세 컨텐츠

본문 제목

[You don't know JS] Part 1 - 1 타입

Programming/JavaScript

by 겨리! 2022. 8. 2. 00:53

본문

 

 

Chapter 1. 타입

'타입' 이란 자바스크립트 엔진, 개발자 모두에게 어떤 값을 다른 값과 분별할 수 있는, 고유한 내부  특성의 집합을 뜻한다.

 

1.1 타입, 그 실체를 이해하자

자바스크립트에서 강제변환은 어떤 형태로든 일어날 수 있다. 

그러므로 타입을 (내재된 특성까지)  확실하게 인지하고사용하는 것이 중요하다.

 

1.2 내장 타입

  • null
  • undefined
  • boolean
  • number
  • string
  • object
  • symbol(ES6~)

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

typeof undefined === "undefined"; // true
typeof true === boolean; // true 
typeof 42 === number; // true
typeof "42" === string; // true
typeof {life: 42} === "object"; // true
typeof Symbol() === "symbol"; // true

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

// 타입으로 null 값을 정확히 확인하려면
const a = null;
(!a && typeof a === "object") // true

 

typeof null === "null";  의 결과는 false ????

typeof null === "null" 이 true 였으면 좋겠지만  typeof null 의 결과는 "object"이다.

이는 자바스크립트 초기 버전의 버그로 실제 typeof 구현 코드 내용 중 null을 체크하는 부분이 빠져있어 "object" 로 나타난다고 한다.  해당 버그는 오랜 기간  동안 유지되어왔고, 이제와서 고치기엔 위험부담이 크므로..수정하지 않는다고 한다!

(실제로 ECMAScript에 수정제안이 들어왔지만 거절했다고함)

해당 내용은 참고에 적힌 사이트에서 자세히 설명되고 있다.

 

타입으로 null 값을 정확히 확인하려면 코드에 적힌대로 falsy를 활용하면 된다. 

null은 falsy한(false나 다름없는) 유일한 원시 값이지만, 타입은 'object' 이다.

 

typeof function test(){ /* ... */ } === "function"; // true
typeof [1,2,3] === "object"; // true

 

typeof function test(){...}  === "function" 의결과는 true????

코드만 보면 function이 최상의 레벨의 내장타입처럼 보이지만 실제로는 object의 하위타입이다.

함수는 '호출 가능한 object' 이며, 내부 프로퍼티 [[Call]]로 호출할 수 있는 객체이다.

함수는 object이기  때문에 함수에 프로퍼티를 둘 수 있고, 함수에 선언된 인자 개수를 함수 object의 length 프로터티로 알 수 있다.

 

그렇다면 배열은 ?

그냥 object!

배열은 숫자 인덱스를 가지며 length 프로퍼티가 자동으로 관리되는 등의 추가 특성을 지닌 object의 하위타입이다.

 

1.3 값은 타입을 가진다.

값에는 타입이 있지만 변수에는 타입이 없다. 변수는 어떤 형태의 값이라도 가질  수 있다.

typeof 연산자를 이용하여 변수의 타입을 확인하는 건 정확히 "이 변수에 들어있는 값의 타입이 무엇인가?" 라고 묻는것과 같다.

 

1.3.1 undefined vs undeclared

  • undefined : 접근 가능한 스코프에 변수가 선언되었으나 현재 아무런값도 할당되지 않은 상태
  • undeclared : 접근 가능한 스코프에 변수 자체가 선언조차 되지 않은 상태

✔ undefined 와 is not defined 의 의미는 완전히 다르다는 것을 기억하자!

 

 

1.3.1 undeclared(선언되지 않은 변수)

const a;
typeof a; // "undefined"
typeof b; // "undefined"

 

선언되지 않은 변수도 typeof 하면 "undefined" 로 나온다 ??

선언되지 않은 변수를 typeof 해도 브라우저는 오류 처리를 하지 않는다.

 

→ typeof 만의 safe guard 때문이다.

 

1.4  정리

  • 자바스크립트에는 7가지의 내장 타입이  있고, typeof 연산자로 타입명을 알아낼 수 있다.
  • 변수는 타입이 없지만 값은 타입이 있다. 
  • undefined 는 선언된 변수에 할당할 수 있는 값, undeclared는 변수 자체가 선언된 적이 없음을 뜻하므로 서로 다른 개념이다.
  • 하지만 자바스크립트에서는 에러메세지도 헷갈릴 뿐만 아니라 undeclared의 typeof  반환 값 또한 "undefined" 로 나타나기 때문에 헷갈릴 수 있다.

[참고]

-  typeof null 의 역사 :  https://2ality.com/2013/10/typeof-null.html

 

The history of “typeof null”

Book, exercises, quizzes (free to read online)

2ality.com

- https://curryyou.tistory.com/183

 

[JS] 자바스크립트 null은 객체? 기본 타입! (typeof null)

# 자바스크립트 null? 자바스크립트의 null은 '의도적으로 값이 없음'을 명시하기 위한 기본 데이터 타입이다. 타입도 null이며, 값도 null인 Primitive Type이다. 즉, null은 객체가 아니다!(기본 타입이다!

curryyou.tistory.com

 

이 포스트는 You Don't Know JS 서적을 공부할 목적으로  작성하였습니다.

관련글 더보기

댓글 영역