TIL 92일차_Null Check

테스트코드를 보면서,
불라불라 == null 이라는 조건을 보면서
왜 null일까 undefined로 하면안될까?
왜 strict equality operator(===)가 아닌 ==를 쓸까?
같은 질문들이 생겨서 조금 찾아봤다!

null과 undefined

JavaScript에는 '없음'를 나타내는 값이 두 개 있는데, 바로 null와 undefined이다.
두 값의 의미는 비슷하지만, 각각이 사용되는 목적과 장소가 다르다.

JavaScript는 값이 대입되지 않은 변수 혹은 속성을 사용하려고 하면 undefined를 반환한다.

let foo;
foo // undefined

const obj = {};
obj.prop; // undefined

null은 객체가 없음을 나타낸다. 실제로 typeof 연산을 해보면 아래와 같은 값을 반환한다.

typeof null // 'object'
typeof undefined // 'undefined'

그렇다면 개발자의 입장에서 '없음'을 저장하기 위해 둘 중 어떤 것을 써야 할까?
undefined를 쓴다고 가정해보면, 아래와 같은 코드는 그 의미가 불분명해진다.

let foo; // 값을 대입한 적 없음
let bar = undefined; // 값을 대입함
foo; // undefined
bar; // undefined (??)
let obj1 = {}; // 속성을 지정하지 않음
let obj2 = {prop: undefined}; // 속성을 지정함
obj1.prop; // undefined
obj2.prop; // undefined (??)

비록 undefined가 '없음'을 나타내는 값일지라도, 대입한 적 없는 변수 혹은 속성과,
명시적으로 '없음'을 나타내는 경우를 구분을 할 수 있어야 코드의 의미가 명확해 질 것이다.
프로그래머의 입장에서 명시적으로 부재를 나타내고 싶다면 항상 null을 사용하는 것이 좋다.

다만, 객체를 사용할 때 어떤 속성의 부재를 null을 통해서 나타내는 쪽보다는,
그냥 그 속성을 정의하지 않는 방식이 간편하므로 더 널리 사용된다.

// 이렇게 하는 경우는 많지 않습니다.
{
  name: 'Seungha',
  address: null
}

// 그냥 이렇게 하는 경우가 많습니다.
{
  name: 'Seungha'
}

// 어쨌든 이렇게 하지는 말아주세요.
{
  name: 'Seungha',
  address: undefined
}

Null check

값이 있는 경우와 없는 경우(null 혹은 undefined인 경우)를 확인하는 작업을 null check라고 한다.
null check는 간단히 등호를 이용해서 할 수 있다.

function printIfNotNull(input) {
  if (input !== null && input !== undefined) {
    console.log(input);
  }
}

그런데 매 번 위처럼 긴 비교를 해야 한다는 것은 골치아픈 일이다.
사실은 위 if 구문 안에 있는 식을 다음과 같이 줄여 쓸 수 있다.

// 아래 세 개의 식은 완전히 같은 의미입니다.
input !== null && input !== undefined;
input != null;
input != undefined;

// 아래 세 개의 식은 완전히 같은 의미입니다.
input === null || input === undefined;
input == null;
input == undefined;

자바스크립트에서 보통의 경우에는 strict equality comparison operator(===)를 사용하는 것이 권장되지만,
null check를 할 때 만큼은 abstract equality comparison operator(==)를 쓰는 것이 편리하다.
아래의 예제에서 ==와 === 두 연산자는 null과 undefined에 대해서 아래와 같이 동작한다.

null === undefined; // false
null == undefined;  // true

null == 1       // false
null == 'hello' // false
null == false   // false

undefined == 1       // false
undefined == 'hello' // false
undefined == false   // false

즉 ==연산자는 한 쪽 피연산자에 null 혹은 undefined가 오면,
다른쪽 피연산자에 null 혹은 undefined가 왔을 때만, true를 반환하고, 다른 모든 경우에 false를 반환한다.

따라서 null check를 할 때 만큼은 ==를 사용하는 것이 편리하다.

---

Reference

Hello World JavaScript