만들어가는 세상

[JAVASCRIPT] Null check 빈 값 체크 로직 공통 처리하면 유용 합니다. 본문

IT/JAVASCRIPT

[JAVASCRIPT] Null check 빈 값 체크 로직 공통 처리하면 유용 합니다.

윤재웅 2020. 3. 5. 11:52

JavaScript는 데이터형에 대해서 꽤 자유로운 언어입니다.

var value = 1; //  Number 형 1
console.log(value, typeof value); // 1 number

value = "1" // String 형 1
console.log(value, typeof value); // 1 string
이렇게 처음에 value에 정수형 1을 넣고 변수 생성후에

로그를 찍으면 1인 정수가 나오고

문자형 '1'을 value에 넣을수 있습니다.

자바와 c 같은 타입을 확실히 검사하는 언어와는 다릅니다.

자바스크립트에서 어떤 값이 비어있는지 체크하려면

var value2 = ""
if( value2 == ""){
  console.log("비어 있음");
}else{
  console.log("값이 있음");
}
비어있음 출력

이렇게 하지말고

var value2 = ""
if( !value2 ){
  console.log("비어 있음");
}else{
  console.log("값이 있음");
}
이런식으로 not 연산을 해줍니다.

자바스크립트 자료형에서 false로 반환되는 값은

"", null, undefined, 0, NaN 이 있고

나머지는 모두 true

if('' || null || undefined || 0 || NaN){
  // ...
}else{
  console.log("여기가 실행");
}
if 조건식에 true로 반환되는 값이 하나도 없어서 else 문이 실행됩니다.



하지만, 어떤 값이 들어올지 모르는 상황에서 빈값이 생기는 경우는 단순히 빈문자열( ' ' ), null 값, 정의되지 않은 값(undefined) 말고 빈 배열( [] ), 빈 객체( {} ) 가 있을 수 있습니다.

그리고 중요한 0, 0은 실제로 비어있지 않은 특정값 0을 의미 할수도 있지만 이경우엔 false를 반환합니다.
그래서 어떤 값이 자료형에 상관없이 빈 값인지 알고 싶을때는

// 넘어온 값이 빈값인지 체크합니다.
// !value 하면 생기는 논리적 오류를 제거하기 위해
// 명시적으로 value == 사용
// [], {} 도 빈값으로 처리
var isEmpty = function(value){
  if( value == "" || value == null || value == undefined || ( value != null && typeof value == "object" && !Object.keys(value).length ) ){
    return true
  }else{
    return false
  }
};

이런식으로 명시적으로 빈 값을 체크하는 함수를 사용합니다.
Comments