자바스크립트에는 OR( || ) , AND(&&) , NOT( ! ) 논리 연산자가 있다.
OR( || ) 연산자
OR 연산자는 인수 중 하나라도 true면 true를 반환하고 그렇지 않으면 false를 반환한다.
피 연산자가 boolean형이 아니라면 boolean형으로 변환된다.
OR 연산자는 첫 번째 truthy를 찾을 때 사용할 수 있다.
가장 왼쪽부터 시작해 평가하고,
피연산자를 boolean형 으로 변환 후 값이 true이면( true를 발견하면 )
즉시 연산을 종료하고 해당 피연산자를 변환 전 값으로 리턴한다.
피연산자 중 truthy가 없다면 가장 마지막 피연산자를 리턴한다.
console.log( 1 || 0 ); // 1
1은 truthy 임으로 1을 리턴한다.
console.log( null || 1 ); // 1
null은 falsy이므로 다음 피연산자 1을 평가한다.
1은 truthy 임으로 1을 리턴한다.
console.log( null || 1 || 0 ); // 1
null은 falsy이므로 다음 피연산자 1을 평가한다.
1은 truthy 임으로 1을 리턴한다.
0을 평가하지 않고 연산이 종료된다.
console.log( undefined || null || 0 ); // 0
undefined은 falsy이므로 다음 피연산자 null을 평가한다.
null은 falsy이므로 다음 피연산자 0을 평가한다.
0도 falsy , truthy가 하나도 없으므로 마지막 피연산자인 0을 리턴한다.
OR 연산자를 변수나 표현식으로 구성된 목록에서 응용해 보면~
let email = ""
let phoneNumber = ""
let address = "경기도 평택시"
console.log( email || phoneNumber || address || "미 인증 유저입니다.");
// "경기도 평택시"
인증 방법이 이메일, 핸드폰 번호, 주소 인증 총 3가지이고 옵션이라고 한다면
사용자가 인증한 방법을 찾기 위해 || 을 사용해 볼 수 있다.
사용자가 인증을 하지 않았다면, 차례대로 평가 후 맨마지막 글귀를 출력할 것이다.
// 예시를 위한 코드라 딱 봐도 구리다!
OR 연산자는 단락평가를 제공한다. 이것을 응용해 보면~
OR은 왼쪽에서 부터 오른쪽으로 평가를 진행하고
truthy를 만나면 나머지 값을 건드리지 않고 평가를 종료합니다.
이런 프로세스를 '단락 평가' 라고 부릅니다!
위 예시의 코드를 조금만 수정해 보겠습니다
let email = ""
let phoneNumber = ""
let address = ""
let isAuthorized
email || phoneNumber || address || (isAuthorized = false);
console.log(isAuthorized) // false
어떤 인증도 하지 않았기 때문에 인증을 검사하는 변수인 isAuthorized에 false를 할당 했습니다.
위 예시와 같이 단락평가의 동작 방식은
마지막 피연산자가 변수 할당과 같은 side effect를 가지는 표현식 일 때 명확히 볼 수 있습니다!
단락 평가는 연산자 왼쪽 조건이 falsy일 때만 명령어를 실행하고자 할 때 자주 쓰입니다!
//위 코드는 if문을 사용하는 것이 가독성이 더 좋다.
if(email || phoneNumber || address){
isAuthorized = true;
}
else{
isAuthorized = false;
}
console.log(isAuthorized) // false
AND( && ) 연산자
AND 연산자는 피연산자 모두가 true일때 true를 반환하고 그렇지 않으면 false를 반환합니다!
AND 연산자 역시 피 연산자가 boolean형이 아니라면 boolean형으로 변환됩니다~
AND 연산자는 첫 번째 falsy를 찾을 때 사용할 수 있다.
가장 왼쪽부터 시작해 평가하고,
피연산자를 boolean형 으로 변환 후 값이 false이면( false를 발견하면 )
즉시 연산을 종료하고 해당 피연산자를 변환 전 값으로 리턴한다.
피연산자 중 falsy가 없다면 가장 마지막 피연산자를 리턴한다.
console.log( 1 && 0 ); // 0
1은 truthy이므로 다음 피연산자 0을 평가한다.
0은 falsy 이다.
console.log( null && 1 ); // null
null은 falsy이므로 null을 리턴한다.
1을 평가하지 않고 연산이 종료된다.
console.log( 1 && 2 && 3 ); // 3
1은 truthy이므로 다음 피연산자 2를 평가한다.
2은 truthy이므로 다음 피연산자 3을 평가한다.
3도 truthy이므로 마지막 피연산자인 3을 리턴한다.
AND( && ) 연산자가 OR( || ) 연산자보다 우선순위가 높기 때문에
a && b || c && d 의 결과와
(a && b) || (c && d) 의 결과는 동일하다.
NOT( ! ) 연산자
NOT 연산자는 인수를 하나만 받고,
피연산자를 boolean형으로 변환한 뒤 그 값의 역을 반환합니다.
이를 이용해서 NOT 연산자를 연달아 2번 사용하면 값을 boolean형으로 변환할 수 있습니다.
console.log(!!null) // false
console.log(!!('true? or false?')) // true
NOT 연산자는 모든 논리 연산자 중에서 가장 높기 때문에
항상 &&이나 || 보다 먼저 실행됩니다!
(괄호를 써서 구분해 주는게 좋겠습니다.)
'Frontend > JS.info 정리' 카테고리의 다른 글
자바스크립트 기본 - 반복문 (while & for) (0) | 2021.11.23 |
---|---|
자바스크립트 기본 - nullish coalescing operator ( ?? ) (0) | 2021.11.22 |
자바스크립트 기본 - if와 ? 조건 처리 , switch (0) | 2021.11.18 |
자바스크립트 기본 - 비교 연산자 (0) | 2021.11.17 |
자바스크립트 기본 - 기본연산자와 수학 (0) | 2021.11.15 |