논리 연산자

내승현·2022년 8월 8일
0

자바스크립트

목록 보기
5/6

자바스크립트엔 세 종류의 논리 연산자 ||(OR) , &&(AND) , !(NOT)이 있다.

|| ( OR )

불린 값을 조작하는데 쓰인다.
인수 중 하나라도 true 이면 , true 를 반환하고 , 그렇지 않으면 false를 반환한다.


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

피연산자가 모두 false 인 경우를 제외하고 연산 결과는 항상 true 이다.
피연산자가 불린형이 아니면, 평가를 위해 불린형으로 변환된다.

예를 들어 , 연산 과정에서 숫자 1true로, 숫자 0false로 바뀐다.
|| 연산자는 if 문에서 주어진 조건 중 하나라도 인지를 테스트하는 용도로 자주 쓰인다.

let hour = 9;

if (hour < 10 || hour > 18) {
  alert( '영업시간이 아닙니다.' );
}

첫 번째 truthy를 찾는 OR 연산자 ‘||’

OR 연산자와 피연산자가 여러 개인 경우:

result = value1 || value2 || value3;

이때 , || 연산자의 연산 수행 과정!

  • 가장 왼쪽부터 오른쪽으로 나아가며 피연산자를 평가한다
  • 각 피연산자를 불린형으로 변환한다. 변환 후 그 값이 true 이면 연산을 멈추고 해당 피연산자의 변환 전 원래 값을 반환한다.
  • 피연산자 모두를 평가한 경우 (모든 피연산자가 false로 평가되는 경우)엔 마지막 피연산자를 반환한다.

여기서 핵심은 반환 값이 형 변환을 하지 않은 원래 값이라는 것이다.

정리해 보자면 이렇다. OR "||" 연산자를 여러 개 체이닝(chaining) 하면 첫 번째 truthy를 반환한다. 피연산자에 truthy가 하나도 없다면 마지막 피연산자를 반환한다.

alert( 1 || 0 ); // 1 (1은 truthy임)

alert( null || 1 ); // 1 (1은 truthy임)
alert( null || 0 || 1 ); // 1 (1은 truthy임)

alert( undefined || null || 0 ); // 0 (모두 falsy이므로, 마지막 값을 반환함)

&& ( AND )

AND 연산자는 두 피연산자가 모두가 참 일때 true를 반환한다. 그 외의 경우는 false를 반환한다.


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

아래는 if문과 AND 연산자를 함께 활용한 예제이다.


let hour = 12;
let minute = 30;

if (hour == 12 && minute == 30) {
  alert( '현재 시각은 12시 30분입니다.' );
}

첫 번째 falsy를 찾는 AND 연산자 ‘&&’

result = value1 && value2 && value3;

AND 연산자 &&는 아래와 같은 순서로 동작한다.

  • 가장 왼쪽 피연산자부터 시작해 오른쪽으로 나아가며 피연산자 평가
  • 각 피연산자는 불린형으로 변환된다. 변환 후 값이 false이면 평가를 멈추고 변환 전 원래 값을 반환한다.
  • 피연산자 모두가 평가되는 경우 ( 모든 피연산자가 true로 평가되는 경우)엔 마지막 피연산자가 반환된다.

정리를 해보자면 ...!!!!!!

AND 연산자는 첫 번째 falsy를 반환한다. 피연산자에 falsy가 없다면 마지막 값을 반환한다.

OR 연산자와 AND 연산자의 차이점은 AND 연산자가 첫번째 falsy를 반환하는 반면 , OR은 첫 번째 truthy를 반환한다는 것이다.

예시 :


// 첫 번째 피연산자가 truthy이면,
// AND는 두 번째 피연산자를 반환한다.
alert( 1 && 0 ); // 0
alert( 1 && 5 ); // 5

// 첫 번째 피연산자가 falsy이면,
// AND는 첫 번째 피연산자를 반환하고, 두 번째 피연산자는 무시한다.
alert( null && 5 ); // null
alert( 0 && "아무거나 와도 상관없습니다." ); // 0

!(NOT)

NOT 연산자는 매우 간단하다.

result = !value;

NOT 연산자는 인수를 하나만 받고, 아래 순서대로 수행한다.

  1. 피연산자를 불린형 (true / false)로 변환한다.
  2. 1에서 변환된 값의 역을 반환한다.

예시:


alert( !true ); // false
alert( !0 ); // true

NOT을 두 개 연달아 사용(!!)하면 값을 불린형으로 변환할 수 있다.


alert( !!"non-empty string" ); // true
alert( !!null ); // false
profile
아토언니의 프론트엔드 개발자로서의 기록

0개의 댓글