📗비교 연산자

비교 연산자는 이름 그대로 어떤 값들을 비교하는 상황에 사용되는 연산자입니다. 흔히 숫자를 비교할때 가장 자주 사용되곤 하죠. 🤓

크다와 작다

수학 수업시간에 졸지 않았다면, 아래와 같이 숫자를 비교할때 사용할 수 있는 비교 연산자는 크게 어렵지 않게 이해하실 수 있을겁니다.

const result = 10 > 5;

console.log(result);

아래와 같은 결과가 출력되네요. 💁🏻‍♂️

이 부분에서 반드시 잘 눈여겨 보셔야 할 것은,

비교 연산자로 연산을 하는 구문은 불리언 값의 결과를 도출하게 된다는 점입니다.

크다라는 판단 뿐 아니라, 작다, 작거나 같다, 크거나 같다에 대한 판단 또한 아래와 같이 할 수 있습니다. 🤓

const a = 10 < 100;
const b = 10 <= 100;
const c = 100 >= 10;

// 여러개를 쉼표로 구분지어 동시에 출력할 수도 있습니다.
console.log(a, b, c);

숫자 뿐 아니라 문자열 또한 <, > 등의 비교 연산자를 사용할 수 있습니다만, 아직 크게 중요한 부분은 아닙니다.

같다는 것이란

앞선 내용에서 살며시 보여드렸듯이, 문법적으로 같다는 것을 비교해볼 수 있는 연산자는 두 가지가 있습니다.

아래 예시에서 문법적으로 소괄호는 필수가 아니지만, 여러분의 혼란을 방지하기 위해 소괄호를 추가했습니다. 소괄호는 연산자 우선순위에서 가장 최상위 연산자랍니다. 🙂

일치 연산자

const a = (0 === false); // 같은지 판별
const b = (0 !== false); // 다른지 판별

동등 연산자

const c = (0 == false); // 같은지 판별
const d = (0 != false); // 다른지 판별

일치 연산자와 동등 연산자 역시 모두 비교 연산자에 속합니다. 그렇기에 불리언 자료형의 결과를 도출합니다. 즉, 현재 위 예시 코드에서 a, b, c, d 변수에 할당되는 값은 불리언 값입니다.

위 예시 중, 0과 false 가 같은지 비교하는 구문을 두 가지 연산자를 사용해 출력해보겠습니다.

일치 연산자(===)는 두 가지가 다르다고 판별했고, 동등 연산자(==)는 두 가지가 같다고 판별했습니다.

어떤 연산자가 더 상식적이라고 생각하시나요? 당연히 일치 연산자(===)겠죠? 😎

논리의 상식을 위해, 그리고 정확한 판별을 위해 일반적으로 동등 연산자(==, !=)는 사용하지 않고 일치 연산자(===, !==)의 사용이 강력히 권장됩니다. 💁🏻‍♂️

저를 따라 외치세요. 🗣️ 개발자에게 중요한 것은 무엇? 이유에 대해 궁금해 하는 호기심. 👂🏻

동등 연산자와 일치 연산자의 차이

동등 연산자와 일치 연산자의 차이점에 대해 인터넷에 조사하면 잘못된 정보들이 너무나 많습니다. 그러니 인터넷으로 조사하여 추가적인 리소스를 보실때 특별히 리소스 선별에 조심하셔야 합니다.

핵심 요점은 아래와 같습니다. 💁🏻‍♂️

동등 연산자는 비교하려는 두 대상의 자료형이 다를 경우, 피연산자의 자료형을 입맛에 따라 변환하여 비교하려는 성향이 있습니다. 그 과정을 형변환이라고 하는데, 동등 연산자는 형변환 후에 동등 여부에 대한 비교를 하게 됩니다.

형변환에 대한 구체적인 규칙은 복잡합니다. 굳이 알고 있을 필요가 없고, 혹시라도 필요한 경우가 생긴다면, MDN 등의 문서를 통해 파악하면 되므로 걱정하지 마세요. https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Operators/Equality

그에 반해, 일치 연산자는 형변환 과정 없이 즉시 값을 비교합니다.

이전에 봤던 예시 코드를 다시 보자면,

const c = (0 == false);

console.log(`동등 연산자: ${c}`);

위 예시에서는 0과 false 를 비교하는 과정에서 두 가지 피연산자의 자료형이 다르기 때문에 성격이 까다로운 동등 연산자는 피연산자들의 자료형을 변환하려고 합니다. 지금의 경우에는 불리언 값을 숫자로 변환합니다. false 를 숫자로 변경하게 되고, false 는 0이 됩니다.

즉, 0 == 0 이라는 비교 구문을 실행하게 되고, 결과는 참이 됩니다.

위 예시에서 불리언이 숫자로 변환되는 이유는 형변환의 정해진 규칙이기 때문입니다. 아래 문서의 상세설명 부분을 살펴보세요. 외우고 있어야 하는 부분은 아니니 한번 자세히 읽어보기만 해도 충분합니다.

동등 연산자(==) - JavaScript | MDNMDN Web Docs

또한 위 예시에서 false 를 숫자로 변경했을때 왜 0으로 변환되었을까요?

컴퓨터는 0과 1의 이진법으로 모든 연산을 진행하는데, 일반적으로 불리언 값은 참이 1, 거짓이 0으로 대응하도록 하는 것이 보통의 상식이고 규칙입니다.

일치 연산자도 한번 보자면,

const a = (0 === false);

console.log(`일치 연산자: ${a}`);

위 예시에서는 0과 false는 다르므로, a 에 할당되는 결과값은 false 입니다. 간단하죠? 😎

다시 한번 강조하지만, 일치 연산자만(===, !==)을 사용하는 것이 업계의 관행입니다.