자바스크립트 논리 연산자 완전 정복!

오늘은 자바스크립트에서 자주 사용하는 논리 연산자 &&(AND), ||(OR), !(NOT)에 대해 공부하였다.

1. && (AND) 연산자
2. || (OR) 연산자
3. ! (NOT) 연산자

1. && (AND) 연산자

&&는 피연산자가 모두 참일 때만 true를 반환한다. 하나라도 거짓이면 false를 반환한다.

console.log(true && true); // true
console.log(true && false); // false
console.log(false && false); // false

이 연산자는 단순히 불리언을 판별하는 것뿐만 아니라 특정 값을 반환하기도 한다.

const result = true && true && "Hello";

console.log(result); // "Hello"

위 코드에서 모든 조건이 truthy이면 마지막 값을 반환한다. 그래서 결과는 "Hello"가 된다.

&&는 왼쪽에서 오른쪽으로 조건을 순차적으로 평가하고 falsy한 값을 만나면 평가를 멈춘다. 이런 동작을 단락 평가라고 한다.

2. || (OR) 연산자

||는 피연산자 중 하나라도 참이면 true를 반환한다. 모든 조건이 거짓일 때만 false를 반환한다.

console.log(true || false); // true
console.log(false || false); // false

||도 &&처럼 특정 값을 반환할 수 있다.

const result = false || "Hello" || 0;

console.log(result); // "Hello"

왼쪽부터 순차적으로 값을 평가하다가 가장 처음 나타나는 truthy 값을 반환한다. 위 코드에서는 "Hello"가 truthy 값이라서 결과로 반환된다.

||도 단락 평가를 하기 때문에 조건을 만족하는 값을 찾으면 나머지는 더 이상 평가하지 않는다.

3. ! (NOT) 연산자

!는 현재 불리언 값과 반대의 값을 반환한다. true는 false로, false는 true로 바뀐다.

console.log(!true); // false
console.log(!false); // true

숫자나 문자열 같은 값에도 사용할 수 있다.

console.log(!"Hello"); // false
console.log(!0); // true
console.log(!1); // false

특히 !!를 사용하면 값을 불리언 타입으로 변환할 수 있다.

console.log(!!"Hello"); // true
console.log(!!""); // false
console.log(!!0); // false
console.log(!!1); // true

!!는 값이 truthy인지 falsy인지 확인할 때 사용된다.