본문 바로가기
JS/JS 기초

JS - 논리 연산자 ||(or), &&(and), !(not)

by 쫑뚱이 2022. 8. 8.
728x90
반응형

JS- 논리 연산자 ||(or), &&(and),!(not)


오늘은 JS에서 유용하게 사용되는

논리 연산자에 대해 알아보겠습니다.

 

제목에서 보셨듯이 논리 연산자는

or, and, not을 사용하는 방식인데

 

논리 연산자를 사용하는 이유는

정보를 정확하게 입력받아 출력할 수 있기 때문입니다.

예를 들면 if 문을 사용해서

로그인 정보를 만들 때 이름, 나이, 성별이라는 정보를

가지고 회원정보를 맞출 수 있습니다.

 

이 예시는 마지막에 코드 예시를 통해 보여드리고

마무리하겠습니다.

 

먼저 각각의 논리 연산자에 대해 알아보겠습니다.

 

(1)

||(or)

 

||(or)은 간단하게 or 연산자라고 하겠습니다.

or 연산자는 엔터 위에 \의 시프트 키를 누른 버전으로

|| 두 번 눌러 사용합니다.

 

or은 말 그대로 둘 중 하나가 맞으면 된다는 말인데

논리 연산자에서는 true와 false를 통해 판단합니다.

 

기본 자료형에서 불린 형을 다뤘을 때

잠시 언급했었는데 true는 1을 false는 0을

의미한다고 말씀드렸습니다.

 

그래서 a||b를 봤을 때

a나 b 하나라고 true가 된다면

그 식은 진행이 됩니다.

 

그래서 둘 다 true 거나

하나라도 true가 나오면 진행되는

것입니다.

 

alert를 사용하여

예시를 보여드리면

 

alert(true || true); // true

alert(false || true); // true

alert(true || false); // true

alert(false || false); // false

이런 식으로 동작합니다.

 

or을 사용하는 식은 왼쪽에서부터

읽기 때문에 만약

왼쪽 피연산자의 값이 true라면

바로 진행되기 때문에

오른쪽 피연산자는 바로 통과해버립니다.

 

그래서 만약 왼쪽 피연산자가

false라면 오른쪽으로 넘어가서

true가 나올 때까지 진행합니다.

 

(2)

&&(and)

 

&&(and)는 간단하게 and라고 하겠습니다.

and는 or과 비슷하지만

차이가 있다면 or은 true가 있으면 통과하지만

and는 false가 한 개라도 있으면 취소한다는 것입니다.

 

그래서 and는 피연산자들이 다 true일 때

통과합니다.

 

alert를 사용한

예시를 통해 설명드리겠습니다.

 

alert(true && true); // true

alert(false && true); // false

alert(true && false); // false

alert(false && false); // false

or 때는 한 가지라도 true가 나오면

true가 되어 통과했었지만

 

and는 한 가지라고 false가 나오면

해당 식은 false가 되어 취소가 됩니다.

 

(3)

!(not)

 

!(not)은 편하게 not이라고 부르겠습니다.

not은 인수 한 개에 사용할 수 있습니다.

만약 true에 not을 사용하면

false가 되고

반대로 false에 not을 사용하면

true가 됩니다.

 

이것이 형 변환에서도 동일하게 작동합니다.

 

마지막으로 로그인 예시를 보여드리기 전에

우선순위에 대해 말씀드리겠습니다.

 

위에 3가지 논리 연산자들을 같이 사용하셔도

무방합니다. 하지만 위에 3가지 논리 연산자들은

우선순위가 있기 때문에

이 점을 참고하시면 좋겠습니다.

 

!(not) > &&(and) > ||(or)

not이 가장 우선순위가 높고

or이 가장 우선순위가 낮습니다.

 

그렇기 때문에 같이 사용된다면 not이

가장 먼저 실행되고 or이 가장 나중에 실행될 것입니다.

 

이점 참고하시면 좋겠습니다.

 


 

오늘은 논리 연산자에 대해 알아보았습니다.

논리 연산자는 정말 간단하게 사용할 수 있지만

응용력이 좋아 유용하게 사용할 수 있기 때문에

기초를 잘 알아두시고 공부하시면 좋겠습니다.

 

오늘 마지막으로 논리 연산자를 사용하여

로그인 정보를 확인하는 방식을 예시로 보여드리고

마무리하겠습니다.

 

코드 작성 예시
결과 값(1)
결과 값(2)
결과값(3)

 

위에 예시를 보시면 if 문안에 if 문을 넣은 형식으로

로그인 정보를 확인하실 수 있고

중간에 or 연산자를 사용한 예시도 있습니다.

 

참고하시고 해 보셔도 좋을 것 같습니다.

 

오늘도 긴 글 읽어주셔서 감사합니다!!

728x90
반응형

'JS > JS 기초' 카테고리의 다른 글

JS-반복문 while, do while, for  (0) 2022.08.10
JS - nullish 병합연산자 ??  (0) 2022.08.08
JS- 조건부 연산자?  (0) 2022.08.08
JS-if 문  (0) 2022.08.07
JS-모달창  (0) 2022.08.06

댓글