공부한거 정리하는 노트에요

[JavaScript] '=='와 '==='의 차이점 알아보기

by 구설구설

자바스크립트와 같은 언어에서는 `==`와 `===` 연산자를 자주 마주치게 된다.

이 두 연산자는 모두 비교 연산자로 사용되지만, 그 작동 방식과 결과는 다르다.

 

#1 `==` (느슨한 비교, Loose Equality)

`==` 연산자는 느슨한 비교(loose equality) 연산자다.

이는 두 값을 비교할 때, 값의 데이터 타입을 무시하고 비교한다는 뜻이다.

자바스크립트에서는 두 값을 비교하기 전에 필요에 따라 형 변환(type coercion)을 수행하여 비교한다.

console.log(1 == '1');  // true
console.log(true == 1); // true
console.log(false == 0); // true
console.log(null == undefined); // true

위의 예제에서 볼 수 있듯이, `==` 연산자는 두 값의 타입이 다르더라도 값이 같다고 간주하면 `true`를 반환한다.

이는 자바스크립트가 내부적으로 형 변환을 수행하기 때문이다.

 

장점

- 타입 변환을 통해 개발자가 원하는 비교를 수행할 수 있다.
- 비교 대상의 타입을 신경 쓰지 않고 빠르게 비교할 수 있다.

 

단점

- 타입 변환이 어떻게 이루어질지 명확하지 않을 수 있다.
- 의도하지 않은 타입 변환으로 인해 버그가 발생할 수 있다.

 

#2. `===` (엄격한 비교, Strict Equality)

`===` 연산자는 엄격한 비교(strict equality) 연산자다. 

이는 두 값을 비교할 때, 값과 데이터 타입이 모두 일치해야 `true`를 반환한다.

즉, 타입 변환 없이 두 값을 그대로 비교한다.

console.log(1 === '1');  // false
console.log(true === 1); // false
console.log(false === 0); // false
console.log(null === undefined); // false

위의 예제에서 볼 수 있듯이, `===` 연산자는 값의 타입이 다르면 무조건 `false`를 반환한다.

타입 변환을 하지 않고 엄격하게 비교하기 때문이다.

 

장점

  1. 타입 변환 없이 값과 타입이 모두 일치하는지 확인한다.
  2. 의도하지 않은 타입 변환으로 인한 버그를 방지할 수 있다.
  3. 비교 결과가 일관되며 예측 가능하다.

 

단점

- 비교 대상의 타입이 다르면 `false`를 반환하므로, 비교 전에 타입을 맞춰야 할 수도 있다.

 

#3 어떤 연산자를 사용해야 할까?

대부분의 경우 `===` 연산자를 사용하는 것을 선호한다. 

이는 명확하고 예측 가능한 비교를 제공하며, 타입 변환으로 인한 의도하지 않은 결과를 방지할 수 있기 때문이다. 

 

하지만, `==` 연산자가 필요할 때도 있다. 

예를 들어, `null`과 `undefined`를 동일하게 취급하고 싶을 때는 `==` 연산자가 유용할 수 있다.

let value = null;

if (value == undefined)
  console.log('value is either null or undefined');

위의 예제에서 `==` 연산자는 `value`가 `null`이거나 `undefined`인 경우 모두 `true`를 반환하므로, 

이런 경우에는 유용하게 사용할 수 있다.


정리하면

`==`와 `===`의 차이를 이해하는 것은 자바스크립트와 같은 동적 타이핑 언어를 사용할 때 매우 중요하다. 

`==`는 느슨한 비교로 형 변환을 통해 비교를 수행하고, `===`는 엄격한 비교로 타입과 값을 모두 확인한다.

대부분의 경우 `===`를 사용하는 것이 좋지만, 상황에 따라 `==`를 사용하는 것이 더 적합할 때도 있다.

'Language > JavaScript' 카테고리의 다른 글

[JavaScript] const, let, var의 차이점  (0) 2024.05.21

블로그의 정보

공부중임

구설구설

활동하기