반응형

[JavaScript] Null check, 빈 값 체크 v2019

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
  }
  };
view rawisEmpty.js hosted with ❤ by GitHub

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

 

출처 : 이상학의 개발블로그 https://sanghaklee.tistory.com/3

반응형