undefined와 null의 차이점에 대해서 설명해주세요.

프론트엔드와 관련된 질문이에요.

undefinednull둘 다 '값이 없다'는 의미를 담고 있지만, 그 쓰임새와 의미에는 차이점이 존재합니다. undefined는 자바스크립트에서 자동으로 할당되는 값입니다.

변수는 선언했지만, 아직 아무 값도 할당하지 않았을 때, 자바스크립트는 그 변수에 undefined라는 값을 자동으로 부여합니다. 예를 들어 let a;라는 변수를 선언만 하고 값을 넣지 않으면, 자바스크립트가 자동으로 aundefined을 할당하게 됩니다.

반면에 null은 개발자가 의도적으로 할당하는 값입니다. 특정 변수에 값이 없음을 명확하게 표현하기 위해 개발자가 null을 넣어줄 수 있습니다. 예를 들어 let b = null; 이라고 할 경우, 이는 b라는 변수에 일부러 값이 비어 있다는 의도를 나타내기 위해 null을 넣은 것입니다.

정리해서 말씀 드려보자면, undefined는 값을 아직 할당하지 않은 상태를 나타내고, 자바스크립트가 자동으로 부여하는 값입니다.

반면, null의도적으로 값을 비워 둔 상태를 나타내며, 개발자가 직접 할당하는 값입니다. 또한, 느슨한 비교(==)에서는 nullundefined가 같게 처리되지만, 엄격한 비교(===)에서는 다르게 취급됩니다.

undefined와 null이 메모리 관리와 관련해서 어떻게 처리되는지 알고 계신가요? 🤔

null은 개발자가 명시적으로 메모리를 해제하고자 할 때 사용하는 방법입니다. 객체를 참조하던 변수를 null로 설정하면, 해당 변수는 더 이상 그 객체를 가리키지 않으므로 참조가 끊어집니다. 이렇게 참조가 끊기면 JavaScript의 가비지 컬렉터는 이 객체가 더 이상 사용되지 않는다고 판단해 메모리에서 이를 제거할 수 있습니다. 예를 들어, 대용량 데이터를 담고 있는 객체가 있다고 할 때, 더 이상 사용하지 않는다면 그 객체를 null로 설정하여 가비지 컬렉션 대상이 되도록 유도할 수 있습니다.

반면에 undefined는 자바스크립트 엔진이 자동으로 할당하는 값으로, 메모리 해제와 직접적인 관련은 없습니다. 변수가 undefined 상태라고 해서 가비지 컬렉션 대상이 되는 것은 아니며, 이 값 자체가 메모리 해제를 유도하는 것은 아닙니다. undefined는 단지 "값이 정의되지 않음"을 나타낼 뿐이며, 변수 값을 undefined로 설정한다고 해서 자바스크립트가 이를 해제 대상으로 인식하지 않습니다. 예를 들어, let a;로 선언된 변수 a는 기본적으로 undefined 상태이지만, 메모리 해제를 유도하지는 않습니다.

📚 추가 학습 자료를 공유합니다.