본문 바로가기

Frontend Dev/JavaScript

비교연산자(comparison operator)와 논리연산자(logical operator)

반응형

 연산자(operator)는 값을 비교하거나 연산하여 새로운 값을 생성하는데 사용되며, 자바스크립트에서는 다양한 연산자를 사용할 수 있다. 자바스크립트에서 사용가능한 연산자로는 산술 연산자, 비교 연산자, 논리 연산자, 대입 연산자, 증감 연산자, 비트 연산자 등이 있으며 이번 글에서는 비교연산자와 논리연산자에 대해서 알아보고자 한다.

 

👾 비교연산자(comparison operator)

 비교연산자는 피연산자 사이의 상대적인 크기를 판단하여, 참과 거짓을 반환한다.

 

a == b a와 b가 같다.

a === b a와 b가 데이터 타입까지 같다.

a != b a와 b가 다르다.

a !== b a와 b가 데이터 타입까지 같지 않다.

a > b a는 b보다 크다.

a < b a와 b가 같다.

a >= b a는 b보다 크거나 같다.

a <= b a는 b보다 작거나 같다.

 

 

 📌  ===, !== 엄격한 동치 연산자 / ==, != 느슨한 동치 연산자

느슨한 동치 연산자는 두 피연산자의 타입이 서로 다르면 비교를 위해 강제로 타입을 같게 만든다. 그렇기 때문에 타입이 달라도 값이 같으면 true를 반환한다. 이는 예외를 발생시킬 확률이 높아 사용을 권장하지 않는다.

let x = 3;
let y = '3';

console.log(x == y); // true

 

 📌  비교연산자는 피연산자가 둘 다 숫자면 해당 숫자를 서로 비교하고, 피연산자가 둘 다 문자열이면 문자열의 첫 번째 문자부터 알파벳 순서대로 비교한다. 따라서 타입이 달라 비교할 수 없는 경우에는 언제나 false를 반환한다.

let a = 3;
let b = "abc";

console.log(a < b); // false

 

 👩🏻‍💻 example. 비교연산자

let comparison1 = (5 > 2);
console.log(comparison1); // true

let comparison2 = (5 < 2); 
console.log(comparison2); // false

let comparison3 = (5 == 5); 
console.log(comparison3); // true

let comparison4 = (5 == '5');
console.log(comparison4); // true

let comparison5 = (5 === '5'); // false
console.log(comparison5);

let comparison6 = (5 != '5'); // false 
console.log(comparison6);

let comparison7 = (5 !== '5'); // true
console.log(comparison7);

 

 

👾 논리연산자(logical operator)

 논리연산자는 주어진 논리식을 판단하여 참과 거짓을 반환한다.

&& 논리곱 (AND) || 논리합 (OR)
조건이 모두 다 true이면 true 조건이 하나라도 true이면 true
조건이 하나라도 false이면 false 조건이 모두 false이면 false
AND는 첫번째 false를 발견하는 즉시 평가를 멈춘다. OR는 첫번째 true를 발견하는 즉시 평가를 멈춘다.

 

 👩🏻‍💻 example. 논리연산자 경우의 수

A B A && B A || B !A
true true true true false
true false false true false
false true false true true
false false false false true

 → 논리 부정 연산자(!)는 사실 관계를 반대로 표현한다.

 

 

 📌  && 연산자는 || 연산자보다 우선순위가 높기 때문에 먼저 평가가 된다.

const gender = "F";
const name = "Jane";
const isAdult = true;

if(gender === "M" && name === "Mike" || isAdult){
  console.log("통과");
} else {
  console.log("미통과");
}

/* 위 조건문은 아래와 같은 순서로 판별된다.
   1. (gender === "M" && name === "Mike") → false
   2. || isAdult → true
   3. true이므로 "통과" 출력
*/

if( (gender === "M" && name === "Mike") || isAdult ){
  console.log("통과");
} else {
  console.log("미통과");
}

 

 👩🏻‍💻 example. 논리연산자

let logic1, logic2, logic3, logic4, logic5, logic6;

logic1 = (3 > 2) && (5 > 3); 
console.log(logic1); // true(1) && true(1) => true(1)

logic2 = (3 < 2) && (5 > 3); 
console.log(logic2); // false(0) && true(1) => false(0)

logic3 = (3 > 2) || (5 > 3); 
console.log(logic3); // true(1) || true(1) => true(1)

logic4 = (3 < 2) || (5 < 3); 
console.log(logic4); // false(0) || false(0) => false(0)

logic5 = !(3 < 2); 
console.log(logic5); // !false => true

logic6 = !(3 > 2); 
console.log(logic6); // !true => false

 


✏️ 공부하며 정리한 내용입니다. 잘못된 정보나 더 공유할 내용이 있으면 댓글로 알려주세요!

읽어주셔서 감사합니다 😊

반응형