[You don't know JS] Part1 - 1장. 타입

Ch1. 타입

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

즉, 기계와 사람이 24와 "24" 를 다르게 처리한다면 두 값의 타입은 서로 다르다.

 

 

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

---

타입이 명확하지 않다.

어떤 타입으로든 형 변환이 일어난다.

따라서 그 실체를 잘 이해해야 어떻게 변하게 될지 예측이 가능해진다.

 

 

1.2 내장 타입

---

자바스크립트에는 7개의 내장 타입이 존재한다.

• null
• undefined
• number
• boolean
• string
• object
• symbol

object를 제외한 나머지를 원시 타입 이라고 한다.

typeof 연산자를 사용하여 각 변수의 타입을 확인할 수 있다.

하지만 정확히 1:1로 매칭되지 않는다.

 

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 function a() {} === 'function' // true 

typeof [1, 2, 3] === 'object' // true

typeof null === 'object' // true

 

 

null...?

null 의 typeof 값은 object 이다.

기존 레거시 코드가 너무 많아서 이제와서 고치기 어렵기 때문에 그냥 두고 있는 중이다.

null을 체크하는 방법은 falsy를 활용한다.

null은 유일하게 falsy한 원시타입임과 동시에 object 타입이다.

var a = null; if (!a && typeof a === 'object') { // do something! }

falsy

• 0
• -0
• false
• ""
• null
• undefined
• NaN

truthy

falsy를 제외한 모든것은 truthy

빈 배열도 truthy이다.

 

function...?

typeof function 의 function은 object의 하위 타입이다.

정확하게는 호출 가능한 object를 의미한다.

내부에 [[Call]] 프로퍼티를 가지고 있는 객체이다.

function의 length 는 params의 length 이다.

var func1 = function(a, b) { }; func1.length; // 2

그럼 typeof와 instance of 는 어떤 차이를 가지고 있을까??

 

typeof와 instanceof 의 차이

 

typeof

값의 기본형을 반환함

 

instanceof

비교연산자, object타입의 __proto__타입과 비교

 

const TestObj = function () {}; const TestObj2 = function () {}; const testObj = new TestObj(); console.log(typeof testObj); /** 'object' */ console.log(testObj instanceof Object); /** true */ console.log(testObj instanceof TestObj); /** true */ console.log(testObj instanceof TestObj2); /** false */

 

 

1.3 값은 타입을 가진다.

값은 타입이 있지만 변수엔 타입이 없다.

변수는 언제든 변경이 가능하다.

undefined vs undeclared

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

undefined와 undeclared는 전혀 다른 개념이다.

undefined는 접근 가능한 스코프에 변수가 선언되어있지만 값이 할당되지 않은 경우이고

undeclared는 접근 가능한 스코프에 변수 자체가 선언되지 않은 상태를 의미한다.

하지만 undeclared의 typeof값은 "undefined"이다.

⇒ 이걸 safety guard라고 한다니...

undeclared 체크

undeclared를 확인하기 위해 typeof를 활용하기도함.

app.js import {add} from 'cal.js'; // 에러 발생 if (DEV) { // error! } if (typeof DEV === 'undefined') { // do something! }

전역으로 생성해둔 DEV 라는 변수는 다른 파일에서 생성한다.

그치만 app.js 입장에선 있는지 없는지 모르는 변수로,

개인적인 생각으로 undeclared 관련된 이슈는 타입이 정확하지 않은, 인터프리터 언어의 특징으로 인해 나온것같다. 최근 typescript를 보며 점차 이러한 이슈들은 사라질거라고 생각한다.

 

 

1.4 정리

• javascript는 7개의 타입이 있음.

• 변수는 타입이 없지만 값은 타입이 있음

• undefined와 undeclared는 서로 다르다. undefined는 선언은 되었지만 값이 없는것 undeclared는 선언도 되지 않은것