
자바스크립트 논리 연산자 (&&, ||, !)
자바스크립트의 논리 연산자는 조건문, 제어문, 단축 평가(short-circuit evaluation) 에서 핵심적으로 쓰인다.
&&, ||, ! 이 세 가지가 논리 연산자의 중심축이다.
이 세 연산자는 단순히 “참, 거짓”을 판별하는 도구를 넘어서, 값의 흐름을 제어하는 장치로도 쓰인다.
1. 논리 AND 연산자 &&
&& 는 “그리고(and)”를 의미한다.
왼쪽과 오른쪽 값이 모두 true 일 때만 결과가 true가 된다.
console.log(true && true); // true
console.log(true && false); // false
console.log(false && true); // false
console.log(false && false); // false
하지만 자바스크립트에서는 단순 불리언 연산 외에도
단축 평가(short-circuit) 라는 흥미로운 특징이 있다.
단축 평가 (Short-Circuit)
A && B 는 A가 false면 B는 평가조차 하지 않는다.
console.log(false && "실행 안됨"); // false
console.log(true && "실행됨"); // "실행됨"
즉, &&는 첫 번째 값이 거짓이면 그 시점에서 계산을 멈춘다.
이 덕분에 조건이 거짓이면 실행하지 않을 코드를 짧게 작성할 수 있다.
user.isAdmin && alert("관리자입니다!");
위 코드는 user.isAdmin이 true일 때만 alert가 실행된다.
조건문 if보다 짧고 직관적인 표현이다.
---
2. 논리 OR 연산자 ||
|| 는 “또는(or)”을 의미한다.
왼쪽이나 오른쪽 중 하나라도 true이면 결과가 true다.
console.log(true || false); // true
console.log(false || true); // true
console.log(false || false); // false
역시 단축 평가가 있다.
A || B 에서 A가 true면 B는 실행되지 않는다.
console.log(true || "실행 안됨"); // true
console.log(false || "실행됨"); // "실행됨"
이 성질 덕분에 기본값(default value) 을 지정할 때 자주 사용된다.
let name = userInput || "Guest";
userInput이 falsy(거짓 같은 값, 예: "", null, undefined, 0, false)일 경우 "Guest"를 기본값으로 대입한다.
---
3. 논리 NOT 연산자 !
! 는 부정(NOT) 을 의미한다.
값의 참/거짓을 반대로 뒤집는다.
console.log(!true); // false
console.log(!false); // true
이걸 두 번 쓰면(Boolean 값 변환 효과)
값을 논리형(Boolean) 으로 변환하는 역할을 한다.
console.log(!!"Hello"); // true
console.log(!!0); // false
즉, !!값 은 Truthy/Falsy 판별을 위한 간단한 방법이다.
---
4. Truthy와 Falsy
논리 연산자가 동작하는 핵심 원리는 “truthy”와 “falsy” 개념이다.
자바스크립트에서 다음 값들은 자동으로 false로 평가된다.
false, 0, "", null, undefined, NaN
이외의 모든 값은 truthy(참 같은 값) 으로 간주된다.
if ("문자열") console.log("참입니다!"); // 실행됨
if (0) console.log("거짓입니다!"); // 실행 안 됨
---
5. && 와 || 의 반환값 주의점
&& 와 || 는 항상 true/false를 반환하지 않는다!
자바스크립트에서는 마지막으로 평가된 값을 그대로 반환한다.
console.log("Hello" && "World"); // "World"
console.log(null && "World"); // null
console.log("Hello" || "World"); // "Hello"
console.log("" || "World"); // "World"
이 특징 덕분에 조건문뿐 아니라 값 선택 로직에서도 많이 사용된다.
---
6. 실무 예시
(1) 기본값 지정
let username = input || "Anonymous";
(2) 조건이 참일 때만 실행
user.isAdmin && showDashboard();
(3) 안전한 접근 (Optional Chaining 대용)
user && user.profile && user.profile.name;
(4) 값 존재 확인 후 대입
let result = value && compute(value);
--
7. 정리
- && : AND — 둘 다 참일 때만 실행, 첫 거짓에서 멈춤
- || : OR — 하나라도 참이면 실행, 첫 참에서 멈춤
- ! : NOT — 참/거짓을 반전시킴
- !!값 : Boolean 변환 트릭 (truthy/falsy 판별용)
- 단축 평가(Short-Circuit)는 조건문을 간결하게 만들어 준다.
단어정리
논리(論理)
- 한자: 말할 논(論), 다스릴 리(理)
- 영어: Logic — 그리스어 logos(이성, 말)
- 뜻: 참과 거짓의 관계를 따지는 사고 체계
연산자(演算子)
- 한자: 펼 연(演), 셈 산(算), 아들 자(子)
- 영어: Operator — 라틴어 operari(작동하다, 실행하다)
- 뜻: 값을 계산하거나 조작하는 기호
단축평가(短縮評價)
- 한자: 짧을 단(短), 줄일 축(縮), 평가할 평(評), 값 가(價)
- 영어: Short-Circuit Evaluation — short(짧은) + circuit(회로, 경로)
- 뜻: 연산 중 필요 없는 부분은 생략하고 빠르게 결과를 도출하는 방식
부정(否定)
- 한자: 아닐 부(否), 정할 정(定)
- 영어: Negation — 라틴어 negare(부인하다)
- 뜻: 참을 거짓으로, 거짓을 참으로 바꾸는 연산
'Web > Javascript' 카테고리의 다른 글
| 자바스크립트 비교 연산자 (===, ==, !=, !==)란? (0) | 2025.10.24 |
|---|---|
| 자바스크립트 나머지 매개변수(Rest Parameter)란? (0) | 2025.10.24 |
| 자바스크립트 스프레드 연산자(Spread Operator, ...)란? (0) | 2025.10.23 |