그럼에도 불구하고

👨‍💻

[CleanCode] 타입 검사 본문

JavaScript/Clean code

[CleanCode] 타입 검사

zenghyun 2023. 5. 24. 16:49

자바스크립트 내에서 유효성 검사를 할 때 흔히 타입 검사를 하고는 합니다.

 

타입 검사에 대해 알아보겠습니다. 

 

 

1
2
3
4
5
6
7
8
9
10
11
class MyClass {}
const str = new String('문자열')
 
typeof '문자열'  => 'string'
typeof true => 'boolean' 
typeof undefined => 'undefined'
typeof 123 => 'number'
typeof Symbol() => 'symbol'
typeof MyClass => 'function'
typeof str => 'object'
typeof null => 'object' // 언어적인 오류 
cs

 

위의 결과 값, 모두 납득이 가시나요?

 

[ PREMITIVE vs REFERENCE ]

PREMITIVE value의 경우 typeof로 잘 구분할 수 있지만 REFERENCE value의 경우는 typeof로 구분하기가 어렵습니다.

 

자바스크립트는 동적으로 변하는 언어이기 때문에 타입도 동적입니다. 이로 인해 동적인 타입까지 검사하기가 어려워서 주의를 해야 합니다.

 

따라서 REFERENCE value 검사할 때는 typeof 보다는  instanceof를 사용하는 것이 객체를 확인하는 데 있어 더 용이합니다. 하지만 instanceof도 완벽하게 검사를 해내지는 못합니다. 

 

아래의 예시를 보겠습니다. 

 

1
2
3
4
5
6
7
const arr = [];
const func = function() {} 
const date = new Date() 
 
arr instanceof Array => true
func instanceof Function => true
date instanceof Date => true 
cs

 

위의 코드는 딱히 문제가 없어 보이지만 prototype을 보다보면 최상위 타입에 Object가 있기 때문에 아래와 같은 혼란을 야기할 수 있습니다. 

 

1
2
3
4
5
6
7
const arr = [];
const func = function() {} 
const date = new Date() 
 
arr instanceof Object => true
func instanceof Object => true
date instanceof Object => true 
cs

 

그렇기에 REFERENCE value 값을 검사할 때는 아래와 같이 검사하는 방법을 추천드립니다!! 

 

1
2
3
4
5
6
7
const arr = [];
const func = function() {} 
const date = new Date() 
 
Object.prototype.toString.call(arr) => `[Object Array]`
Object.prototype.toString.call(func) => `[Object Function]`
Object.prototype.toString.call(date) => `[Object Date]`
cs

 

 

요약하자면, 타입 검사를 할 때는 상황에 맞게 타입을 검사해야 합니다.

 

 

'JavaScript > Clean code' 카테고리의 다른 글

[CleanCode] 분기다루기  (0) 2023.05.30
[CleanCode] 경계 다루기  (0) 2023.05.25
[CleanCode] isNaN? is Not A Number?  (0) 2023.05.24
[CleanCode] undefined와 null의 차이  (0) 2023.05.24
[CleanCode] 변수에 대하여  (2) 2023.05.24
Comments