논리 연산자

논리 연산자는 보통 Boolean(논리적) 값과 함께 쓰이며, 불리언 값을 반환합니다. 그런데, &&|| 연산자는 사실 피연산자 중 하나의 값을 반환합니다. 그러므로 불리언 외의 다른 값과 함께 사용하면 불리언 값이 아닌 것을 반환할 수 있습니다.

설명

다음 표는 논리 연산자의 종류입니다. (expr은 불리언을 포함해서 아무 자료형이나 가능합니다)

연산자 구문 설명
논리 AND (&&) expr1 && expr2 expr1true로 변환할 수 있는 경우 expr2을 반환하고, 그렇지 않으면 expr1을 반환합니다.
논리 OR (||) expr1 || expr2

expr1true로 변환할 수 있으면 expr1을 반환하고, 그렇지 않으면 expr2를 반환합니다.

논리 NOT (!) !expr 단일 피연산자를 true로 변환할 수 있으면 false를 반환합니다. 그렇지 않으면 true를 반환합니다.

값을 true로 변환하면 값이 인 것입니다.
값을 false로 변환할 수 있으면 값이 거짓인 것입니다.

거짓으로 변환할 수 있는 표현의 예는 다음과 같습니다.

  • null
  • NaN
  • 0
  • 빈 문자열 ("", '', ``)
  • undefined

&& 연산자와 || 연산자를 불리언 값이 아닌 피연산자와 함께 사용될 수 있지만, 반환 값을 항상 불리언 원시값으로 변환할 수 있으므로 불리언 연산자로 생각할 수 있습니다. 반환 값을 직접 불리언으로 바꾸려면 Boolean 함수나 이중 부정 연산자를 사용하세요.

단락 평가

논리 표현식을 좌측부터 평가하므로, 아래 규칙에 따라 단락(short-circuit) 평가를 수행합니다.

  • (거짓 표현식) && expr은 거짓 표현식으로 단락 평가됩니다.
  • (참 표현식) || expr은 참 표현식으로 단락 평가됩니다.

"단락"이란, 위 규칙에서 expr을 평가하지 않는다는 뜻입니다. 따라서 평가 중 발생해야 할 부작용(예: expr이 함수 호출이면 절대 호출하지 않음)도 나타나지 않습니다. 단락 평가가 발생하는 원인은 첫 번째 피연산자를 평가한 순간 이미 연산자의 결과가 정해지기 때문입니다. 다음 예제를 살펴보세요.

function A(){ console.log('A 호출'); return false; }
function B(){ console.log('B 호출'); return true; }

console.log( A() && B() );
// 함수 호출로 인해 콘솔에 "A 호출" 기록
// 그 후 연산자의 결과값인 "false" 기록

console.log( B() || A() );
// 함수 호출로 인해 콘솔에 "B 호출" 기록
// 그 후 연산자의 결과인 "true" 기록

연산자 우선순위

다음 두 식은 똑같아 보이지만, && 연산자는 || 이전에 실행되므로 서로 다릅니다. 연산자 우선순위를 참고하세요.

true || false && false      // returns true, because && is executed first
(true || false) && false    // returns false, because operator precedence cannot apply

논리 AND (&&)

다음은 &&(논리 AND) 연산자의 예제입니다.

a1 = true  && true       // t && t returns true
a2 = true  && false      // t && f returns false
a3 = false && true       // f && t returns false
a4 = false && (3 == 4)   // f && f returns false
a5 = 'Cat' && 'Dog'      // t && t returns "Dog"
a6 = false && 'Cat'      // f && t returns false
a7 = 'Cat' && false      // t && f returns false
a8 = ''    && false      // f && f returns ""
a9 = false && ''         // f && f returns false

논리 OR (||)

다음은 ||(논리 OR) 연산자의 예제입니다.

o1 = true  || true       // t || t returns true
o2 = false || true       // f || t returns true
o3 = true  || false      // t || f returns true
o4 = false || (3 == 4)   // f || f returns false
o5 = 'Cat' || 'Dog'      // t || t returns "Cat"
o6 = false || 'Cat'      // f || t returns "Cat"
o7 = 'Cat' || false      // t || f returns "Cat"
o8 = ''    || false      // f || f returns false
o9 = false || ''         // f || f returns ""
o10 = false || varObject // f || object returns varObject

논리 NOT (!)

다음은 !(논리 NOT) 연산자의 예제입니다.

n1 = !true               // !t returns false
n2 = !false              // !f returns true
n3 = !''                 // !f returns true
n4 = !'Cat'              // !t returns false

이중 NOT (!!)

NOT 연산자 다수를 연속해서 사용하면 아무 값이나 불리언 원시값으로 강제 변환할 수 있습니다. 변환 결과는 피연산자 값의 "참스러움"이나 "거짓스러움"에 따릅니다. (거짓을 참고하세요)

동일한 변환을 Boolean 함수로도 수행할 수 있습니다.

n1 = !!true                   // !!truthy returns true
n2 = !!{}                     // !!truthy returns true: any object is truthy...
n3 = !!(new Boolean(false))   // ...even Boolean objects with a false .valueOf()!
n4 = !!false                  // !!falsy returns false
n5 = !!""                     // !!falsy returns false
n6 = !!Boolean(false)         // !!falsy returns false

불리언 변환 규칙

AND에서 OR로 변환

불리언 계산에서, 다음 두 코드는 항상 같습니다.

bCondition1 && bCondition2
!(!bCondition1 || !bCondition2)

OR에서 AND로 변환

불리언 계산에서, 다음 두 코드는 항상 같습니다.

bCondition1 || bCondition2
!(!bCondition1 && !bCondition2)

NOT 간 변환

불리언 계산에서, 다음 두 코드는 항상 같습니다.

!!bCondition
bCondition

중첩 괄호 제거

논리 표현식은 항상 왼쪽에서 오른쪽으로 평가되므로, 몇 가지 규칙을 따르면 복잡한 표현식에서 괄호를 제거할 수 있습니다.

중첩 AND 제거

불리언의 합성 계산에서, 다음 두 코드는 항상 같습니다.

bCondition1 || (bCondition2 && bCondition3)
bCondition1 || bCondition2 && bCondition3

중첩 OR 제거

불리언의 합성 계산에서, 다음 두 코드는 항상 같습니다.

bCondition1 && (bCondition2 || bCondition3)
!(!bCondition1 || !bCondition2 && !bCondition3)

명세

Specification Status Comment
ECMAScript 1st Edition (ECMA-262) Standard Initial definition.
ECMAScript 5.1 (ECMA-262) Standard Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
ECMAScript 2015 (6th Edition, ECMA-262) Standard Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators
ECMAScript Latest Draft (ECMA-262) Draft Defined in several sections of the specification: Logical NOT Operator, Binary Logical Operators

브라우저 호환성

Update compatibility data on GitHub
DesktopMobileServer
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung InternetNode.js
Logical AND (&&)Chrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 3Opera Full support YesSafari Full support YesWebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support 1.0nodejs Full support Yes
Logical OR (||)Chrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 3Opera Full support YesSafari Full support YesWebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support 1.0nodejs Full support Yes
Logical NOT (!)Chrome Full support 1Edge Full support 12Firefox Full support 1IE Full support 3Opera Full support YesSafari Full support YesWebView Android Full support 1Chrome Android Full support 18Firefox Android Full support 4Opera Android Full support YesSafari iOS Full support YesSamsung Internet Android Full support 1.0nodejs Full support Yes

Legend

Full support  
Full support

같이 보기