Javascript === 연산자, null 과 undefined

본 내용은 생활코딩 이고잉님의 강의 (https://www.opentutorials.org/)를 듣고 개인적인 공부를 위해 기록한 것입니다.

---

 

=== (strict equal operator)

일치 연산자로 === 좌항과 우항이 '정확'하게 같을 때 true 다르면 false가 된다. 여기서 '정확'이란 값 뿐만 아니라 값의 데이터 형까지 일치해야 한다는 의미다.

위처럼 문자열 "1"과 숫자 1이 == 연산자는 의미가 같기 때문에 true를 반환하지만 === 연산자는 의미는 같지만 타입이 다르기 때문에 false를 반환한다.

보통의 언어일 경우 == 연산자도 타입을 따지는 반면 javascript에서는 구분이 되어 있다.

처음에 이 사실을 알았을 때, 문자열로 숫자를 받아 다시 형변환을 거진 후 비교해야 하는 작업에서 일일히 형변환을 하지 않아도 된다고 생각하니 편리해 보였다. 하지만 이는 매우 위험한 생각이다.

간단한 프로그램에서는 모든 로직을 프로그래머가 알고 있기 때문에 이러한 사용은 문제가 안되지만, 프로그램의 크기가 커지고, 복잡해 지면서 여러 사람들과의 협업이 이루어 질 경우 정확한 데이터의 관리와 비교는 매우 중요해진다.

실제로 문자열 "1"과 숫자 1은 엄연히 다른 데이터다. 따라서 조금은 귀찮더라도, 형변환을 거쳐가며 비교를 하더라도, == 연산자 보다는 === 연산자를 사용하는 습관을 들여야 한다.

 

null vs undefined

undefined는 변수를 선언만 하고 따로 초기화를 하지 않은 상태다. 즉, 위에서 변수 a는 존재하지만 a의 값을 정의해주지 않은 상태다.

반면 null은 변수에 아무것도 아닌 값이라는 것을 의도적으로 대입한 것이다.

이를 == 연산자는 변수에 아무것도 없다는 의미가 같기 때문에 true를 반환하지만 === 연산자는 프로그래머의 의도까지 더해 다른 값으로 인식하고 false를 반환한다.

이 둘은 각각이 데이터 타입이다.

 

※ 추가적으로 알면 좋은 비교 구문

alert(true == 1);               //true
alert(true === 1);              //false
alert(true == '1');             //true
alert(true === '1');            //false
alert(false == 0);		//true
alert(false === 0);		//flase
 
alert(0 === -0);                //true
alert(NaN === NaN);             //false

NaN은 계산할 수 없음이라는 키워드다.