2021.04.05 JavaScript 논리 연산자 정리

2021.04.05_JavaScript 논리 연산자 정리_정리노트

 

 

참고 - ko.javascript.info/logical-operators

 

 

ㅎㅇㅎㅇ 오늘은 또 자바스크립트로 돌아와쑴~!~! ㅎㅁㅎ 증맬로 기초부터 차근차근 꼼꼼히 해봅씨다. 

 

오늘은 단순히 OR,AND,NOT 의 뜻만 아는 것이 아니라, 좀 더 정확하게 어떠한 역할을 하는 것인지, 몰랐던 것 위주로 정리.

 

 

쨋든 ㄲ 합씨다!!!!

 

 

먼저 내가 생각한 핵심 개념.

 

 

AND ( && ) , OR ( || )

 

이렇게 불리안형 값을 출력하게 되는 것은 기본 개념이지만, 만약 alert 로 불리안형이 아닌 다른 반환값들을 출력하면, 과연 어떤 값들이 출력될까?

 

 

둘 다 왼쪽에서부터 연산을 시작한다.

 

여기서

AND 는 , 첫번째 false 값을 반환하고,

OR 은 첫번째 true 값을 반환한다.

 

말그대로

각 값을 불리안형으로 나타내면,

 

1,10,100 >> true 

null,undefined >> false

 

이렇게 or 은 true 가 되는 값이 하나라도 있으면, 왼쪽부터 가장 먼저 true 가 되는 값을 찾아서 반환하고,

and 는 왼쪽부터 가장 먼저 false 가 되는 값을 반환한다.

 

또한, 모두 false 가 되면 or 은 마지막 값을 출력하고, 모두 true 가 되면, and 는 마지막 값을 출력한다.

 

 

 

단순히 and, or 을 true, false 의 불린형으로 판단하지 않고, 반환되는 값들을 알아두면, 여러 가지 추가 기능들을 쓸 수 있다.

 

 

 

첫번째로 true, false 반환 되는 값 찾기.

 

 

이렇게 or 은 nickname 이 첫번째로 ture 값이 되니까 korin 을 반환하고 alert 에  출력하고, 연산을 멈춘다.

반대로 and 는 null 이 첫번째로 false 값이 되니까, null 에서 연산을 멈추고, firstName 인 null 값을 출력한다.

 

또한 각각 모두 false, true 인 경우는 맨 마지막 값인 익명을 출력하게 된다.

 

 

두 번째, 단락 평가

 

해당 , 기능을 사용하는 이유는 기본적으로는 조건문의 대응 표현이지만, 만드는 것에 따라 여러 가지로 활용될 수 있다. 

단락 평가의 동작 방식은 두 번째 피연산자가 변수할당과 같은 사이드 이펙트를 가지는 표현식일 때 명확히 볼 수 있는데,

 

 

 

OR 일 경우에, 왼쪽에서 false 일 경우에만, 오른쪽을 실행하기 때문에, fasle 일 때만 실행될 것이다.

 

여러 용도로 사용될 때, AND,OR 이든 typeError 를 발생시키지 않고, 조건에 맞는 값을 반환된다는 점에서는 장점이지만, 

만약 AND 일 경우에는, 첫번째 값이 true 일 때, 두번째 값을 발생시킨다는 점에서, if 와 대응되게 간혹 사용되기도 한다. 

 

 

 

이렇게 말이다.

 

이 식을 if 로 반환하게 되면, 

 

 

 

 

이렇게 쓸 수 있다.

 

복잡한 함수나, 복잡한 코드를 변환했을 때, 어떻게 보면 코드가 좀 더 간결해 보일 수 있지만 이는 가독성을 떨어뜨리고, 하고자하는 바가 직관적으로 보이지 않으니, 연산과 관련된 것들이 아니라면, 조건문의 코드를 줄이기 위한 단락평가는 피하는 것이 좋다고 함!

 

 

다음으로 ㄱ ㄱ

 

 

NOT ( ! )

 

 

! 은 피연산자의 역 값을 반환. !! 역의 역이므로 불리안 ( Boolean ) 과 같은 역할을 한다.

 

 

 

우선순위 

 

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

 

 

 

 

마지막으로 예제를 보면서, 몇개를 더 정리 ㄱ ㄱ

 

여기서 보면 alert 의 반환값은 undefined 가 되는 것을 알 수 있고, 실행한 후 undefined 가 되어 false 로 불리안값을 반환한다.

 

 

 

이는 and, or 우선순위와, or 은 왼쪽에서 첫번째 true 값을 반환한다는 것을 알 수 있는 문제.

 

 

 

 

콘솔창에 간단한 로그인 구현하기

조건

아이디를 먼저 묻는 프롬프트 창이 뜬다. 
아이디가 admin 이면, 비밀번호를 묻는 프롬프트 창이 뜬다.

틀린 아이디를 입력하면, '잘못된 아이디입니다' 출력
 아이디를 입력하지 않거나, 빈 문자열을 넣으면, "취소되었습니다." 출력

 비밀번호에 묻는 창에서 비밀번호를  'themaster'를 입력했다면 "환영합니다!"라는 메세지 출력.
 틀린 비밀번호를 입력하면 '잘못된 비밀번호입니다.' 메세지 출력
 빈 문자열이나 취소를 누르면, ' 취소되었습니다. ' 라는 메세지 출력

 

 

 

※ 참고 : 프롬프트 창에 아무것도 입력하지 않고 확인을 누르면, 빈 문자열이, 취소 or esc를 누르면 null 이 반환된다.

 

 

 

 

 

 

---

 

if 를 중첩으로 써서 헷갈릴 수 있지만, 찬찬히 풀면 할 수 있을 것!!!!! 이렇듯 논리 연산자는 조건문과 짝꿍으로 유용하게 쓰일뿐더러, 연산자를 잘 쓰면 부가 기능도 있으니 오늘 찬찬히 정리해보아쑴 ㅎㅁㅎ 오늘의 포스팅 끝끝!