연산자(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
✏️ 공부하며 정리한 내용입니다. 잘못된 정보나 더 공유할 내용이 있으면 댓글로 알려주세요!
읽어주셔서 감사합니다 😊
'Frontend Dev > JavaScript' 카테고리의 다른 글
자바스크립트 ES6 화살표 함수 기본 (0) | 2023.05.02 |
---|---|
자바스크립트 반환(return)문 사용하기 (0) | 2023.04.23 |
함수 정의 방식 : 함수 선언문(function declaration)과 함수 표현식(function expression) (0) | 2023.04.23 |
JavaScript에서 함수(function)란 무엇일까? (0) | 2023.04.20 |
JS 변수 네이밍 규칙과 네이밍 컨벤션 (0) | 2023.04.18 |