[JavaScript] 대입 연산자(=), 동등 연산자(==), 엄격한 동등 연산자(===)

Javascript의 여러 연산자들 중 "=" 와 관련된 연산자들에 대해서 설명하겠다.

 

아래 코드를 보자.

let a;

a = 5;

console.log(a);

 

첫번째 줄에서 a라는 변수를 선언하고 있다.

그리고 두 번째 줄에서  a = 5라는 코드로 a 변수의 값을 지정해주고 있는데, 이 부분이 바로 "대입연산자"를 활용한 부분이다.

Javascript에서는 이처럼 "="을 사용하는 연산자가 보통의 프로그래밍 언어보다 

 

 

대입 연산자(Assignment Operator)

 "=" 을 기준으로 왼쪽의 변수에 오른쪽 값을 대입한다는 의미를 지니고 있다.

a = 5

 

위처럼 "=" 하나로 식을 나타내며, 위 식은 a 라는 변수에 5라는 값을 저장한다는 뜻이다.

 

 

 

 

동등 연산자(Equal Operator)

"==" 을 기준으로 변수의 오른쪽 값과 왼쪽 값이 동일한지를 확인하여 같으면 true, 다르면 false를 반환한다.

>> let a = 2;
>> let b = 3;
>> a == b

 

a에는 2, b에는 3이 저장되어 있으므로 a와 b는 다른 값이다. 따라서 a.== b의 결과는 false가 출력된다.

 

 

 

 

엄격 동등 연산자(Strict Equal Operator)

"==="을 기준으로 변수의 오른쪽 값과 왼쪽 값이 동일한지를 보다 엄격하게 확인하여 같으면 true, 다르면 false를 반환한다.

>> let a = 5;
>> let b = 5;
>> a === b;

 

위를 보면, a와 b 모두 5라는 값이 저장되어 있다. 

따라서 a === b는 true가 나올 것이다.

 

하지만, 엄격 동등 연산자(Strict Eqaul Operator)가 아닌 동등 연산자(Equal Operator)를 사용해도 위와 같은 결과가 나온다.

그렇다면 엄격 동등 연산자(Strict Equal Operator)와 동등 연산자(Equal Operator)의 차이점은 어떤 것일까 ?

 

 

아래 예시를 보자.

let a = 5;
let b = '5';

console.log(a == b);

console.log(a === b);

 

위 프로그램의 결과는 아래와 같다.

 

 

다른 프로그래밍 언어를 배웠던 사람들이라면 무언가 이상함을 느낄 것이다.

숫자인 5 와 문자인 '5'가 프로그래밍에서 다른 데이터라는 것을 알기 때문이다.

 

 

 

하지만, JavaScript에서는 기본적으로 의미가 비슷한 값을 엄격하게 구분하지 않는 특성이 있다.

이것이 JavsScript에서 말하는 유연성이자 자유도인 것이다.

 

하지만, 이렇게 데이터를 구분하지 않는다면 프로그램이 커질수록 버그가 생기기 취약한 환경이 되므로, 우리는 "===" 과 같은 연산자가 필요하게 된 것이다.

따라서, 웹을 제작할 때 "==" 보다는  "==="을 사용하기를 권장한다. 후의 에러를 방지하기 위한 팁이다.

 

 

정리하자면, 동등 연산자(Equal Operator)인 "==" 은 의미상으로 같은 값 (ex 숫자 5와 문자 '5', NULL과 Undefined)을 같은 값으로 인식한다. 그리고 엄격한 동등 연산자(Strict Equal Operator)는 우리가 보통 알고있는 프로그래밍 언어의 방식과 같이 자료형이 다른 값을 다른 데이터로 구분한다.