Core Javascript - undefiend vs null / 동등연산자 vs 일치연산자

이 글은 Core Javascript를 읽고 내용을 정리하였습니다. 2회독 하였지만 잘못된 내용의 지적을 감사히 받겠습니다.

undefined vs null

자바스크립트에서 '없음'을 나타내는 값은 두 가지가 있다. 바로 undefined와 null인데 두 값이 의미하는 내용이 미세하게 다르고 사용하는 목적이 다르기 때문에 알맞은 곧에서 사용해야된다. 제대로 사용하기 위해 정리 해본다.

undefined 와 null

undefiend는 사용자가 명시적으로 지정할 수도 있지만 값이 존재하지 않을 때 자바스크립트 엔진이 자동으로 부여하는 경우가 있다. 자바스크립트 엔진이 자동으로 부여하는 경우는 사용자가 어떠한 값을 지정할 것이라고 에상되는 상황임에도 실제로는 그렇게 하지 않았을 때 undefined를 지정하게 된다.
예를 들면

- 값을 대입하지 않은 변수, 즉 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때
- 객체 내부의 존재하지 않는 프로퍼티에 접근하려고 할 때
- return 문이 없거나 호출되지 않은 함수의 실행 결과

첫번째의 경우에는 조금 특이한 동작을 확인 할 수 있는데, 비어있는 요소와 undefined를 할당한 요소이다. 비어있는 요소는 순회와 관련된 많은 메서드들의 순회 대상에서 제외가 된다.

let arr1 = [undefined, 1];
let arr2 = [];
arr2[1] = 1;

arr1.forEach(function (v,i) console.log(v,i))  //undefined 0 /1 1
arr2.forEach(function (v,i) console.log(v,i))  // 1 1

이 처럼 다른 동작을 하게 되는데 배열은 무조건 length 프로퍼티 갯수만큼 빈 공간을 확보하고 각 공간에 인덱스를 이름으로 지정할 것이라고 생각하기 쉽지만, 실제로는 객체와 마찬가지로 특정 인덱스에 값을 지정할 때 비로소 빈 공간을 확보하고 인덱스를 이름으로 지정하고 데이터의 주솟값을 저장하는 등의 동작을 한다.
즉 사용자가 직접 할당한 undefined는 실존하는 데이터인 반면, 자바스크립트 엔진이 반환해주는 undefined는 문자 그대로 값이 없음을 나타내는 것이다.

값을 대입하지 않은 변수, '즉 데이터 영역의 메모리 주소를 지정하지 않은 식별자에 접근할 때 undefined를 반환한다'는 내용은 정확하게 말하자면 자바스크립트 엔진이 아무것도 할당하지 않고 끝나며, 이후 변수 a에 접근하고자 할 때 비로소 undefined를 반환하는 것이다.

그렇다면 우리는 혼란을 피해야합니다. 자바스크립트 엔진이 반환하는 경우는 우리의 통제 범위를 벗어나므로 모든 undefined가 오직 이 경우만 해당하게 해주면 된다. 우리는 직접 undefined를 할당하는 습관을 버리고 없음을 나타내는 다른 방법인 null로 할당해 주는것이다. null은 애초부터 이런 용도로 만든 데이터 타입이고 이런 규칙을 따르는 한 undefined는 오직 '값을 대입하지 않은 변수에 접근하고자 할 때 자바스크립트 엔진이 반환해주는 값' 으로 인지하고 사용할 수 있다.

추가로 null은 한 가지 주의해야될 점이 있는데 바로 typeof null은 object인 점이다. 이는 자바스크립트의 버그이고, 어떤 변수의 값이 null인지 판별하기 위해서는 일치연산자(===)를 써서 확인해야한다.

동등연산자(==)와 일치연산자(===)

자바스크립트에서는 == 연산자를 사용시에 type이 다를 경우에는 자동으로 형변환을 해서 비교를 한다고 한다.

 0 == "0"  //true

이는 분명히 잘못된 비교이고(string !== num) 이를 피하기 위해선 일치연산자를 통해 비교를 해야된다.

 0 === "0"  //fasle

이처럼 동등연산자의 사용은 지양해야하는 방식으로 생각되며, 앞으로는 type도 같아야 된다라고 생각하면서 === 연산자를 사용하여 비교를 해야겠다라는 생각을 하게 되었다.
하지만 동등연산자와 일치연산자를 공부한 개발자라면 동등연산자도 유용하게 쓰일 수 있는데, null check를 하는 경우엔 동등 연산자를 유용하게 사용할 수 있다. 동등 연산자는 null 과 undefined 두 값을 동일하게 취급하고, 두 값을 제외한 다른 값들에 대해서는 항상 false를 반환하기 때문에 쉽게 판단할 수 있게 되기 때문!