차밍이
[JS] 자바스크립트 AND, OR 연산의 특징 및 활용 본문
목차
AND 연산 ( && )
일반적으로 알고있는 AND OR 연산자 결과
console.log(true && true) // true
console.log(true && false) // false
console.log(false && true) // false
console.log(false && false) // false
자바스크립트에서도 다른 프로그램과 똑같은 연산 결과를 얻을 수 있습니다.
하지만, 여기에 조금 특이한 JS만의 연산 방식이 있습니다.
A && B
라는 연산을 진행하는데 있어서 A
가 true
라면 AND연산 결과는 B
가 어떤 값인지에 따라 달라지게됩니다.
B
가 true
면 결과는 true
B
가 false
면 결과도 false
입니다.
그렇죠?
그래서 JS에서는 만약 A
부분의 첫 번째 인자가 true
이면 결과로 B
값을 출력합니다.
이해가 잘 안된다면, 차분하게 생각해보면 의미가 전달될 것입니다.
만약 A
가 false
라면 B
값을 볼 필요 없이 무조건 결과는 false
이겠죠.
그러므로 A
가 false
인 결과라면 A
값을 출력합니다.
OR 연산 ( || )
OR 연산도 논리가 유사합니다.
console.log(true || true) // true
console.log(true || false) // true
console.log(false || true) // true
console.log(false || false) // false
A || B
라는 연산을 진행하는데 있어서 A
가 true
라면 OR연산 결과는 B
가 어떤 값인지에 상관없이 무조건 true
값을 가지게 됩니다.
따라서 OR 연산은 A
가 true
값이면 A
를 바로 출력합니다.
반면, A
가 false
라면 결과는 B
값에 따라 달라집니다. 따라서 A
가 false
이면 무조건 B
값을 출력합니다. B
가 결과를 결정하기 때문입니다.
JS 에서의 AND, OR 연산의 특징
그래서 그것이 어떻다는 것인지 궁금하실 것입니다.
console.log(0 && undefiend) // 0
console.log(null && false) // null
0
과 null
은 논리 값이 false
에 해당되는 값입니다.
따라서 위의 AND 연산을 진행할 때, A
인자의 값이 false
인 것입니다.
따라서 B
값에 상관없이 결과가 바뀌지 않고 A
값을 그대로 출력합니다.
console.log('123' || NaN) // '123'
console.log(null || false) // false
'123'은 논리 값이 true
에 해당되므로 OR연산 결과는 무조건 true
에 해당됩니다.
그래서 결과 출력은 '123'을 그대로 출력합니다.
반면, null
은 논리값이 false
이므로 B
부분의 값에 따라 결과가 결정됩니다.
따라서, B
부분의 값을 그대로 내보냅니다.
JavaScript의 연산 특징 활용
console.log("Coding" || "Study") // Coding
위에서 설명 드린 것을 바탕으로 위의 결과가 이해가 되실 것입니다.
이러한 현상을 활용하면
위와 같은 함수를 작성할 수 있습니다.
특정한 값을 받으면 해당 값을 출력하고 전혀 입력이 없으면 미리 정해놓은 값을 출력하게 하는 것입니다.
소스코드
function printSubject(state) {
const msg = state || 'Python';
console.log(msg)
}
printSubject() // Python
printSubject('Javascript') // Javascript
연산자 우선순위
console.log(true || false && false); // true
console.log((true || false) && false); // false
console.log('Study' || NaN && false); // Study
console.log(('Study' || NaN) && false); // false
AND 와 OR 연산자 사이에서는 AND 연산자의 우선순위가 더 높다는 것을 주의해야합니다.
|| 연산 뒤에 && 연산을 사용할 경우 의도와는 다르게 뒤의 && 연산이 먼저 이루어져 다른 결과를 출력할 수 있습니다.
이처럼 JavaScript는 다른 언어와 다르게 유연한 코딩이 가능하고 특이한 사항들이 많으니,
이러한 디테일한 부분들을 잘 알아놓으면 유용하게 활용할 수도 있고 의도치 않은 에러를 발생시키지 않을 수 있을 것 같네요.
'Javascript' 카테고리의 다른 글
[vscode] html 확장자 인식 안될 때, html 자동완성 안될때 해결방법 (1) | 2022.11.30 |
---|---|
[JS] 자바스크립트 몫과 나머지 구하기 - 2가지 방법 (0) | 2022.10.20 |
[JS] var, let, const 차이점 3가지 : Scope, Hoisting, 변수 선언 (0) | 2022.10.19 |
[JS] 자바스크립트 배열 push(), pop(), shift(), splice() (0) | 2022.06.10 |
웹 사이트 보안 관련 이슈 (0) | 2022.06.09 |