[클린 코드 자바스크립트] 타입 검사

1. typof와 그 한계

자바스크립트 변수의 종류는 크게 Primitive와 Reference 으로 나눌 수 있다.
Primitive 타입은 대부분 typeof로 검사할 수 있지만 Reference 타입은 그렇지 않은 경우도 존재한다.

function myFunction() {}
class MyClass {}

console.log(typeof myFunction) // function
console.log(typeof MyClass) // function

const str = new String('문자열')

console.log(str) // Object

console.log(typeof null) // object (언어적 오류)

2. instanceof

instanceof를 사용해서도 타입을 검사할 수 있다. 하지만 Reference 타입의 경우엔 최상위에 Object 타입이기 때문에 실수가 생길 수 있다. 이런 경우엔 Object.prototype.toString.call()을 사용하여 해결할 수 있다.

const arr = []
const func = function() {}
const date = new Date()

arr instanceof Array
func instanceof function
date instanceof Date

Object.prototype.toString.call(new String(''))

3. undefined & null

null은 0이라는 숫자로 치환이 되지만 undefined는 0으로 치환되지 않음.
비어있는 값을 null 또는 undefined 둘 중 하나로 지정하는 것이 좋음.

console.log(typeof null); // Object
null + 10 // 10


let verb;
console.log(typeof verb); // undefined
undefined + 10 // NaN

4. eqeq 줄이기

Equality(==) 보다 Strict Equality(===) 사용하여 비교하는 것이 좋음.

<label for="ticketNum">Number of tickets you would like to buy: </label>
<input id="ticketNum" type="number" value="0">

const ticketNum = $('#ticketNum')
// 지양해야 되는 구현
ticketNum.value == 0 // true

// 지향해야 하는 구현
Number(ticketNum.value) === 0 // true
ticketNum.valueAsNumber === 0 // true

5. 형변환 주의하기

암묵적 형변환을 하지 말고 명시적으로 형변환을 사용하자.

6. isNaN

isNaN은 숫자인지 아닌지를 확인하는 방법이다. 만약 숫자형이라면 true를 그렇지 않다면 false를 반환한다. 하지만 기존의 isNaN은 느슨한 검사를 하고 Number.isNaN은 엄격한 검사를 하기 때문에 Number.isNaN을 사용해야 한다.

isNaN(123 + '테스트') // true

Number.isNaN(123 + '테스트') // false