JavaScript에서 Null과 Undefined의 차이점

null 또는 undefined 를 만날 때마다 각 데이터 유형이 JavaScript에서 사용되는 방식에 대해 매우 혼란스러워합니다.

차이점이 무엇입니까? 둘 다 무의 개념을 표현하지 않습니까?


나는 두 가지 데이터 유형을 더 깊이 이해하기 위해 몇 가지 조사를 하기로 결정했습니다. 이 지식을 가지고 있으면 필요할 때 올바르게 사용할 수 있습니다. 나는 또한 때때로 인터뷰에서 null와 undefined의 차이가 나온다는 것을 배웠습니다. 👀

소개

JavaScript에는 7 primitive data types 이 있으며 그 중 두 개는 null 및 undefined 입니다.

Null은 할당 값입니다. 즉, 해당 변수를 비우려는 경우 해당 변수에 값null을 할당할 수 있습니다. 의도적으로 비워두고 빈 값을 가리킵니다.

let hasCat = null;
// nullish

정의되지 않음은 존재하지만 아직 초기화되지 않은 변수입니다. 즉, 나중에 내 변수로 돌아와 이전에 없었던 값을 할당할 수 있습니다. 따라서 값 없이 변수를 선언하면 초기화되지 않은 것으로 간주됩니다.

let currentJob;
// undefined

내가 두 가지 모두를 이해한 방식은 예, 액세스하려는 값이 둘 다 없다는 점에서 둘 다 매우 유사하다는 것입니다. JavaScript에서 이 둘을 비교한다면 JavaScript는 둘 다 빈 값으로 간주하기 때문에 암묵적으로 동일합니다. 그러나 둘 다 다른 데이터 유형이므로 명시적으로 비교하면 잘못된 값이 됩니다.

null == undefined; 
// truthy

null === undefined;
// falsey

유추

당신이 움직이고 있다고 상상해보십시오. 당신은 많은 상자를 구입했습니다. 짐을 싸서 그 상자 안에 넣어야 합니다. 하지만 체계적이지 않아서 상자 안에 무엇이 있는지 표시하는 것을 잊었습니다. 물건으로 가득 찬 상자가 5개 있고 비어 있는 상자가 2개 있습니다. 상자에 라벨을 붙이고 싶지만 이미 테이프를 붙였기 때문에 나중에 다시 찾아오겠다고 다짐합니다. 현재 5개의 상자는 TBD입니다. 그리고 2개의 상자가 남아 있고 비어 있습니다. 코드에서는 다음과 같습니다.

let fiveBoxes = undefined;
let twoBoxes = null;

많은 물건이 들어 있는 5개의 상자는 그 안에 물건이 있지만 아직 그 안에 무엇이 있는지 모르기 때문에 정의되지 않은 것으로 간주됩니다. 비어 있는 두 개의 상자는 그 안에 아무것도 들어 있지 않다는 의미입니다.

널 대 정의되지 않음

두 데이터 유형의 차이점은 다음과 같습니다.

한정되지 않은

선언

초기화되지 않은

엔진 할당됨

없는

부족한

비어 있음/없음

존재하지 않는

사용자 할당됨

콘솔로 이동하여 다음을 입력합니다.

typeof null
typeof undefined

당신은 무엇을 얻습니까?

결론

Null과 undefined는 동일하지 않습니다. 코드에서 버그가 있는 동작을 피하고 버그가 존재하는 이유를 명확하게 이해하려면 둘 사이의 차이점을 배우는 것이 중요합니다. 면접에서도 그 차이를 확실히 말할 수 있다면 멋져요 😉

여전히 혼란스러우면 언제든지 연락주세요! 또는 그냥 채팅하고 싶은 경우.