[JavaScript] 논리 연산자

OR(||) 연산자

기본 구조

|| 연산자는 일반적으로 두 개의 조건 중 하나라도 true이면 전체 표현식은 true입니다.

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

불린이 아닌 값이 피연산자로 사용될 경우, 자바스크립트는 내부적으로 해당 값을 불린형으로 변환 후 연산합니다.

console.log(1 || 0); // 1
console.log(null || 1); // 1
console.log(undefined || null || 0 || "Hello"); // "Hello"
console.log(undefined || null || 0); // 0

첫 번째 true 찾기

|| 연산자는 왼쪽에서 오른쪽으로 연산하면서 첫 번째 true 값을 만나면 즉시 반환합니다.

let username = "";
let nickname = "nick";
let defaultName = "default";

console.log(username || nickname || defaultName); // "nick"

이러한 특성을 이용하여 기본값 설정을 할 수 있습니다.

function getUserName(name) {
  return name || "게스트";
}

console.log(getUserName("이수빈")) // "이수빈"
console.log(getUserName("")) // "게스트"

AND(&&) 연산자

기본 구조

&& 연산자는 모든 피연산자가 true일 때만 true를 반환하며, 하나라도 false이면 false를 반환합니다.

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

첫 번째 false 찾기

&& 연산자는 왼쪽에서 오른쪽으로 평가하며, 첫 번째 false 값을 찾으면 즉시 반환합니다.

console.log(1 && 2 && null && 3); // null
console.log(1 && 2 && 3); // 3

NOT(!) 연산자

기본 구조

! 연산자는 피연산자의 논리적 부정을 반환합니다.

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

피연산자의 불린형 변환

! 연산자를 두 번(!!) 사용하면 값을 명확한 불린형으로 변환할 수 있습니다.

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

내장 Boolean 함수를 사용해도 동일한 결과를 얻을 수 있습니다.

console.log(Boolean("Hello")); // true
console.log(Boolean(0)); // false
console.log(Boolean(undefined)); // false

논리 연산자의 우선순위

연산자의 우선순위는 ! > && > || 순으로 평가됩니다.

console.log(true || false && false); // true (&&가 먼저 실행됨)
console.log((true || false) && false); // false

논리 연산자를 조합할 때 우선순위를 명확하게 하기 위해 괄호를 사용해야 합니다.