[JavaScript] 논리 연산자(AND, OR, NOT)

자바 스크립트의 논리 연산자는 총 세 종류.

• ||(OR)
• &&(AND)
• !(NOT)

피연산자로 모든 타입의 값을 받을 수 있다!

1. || OR

1-1. 기본

• 기본 형태: result = a || b;

⬇️인수 중 하나라도 true이면 true 반환. 나머지 경우에는 false 반환.

alert( true || true );   // true
alert( false || true );  // true
alert( true || false );  // true
alert( false || false ); // false

• 피연산자가 Boolean형이 아니면 평가하기 위해 Boolean으로 변환한다. (2.10에서의 truty, falsy 값 참고)
  

1-2. JS에서 OR의 추가 기능 - 연산자와 피연산자 여러 개일 때(chaining)

• 맨 왼쪽에서 오른쪽 순서로 연산 수행
• 각 피연산자 모두 Boolean형으로 변환 후 값이 true면 연산 중지하고 해당 피연산자 변환 전 원래 값을 반환
• 피연산자 모두 평가한 경우(즉 모두 false로 평가된 경우)에는 마지막 피연산자 반환

쉽게 말해 OR 연산자를 여러 개 쓰면(chaining) 첫 번째 truthy 값의 원래 값을 반환한다!(Boolean으로 바뀐 형이 아니라 원래 형으로!)

이 추가 기능은 여러 용도로 활용 가능하다.

• 변수 또는 표현식으로 구성된 목록에서 첫 번째 truthy 얻기
• 단락 평가(short circuit evaluation)
  • truthy를 만나면 나머지 값들은 안 건드리고 평가 멈추는데, 이런 프로세스를 단락 평가라고 한다.
  • 연산자 왼쪽 조건이 falsy일 때만 명령어 실행하고 싶을 때 단락 평가로 사용한다
  • 두 번째 피연산자가 단순한 값이 아니라 변수 선언이나 함수 호출과 같은 부수적인 효과(side effect)를 가지는 표현식일 때 이 추가 기능의 특징이 두드러진다.
    • 예시(true 조건 옆의 alert는 실행 아예 안 됨)

      true || alert("not printed");
      false || alert("printed");

2. && AND

2-1. 기본

• 기본 형태 : result = a && b;

⬇️인수 모두 true이면 true 반환. 나머지 경우에는 false 반환.

alert( true && true );   // true
alert( false && true );  // false
alert( true && false );  // false
alert( false && false ); // false

2-2. 연산자와 피연산자 여러 개일 때(chaining)

• 맨 왼쪽에서 오른쪽 순서로 피연산자 평가
• OR 연산자와 마찬가지로 똑같이 각 피연산자를 Boolean형으로 변환
• 다만 AND의 경우 가장 첫 번째 falsy에 해당하는 피연산자의 변환 전 원래 값을 반환하는 것.

  • 예시

    alert( 1 && 2 && null && 3 ); // null

• 모든 피연산자가 true인 경우(모든 피연산자 평가한 경우) 마지막 피연산자 반환

❗️||나 &&로 if를 대체하지 말 것.

• 더 짧다고 더 좋은 것이 아니다. 가독성을 생각하며 목적에 맞게 쓰자.

3. ! NOT

• 기본 형태: result = !value;
• 인수는 하나만 받는다.
• 연산 순서: 피연산자를 Boolean형으로 변환하고 변환된 값의 역(true/false)을 반환
• NOT 2개 = 값을 불린형으로 변환 가능(내장 함수 Boolean 사용한 것과 같은 결과)
  • 예시 : alert( !!null ); // false

❗️논리 연산자 우선순위 : ! > && > ||보다 높다.