From 7c6676fde79a6303ce6b9cece1a8745d5cd7bdc7 Mon Sep 17 00:00:00 2001 From: alattalatta Date: Fri, 16 Jul 2021 17:28:51 +0900 Subject: Update Expressions and Operators guide (#1393) * Update Expressions and Operators guide * Fix typo * Polished some wording * Proofread * Add semi * Sync with English --- .../guide/expressions_and_operators/index.html | 1699 ++++++++++++-------- 1 file changed, 1032 insertions(+), 667 deletions(-) diff --git a/files/ko/web/javascript/guide/expressions_and_operators/index.html b/files/ko/web/javascript/guide/expressions_and_operators/index.html index f5e711304f..d619a14fd8 100644 --- a/files/ko/web/javascript/guide/expressions_and_operators/index.html +++ b/files/ko/web/javascript/guide/expressions_and_operators/index.html @@ -11,454 +11,721 @@ tags: - 연산자 translation_of: Web/JavaScript/Guide/Expressions_and_Operators --- -
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Functions", "Web/JavaScript/Guide/Numbers_and_dates")}}
-

이 장은 JavaScript의 표현식과 할당, 비교, 산술, 비트 계산, 논리, 문자열, 삼항 등 여러 가지 연산자를 설명합니다.

+
+ {{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Functions", + "Web/JavaScript/Guide/Numbers_and_dates")}} +
+ +

+ 이 장은 JavaScript의 표현식과 할당, 비교, 산술, 비트 계산, 논리, 문자열, 삼항 등 여러 가지 연산자를 설명합니다. +

-

연산자와 표현식의 완전하고 구체적인 목록도 참고서에서 확인할 수 있습니다.

+

+ 참고서에서 구체적인 모든 연산자와 표현식의 목록도 확인할 수 + 있습니다. +

-

연산자

+

연산자

-

JavaScript는 다음과 같은 형태의 연산자가 있습니다. 이 절은 연산자에 대하여 설명하고, 연산자 우선순위에 관한 정보를 포함하고 있습니다.

+

+ JavaScript에는 다음과 같은 유형의 연산자가 있습니다. 이 절에서는 각각의 연산자에 대해 설명하고, 연산자 우선순위에 관한 + 정보를 제공합니다. +

-

JavaScript는 이항 연산자와 단항연산자, 조건연산자인 단 하나 존재하는 삼항 연산자를 가지고 있습니다. 이항 연산자는 하나는 좌변에 다른 하나는 우변에 두개의 피연산자가 필요합니다:

+

+ JavaScript는 이항 연산자와 단항 연산자를 포함하며, 유일한 삼항 연산자로 조건 연산자도 가지고 있습니다. 이항 연산자는 + 연산자의 앞과 뒤에 하나씩, 총 두 개의 피연산자가 필요합니다. +

-
피연산자1 연산자 피연산자2
-
+
피연산자1 연산자 피연산자2
-

예를 들면 3+4 또는 x*y와 같습니다.

+

이항 연산자의 예시로는 3+4x*y가 있습니다.

-

단항 연산자는 연산자 뒤에든 앞에든 하나의 피연산자를 필요로 합니다.:

+

단항 연산자는 연산자의 앞이나 뒤에 하나의 피연산자가 필요합니다.

-
연산자 피연산자
-
+
연산자 피연산자

또는

-
피연산자 연산자
-
+
피연산자 연산자
-

x++ 또는 ++x를 예시로 들 수 있습니다.

+

단항 연산자의 예시로는 x++ 또는 ++x가 있습니다.

-

할당 연산자

+

할당 연산자

-

할당 연산자는 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당합니다. 기본적인 할당 연산자는 오른쪽의 피연산자 값을 왼쪽 피연산자 값에 할당하는 등호(=) 입니다. 즉 x = yy 값을 x에 할당합니다.

+

+ 할당 연산자는 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당합니다. 기본적인 할당 연산자는 오른쪽의 피연산자 값을 왼쪽 + 피연산자 값에 할당하는 등호(=)로, x = yy의 값을 x에 + 할당합니다. +

-

다음의 표에 나열된 연산의 약칭인 복합 할당 연산자도 존재합니다:

+

아래의 표에서 볼 수 있듯, 연산과 할당을 동시에 수행하는 복합 할당 연산자도 존재합니다.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
복합 할당 연산자
이름복합 할당 연산자
할당x = yx = y
덧셈 할당x += yx = x + y
뺄셈 할당x -= yx = x - y
곱셈 할당x *= yx = x * y
나눗셈 할당x /= yx = x / y
나머지 연산 할당x %= yx = x % y
지수 연산 할당 {{experimental_inline}}x **= yx = x ** y
왼쪽 이동 연산 할당x <<= yx = x << y
오른쪽 이동 연산 할당x >>= yx = x >> y
부호 없는 오른쪽 이동 연산 할당x >>>= yx = x >>> y
비트 AND 할당x &= yx = x & y
비트 XOR 할당x ^= yx = x ^ y
비트 OR 할당x |= yx = x | y
+ 복합 할당 연산자 +
이름단축 연산자
할당x = yx = y
더하기 할당x += yx = x + y
빼기 할당x -= yx = x - y
곱하기 할당x *= yx = x * y
나누기 할당x /= yx = x / y
나머지 할당x %= yx = x % y
거듭제곱 할당x **= yx = x ** y
왼쪽 시프트 할당x <<= yx = x << y
오른쪽 시프트 할당x >>= yx = x >> y
+ 부호 없는 오른쪽 시프트 할당 + x >>>= yx = x >>> y
비트 AND 할당x &= yx = x & y
비트 XOR 할당x ^= yx = x ^ y
비트 OR 할당x |= yx = x | y
논리 AND 할당x &&= yx && (x = y)
논리 OR 할당x ||= yx || (x = y)
널 병합 할당x ??= yx ?? (x = y)
-

구조 분해

+

반환 값과 체이닝

+ +

+ x = y와 같은 할당 역시 대부분의 표현식처럼 값을 반환합니다. 할당 연산자의 반환 값은 다른 할당 연산자나 + 콘솔 기록 등을 통해 가져올 수 있습니다. +

+ +
+const z = (x = y);  // const z = x = y와 같음
+
+console.log(z);     // x = y 할당의 반환 값을 기록
+console.log(x = y); // 또는 반환 값을 직접 기록
+
+ +

+ 반환 값은 위쪽 표의 "뜻" 열에서 등호(=)의 오른쪽 표현식 값과 동일합니다. 즉 (x = y)는 + y를 반환하고, (x += y)x + y의 결과를, (x **= y)는 + x ** y의 결과를 반환합니다. +

+ +

+ 논리 할당인 (x &&= y), (x ||= y), (x ??= y)의 경우에는 할당 부분을 + 제외한 논리 연산의 결과를 반환합니다. 따라서 각각 x && y, x || y, + x ?? y의 결과를 반환합니다. +

+ +

반환 값은 할당 전의 값을 사용한 논리 연산의 결과임에 주의하세요.

+ +

+ 할당 표현식 여러 개를 체이닝할 경우에는 각각의 할당을 오른쪽에서 왼쪽으로 평가합니다. 다음의 예제를 + 봐주세요. +

+ + + +

구조 분해

-

복잡한 할당 연산에서, 구조 분해 할당 구문은 배열이나 객체의 구조를 반영하여 배열이나 객체에서 데이터를 추출할 수 있게 해주는 JavaScript 표현식입니다.

+

+ 더 복잡한 할당에 사용할 수 있는 + 구조 분해 할당은 배열 리터럴과 객체 + 리터럴을 생성할 때와 비슷한 구문을 사용해서 배열과 객체에서 데이터를 추출할 수 있는 JavaScript 표현식입니다. +

-
var foo = ['one', 'two', 'three'];
+
+var foo = ['one', 'two', 'three'];
 
-// 구조 분해를 활용하지 않은 경우
+// 구조 분해 미활용
 var one   = foo[0];
 var two   = foo[1];
 var three = foo[2];
 
-// 구조 분해를 활용한 경우
-var [one, two, three] = foo;
- -

비교 연산자

- -

비교 연산자는 피연산자들을 비교하고 비교에 따라 논리 값을 반환합니다. 피연산자들은 숫자, 문자열, 논리형, 객체 를 사용할 수 있습니다. 문자열은 유니코드 값을 사용하여 표준 사전순서를 기반으로 비교합니다. 만약 두 피연산자가 다른 형태일 경우, JavaScript는 대부분 비교를 위해 피연산자를 적절한 타입으로 변환합니다. 이런 행동은 보통 숫자로 피연산자를 숫자로 비교하는 형태로 나타납니다. 형태를 바꾸기의 유일한 예외는 엄격한 비교를 수행하는 ===!== 연산이 관련되는 경우입니다. 이런 연산자는 비교를 위해 피연산자의 형태를 적절히 바꾸려고 시도하지 않습니다. 다음 표는 샘플 코드를 통해 비교 연산자에 대하여 설명합니다:

+// 구조 분해 활용 +var [one, two, three] = foo; +
-
var var1 = 3;
-var var2 = 4;
+

비교 연산자

+ +

+ 비교 연산자는 피연산자를 서로 비교하고, 비교 결과가 참인지에 따라 논리 값을 반환합니다. 피연산자로는 숫자, 문자열, + 논리형, 객체 값을 사용할 수 있습니다. 문자열은 Unicode 값을 사용한 표준 사전식 순서를 기반으로 비교합니다. 만약 두 + 피연산자가 서로 다른 타입일 경우, JavaScript가 피연산자를 비교하기에 적합한 타입으로 변환하며, 대개 숫자로 변환해 + 비교하는 결과를 낳습니다. 비교 연산에서 발생하는 타입 변환의 유일한 예외는 + ===!== 연산자를 사용해 엄격 일치와 불일치 비교를 수행하는 경우입니다. 두 연산자는 + 비교하기 전에 피연산자를 변환하려는 시도를 하지 않습니다. 다음과 같은 예제 변수 var1과 + var2를 가정할 때, 아래의 표에서 비교 연산자의 종류와, 각각 true를 반환하는 예제 코드를 볼 수 + 있습니다. +

+ +
+var var1 = 3;
+var var2 = 4;
 
- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
비교 연산자
연산자설명참을 반환하는 예제
동등 (==)피연산자들이 같으면 참을 반환합니다.3 == var1 -

"3" == var1

- 3 == '3'
부등 (!=)피연산자들이 다르면 참을 반환합니다.var1 != 4
- var2 != "3"
일치 (===)피연산자들이 같고 피연산자들의 같은 형태인 경우 참을 반환합니다. {{jsxref("Object.is")}} 와 JavaScript에서의 같음을 참고하세요.3 === var1
불일치 (!==)피연산자들이 다르거나 형태가 다른 경우 참을 반환합니다.var1 !== "3"
- 3 !== '3'
~보다 큰 (>)좌변의 피연산자 보다 우변의 피연산자가 크면 참을 반환합니다.var2 > var1
- "12" > 2
~보다 크거나 같음 (>=)좌변의 피연산자 보다 우변의 피연산자가 크거나 같으면 참을 반환합니다.var2 >= var1
- var1 >= 3
~보다 작음 (<)좌변의 피연산자 보다 우변의 피연산자가 작으면 참을 반환합니다.var1 < var2
- "2" < 12
~보다 작거나 같음 (<=)좌변의 피연산자 보다 우변의 피연산자가 작거나 같으면 참을 반환합니다. -

var1 <= var2
- var2 <= 5

-
+ 비교 연산자 +
연산자설명true를 반환하는 예제
동등 (==)피연산자가 서로 같으면 true를 반환합니다. + 3 == var1
"3" == var1
3 == '3'
+
부등 (!=)피연산자가 서로 다르면 true를 반환합니다. + var1 != 4
var2 != "3"
+
일치 (===) + 두 피연산자의 값과 타입이 모두 같은 경우 true를 반환합니다. {{jsxref("Object.is")}}와 + JavaScript에서의 같음을 참고하세요. + 3 === var1
+ 불일치 + (!==) + 피연산자의 값 또는 타입이 서로 다를 경우 true를 반환합니다. + var1 !== "3"
3 !== '3'
+
+ + (>) + 왼쪽 피연산자가 오른쪽 피연산자보다 크면 true를 반환합니다. + var2 > var1
"12" > 2
+
+ 크거나 같음 + (>=) + 왼쪽 피연산자가 오른쪽 피연산자와 같거나 크면 true를 반환합니다. + var2 >= var1
var1 >= 3
+
+ 작음 + (<) + 왼쪽 피연산자가 오른쪽 피연산자보다 작으면 true를 반환합니다. + var1 < var2
"2" < 12
+
+ 작거나 같음 + (<=) + 왼쪽 피연산자가 오른쪽 피연산자와 같거나 작으면 true를 반환합니다. +

+ var1 <= var2
var2 <= 5
+

+
-

참고: (=>) 은 연산자가 아니고, 화살표 함수(Arrow functions)를 나타내는 기호입니다.

+

+ 참고: =>는 연산자가 아니라 + 화살표 함수의 표기법입니다. +

-

산술 연산자

+

산술 연산자

-

산술 연산자는 숫자값(리터럴 또는 변수)을 피연산자로 갖고, 하나의 숫자 값을 반환합니다. 기본적인 산술 연산자는 덧셈(+), 뺄셈 (-), 곱셈 (*), 나눗셈 (/)입니다. 이 연산자들은 대부분의 다른 프로그래밍 언어들이 부동소수점 값을 연산하는것처럼 동작합니다. (0 으로 나누는 것은 {{jsxref("Infinity")}} 을 발생시키는 것을 기억하세요) 예를 들면:

+

+ 산술 연산자는 두 개의 숫자 값(리터럴 또는 변수)을 피연산자로 받아서 하나의 숫자 값을 반환합니다. 표준 산술 연산자는 + 더하기(+), 빼기(-), 곱하기(*), 나누기(/)입니다. 이 연산자들은 + 대부분의 다른 프로그래밍 언어에서 부동소수점 값을 연산할 때와 동일하게 동작합니다. (0 으로 나눌 경우 + {{jsxref("Infinity")}}를 반환하는 것에 주의하세요) 예를 들어, +

-
1 / 2; // 0.5
-1 / 2 == 1.0 / 2.0; // this is true
+
+1 / 2;              // 0.5
+1 / 2 == 1.0 / 2.0; // 참
 
-

또한, 표준 산술 연산자 (+, -, *, /) 에 대해 JavaScript는 다음의 표에 나와 있는 산술 연산자를 제공합니다.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - +

+ JavaScript는 표준 산술 연산자(+, -, *, /) 외에도 아래의 표에 + 나열된 산술 연산자를 제공합니다. +

+ +
산술 연산자
연산자설명예제
나머지 연산자 (%)이항 연산자입니다. 두 피연산자를 나눈후 나머지를 반환합니다.12 % 5 는 2를 반환합니다.
증가 연산자 (++)단항 연산자입니다. 피연산자에 1을 더합니다. 만약 연산자를 피연산자 앞(++x)에 사용하면, 피연산자에 1을 더한 값을 반환합니다.; 만약 연산자를 피연산자 뒤(x++)에 사용하면, 피연산자에 1을 더하기 전 값을 반환합니다.x 가 3이면 ++xx 를 4로 만들고 4를 반환합니다. 반면 x++ 는 3을 반환하고 x 를 4로 만듭니다.
감소 연산자 (--)단항 연산자입니다. 피연산자로 부터 1을 뺍니다. 반환값은 증가 연산자와 유사합니다.x 가 3이면 --xx 를 2로 만들고2를 반환합니다. 반면 x-- 는 3을 반환하고 x 를 2로 만듭니다.
단항 부정 연산자 (-)단항 연산자 입니다. 피연산자의 반대값(부호 바뀐값)을 반환합니다. x 가 3이면 -x 는 -3을 반환합니다.
숫자화 연산자 (+)단항연산자 입니다. 피연산자가 숫자값이 아니라면 피연산자를 숫자로 변환하기를 시도합니다.+"3"3을 반환합니다.
- +true1. 을 반환합니다.
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+ 산술 연산자 +
연산자설명예제
+ 나머지 + (%) + 이항 연산자입니다. 두 피연산자를 나눴을 때의 나머지를 반환합니다.12 % 5 는 2를 반환합니다.
+ 증가 + (++) + + 단항 연산자입니다. 피연산자에 1을 더합니다. 전위 연산자(++x)로 사용하면 피연산자에 1을 더한 값을 + 반환합니다. 반면 후위 연산자(x++)로 사용한 경우 피연산자에 1을 더하기 전의 값을 반환합니다. + + x가 3일 때, ++xx에 4를 할당한 후 4를 반환합니다. 반면 + x++는 3을 먼저 반환한 후 x에 4를 할당합니다. +
+ 감소 + (--) + 단항 연산자입니다. 피연산자에서 1을 뺍니다. 반환 값은 증가 연산자처럼 동작합니다. + x가 3일 때, --xx에 2를 할당한 후 2를 반환합니다. 반면 + x--는 3을 먼저 반환한 후 x에 2를 할당합니다. +
+ 단항 부정 + (-) + 단항 연산자입니다. 피연산자의 부호를 반대로 바꾼 값을 반환합니다.x가 3일 때, -x는 -3을 반환합니다.
+ 단항 플러스 + (+) + 단항 연산자입니다. 피연산자가 숫자 타입이 아니면 숫자로 변환을 시도합니다. + +"3"3을 반환합니다.
+ +true1을 반환합니다. +
거듭제곱 (**)base^exponent, 즉 baseexponent로 거듭제곱한 결과를 반환합니다. + 2 ** 38을 반환합니다.
+ 10 ** -10.1을 반환합니다. +
-

비트 연산자

+

비트 연산자

-

비트 연산자는 피연산자를 10진수, 16진수, 8진수처럼 취급하지 않고 32비트의 집합으로 취급합니다. 예를 들면, 10진수의 9는 2진수의 1001로 나타낼 수 있습니다. 비트 단위 연산자는 이진법으로 연산을 수행하지만, JavaScript의 표준 숫자값을 반환합니다..

+

+ 비트 연산자는 피연산자를 10진수, 16진수, 8진수 숫자로 취급하지 않고, 대신 비트 32개의 집합으로 취급합니다. 예를 들어, + 10진수 9는 2진수 1001로 나타냅니다. 비트 연산자는 이러한 이진법 표현에 대해 연산을 수행하지만, 반환할 땐 JavaScript + 표준 숫자로 반환합니다. +

-

다음의 표는 JavaScript의 비트단위 연산자의 요약입니다.

+

아래의 표에서 JavaScript 비트 연산자의 요약본을 볼 수 있습니다.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
비트 연산자
연산자사용법설명
비트단위 논리곱a & b두 피연산자의 각 자리 비트의 값이 둘다 1일 경우 해당하는 자리에 1을 반환합니다.
비트단위 논리합a | b두 피연산자의 각 자리 비트의 값이 둘다 0일 경우 해당하는 자리에 0을 반환합니다.
비트단위 배타적 논리합a ^ b두 피연산자의 각 자리 비트의 값이 같을 경우 해당하는 자리에 0을 반환합니다.
- [두 피연산자의 각 자리 비트의 값이 다를 경우 해당하는 자리에 1을 반환합니다.]
비트단위 부정~ a피연산자의 각 자리의 비트를 뒤집습니다.
왼쪽 시프트a << b오른쪽에서 0들을 이동시키면서, a의 이진수의 각 비트를 b비트 만큼 왼쪽으로 이동시킨 값을 반환합니다.
부호 전파 오른쪽 시프트a >> b사라지는 비트를 버리면서, a의 이진수의 각 비트를 b비트만큼 이동시킨값을 반환합니다.
부호 없는 오른쪽 시프트a >>> b사라지는 비트를 버리고 왼쪽에서 0을 이동시키면서, a의 이진수의 각 비트를 b비트 만큼 이동시킨 값을 반환합니다.
+ 비트 연산자 +
연산자사용법설명
+ 비트 AND + a & b두 피연산자의 각 자리 비트의 값이 모두 1인 위치에 1을 반환합니다.
+ 비트 OR + a | b두 피연산자의 각 자리 비트의 값이 모두 0인 위치에 0을 반환합니다.
+ 비트 XOR + a ^ b + 두 피연산자의 각 자리 비트의 값이 서로 같은 위치에 0을 반환합니다.
+ [두 피연산자의 각 자리 비트의 값이 서로 다른 위치에 1을 반환합니다.] +
+ 비트 NOT + ~ a피연산자의 각 자리의 비트를 뒤집습니다.
+ 왼쪽 시프트 + a << ba의 이진 표현을 b만큼 왼쪽으로 이동하고, 오른쪽은 0으로 채웁니다.
+ 오른쪽 시프트 + a >> ba의 이진 표현을 b만큼 오른쪽으로 이동하고, 1 미만으로 이동한 비트는 버립니다.
+ 부호 없는 오른쪽 시프트 + a >>> b + a의 이진 표현을 b만큼 오른쪽으로 이동하고, 1 미만으로 이동한 비트는 버립니다. 왼쪽은 + 0으로 채웁니다. +
-

비트 논리 연산자

+

비트 논리 연산자

-

개념상으로, 비트단위 논리 연산자는 다음과 같이 동작합니다:

+

개념적으로, 비트 논리 연산자는 다음과 같이 동작합니다.

    -
  • 피연산자들은 32비트 정수로 변환되고, 비트(0 과 1)의 연속으로 표현됩니다. 숫자는 32비트가 넘는 경우 가장 중요한(왼쪽) 비트부터 제거됩니다. 예를 들면 아래 예처럼 32비트가 넘는 정수는 32비트 정수형으로 변환됩니다: -
    변환전: 11100110111110100000000000000110000000000001
    -변환수:             10100000000000000110000000000001
    -
  • -
  • 처음 피연산자의 각 비트는 두번째 피연산자의 해당하는 비트와 짝지어집니다: 첫번째 비트는 첫번째 비트에, 두번째 비트는 두번째 비트에, 이런식으로 쭉.
  • -
  • 연산자는 각 비트 묶음에 적용되고, 결과는 조립된 비트입니다.
  • +
  • + 두 피연산자를 32비트 정수로 변환해서 비트(0 과 1)의 연속으로 표현합니다. 숫자가 32비트를 초과할 경우 가장 큰 + 비트부터 버립니다. 다음은 32비트가 넘는 정수의 변환 예제입니다. +
    +전: 1110 0110 1111 1010 0000 0000 0000 0110 0000 0000 0001
    +후:                1010 0000 0000 0000 0110 0000 0000 0001
    +
    +
  • +
  • + 왼쪽 피연산자의 각 비트와 오른쪽 피연산자의 각 비트를 순서대로 쌍으로 만듭니다. 즉, 첫 비트는 첫 비트와, 두 번째 + 비트는 두 번째 비트와, ... 32번째 비트는 32번째 비트와 짝을 짓습니다. +
  • +
  • 연산자를 각각의 비트 쌍에 대해 적용한 결과를 비트 단위로 구축합니다.
-

예를 들면, 9의 이진표현은 1001이고, 15의 이진표현은 1111입니다. 따라서, 비트단위 연산자가 이 값들에 적용될때, 결과는 다음과 같습니다:

+

+ 예를 들어, 9의 이진 표현은 1001이고, 15의 이진 표현은 1111입니다. 비트 연산자를 이 두 값에 적용했을 때의 결과는 다음과 같습니다. +

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
비트 연산자 예제
표현결과이진법 설명
15 & 991111 & 1001 = 1001
15 | 9151111 | 1001 = 1111
15 ^ 961111 ^ 1001 = 0110
~15-16~00000000...00001111 = 11111111...11110000
~9-10~00000000...00001001 = 11111111...11110110
+ 비트 연산자 예제 +
표현식결과이진법 설명
15 & 991111 & 1001 = 1001
15 | 9151111 | 1001 = 1111
15 ^ 961111 ^ 1001 = 0110
~15-16~ 0000 0000 ... 0000 1111 = 1111 1111 ... 1111 0000
~9-10~ 0000 0000 ... 0000 1001 = 1111 1111 ... 1111 0110
-

모든 32비트가 비트단위 부정연산자를 통해 뒤집히고, 가장 의미있는(가장 왼쪽의) 비트가 1인 값들이 음수(2의 보수 표기법)로 표현되는것에 주목하세요 . ~x 의 평가 값은 -x -1의 평가값과 동일합니다.

- -

비트 시프트 연산자

- -

비트 단위 연산자는 2개의 피연산자를 가집니다: 첫번째는 이동될 수치이고, 두번째는 첫번째 피연산자가 이동될 비트 자리수를 명시합니다. 비트 이동 연산의 방향은 연산자의 사용에 의해 조종됩니다.

- -

이동 연산자는 피연산자를 32비트의 정수로 변환하고, 왼쪽의 피연산자와 같은 형태를 반환합니다.

- -

이동 연산자는 다음의 표에 나열되었습니다.

- - - - - - - - - - - - - - - - - - - - - - - - - - - +

+ 참고로, 비트 NOT 연산자를 사용하면 32개의 비트를 모두 반전하는데, 가장 큰 (맨 왼쪽) 비트가 1이면 음수를 나타냅니다(2의 + 보수 표현법). ~x-x - 1과 같은 값으로 평가됩니다. +

+ +

비트 시프트 연산자

+ +

+ 비트 시프트 연산자는 시프트를 적용할 값과, 시프트할 자릿수를 피연산자로 받습니다. 시프트 방향은 사용하는 연산자에 따라 + 다릅니다. +

+ +

+ 시프트 연산자는 피연산자를 32비트 정수로 변환하고, 결과 값을 {{jsxref("Number")}}나 {{jsxref("BigInt")}}로 반환합니다. + 정확히는, 왼쪽 피연산자가 BigIntBigInt를 반환하고, 그 외에는 Number를 + 반환합니다. +

+ +

아래의 표에서 시프트 연산자의 종류를 볼 수 있습니다.

+ +
비트 시프트 연산자
연산자설명예제
왼쪽 시프트
- (<<)
이 연산자는 첫번째 피연산자를 특정한 수의 비트를 왼쪽으로 이동시킵니다. 왼쪽으로 초과되어 이동되는 비트들은 버려집니다. 오른쪽으로부터 0이 이동됩니다.9<<2 yields 36, because 1001 shifted 2 bits to the left becomes 100100, which is 36.
부호 전파 오른쪽 시프트(>>)이 연산자는 첫번째 피연산자를 특정한 수의 비트를 오른쪽으로 이동시킵니다. 오른쪽으로 초과되어 이동되는 비트들은 버려집니다. 왼쪽으로부터 제일 왼쪽의 비트 값이 이동됩니다.9>>2 yields 2, because 1001 shifted 2 bits to the right becomes 10, which is 2. Likewise, -9>>2 yields -3, because the sign is preserved.
부호 없는 오른쪽 시프트(>>>)이 연산자는 첫번째 피연산자를 특정한 수의 비트를 오른쪽으로 이동시킵니다. 오른쪽으로 초과되어 이동되는 비트들은 버려집니다. 왼쪽으로부터 0이 이동됩니다 .19>>>2 yields 4, because 10011 shifted 2 bits to the right becomes 100, which is 4. For non-negative numbers, zero-fill right shift and sign-propagating right shift yield the same result.
+ + + + + + + + + + + + + + + + + + + + + + + + +
+ 비트 시프트 연산자 +
연산자설명예제
+ 왼쪽 시프트 (<<) + + 왼쪽 피연산자를 오른쪽 피연산자만큼 왼쪽으로 시프트합니다. 왼쪽으로 넘치는 비트는 버리고, 오른쪽을 0으로 + 채웁니다. + 9<<2는, 1001을 왼쪽으로 2번 시프트하면 100100이므로 36입니다.
+ 오른쪽 시프트 (>>) + + 왼쪽 피연산자를 오른쪽 피연산자만큼 오른쪽으로 시프트합니다. 오른쪽으로 넘치는 비트는 버리고, 왼쪽은 제일 큰 + 비트의 값으로 채웁니다. + + 9>>2는, 1001을 오른쪽으로 2번 시프트하면 10이므로 2입니다. 마찬가지로 + -9>>2는, 부호를 유지하므로 -3을 반환합니다. +
+ 부호 없는 오른쪽 시프트 (>>>) + + 왼쪽 피연산자를 오른쪽 피연산자만큼 오른쪽으로 시프트합니다. 오른쪽으로 넘치는 비트는 버리고, 왼쪽은 0으로 + 채웁니다. + + 19>>>2는, 10011을 오른쪽으로 2번 시프트하면 100이므로 4입니다. 양의 수에 대해서는 오른쪽 + 시프트와 부호 없는 오른쪽 시프트 둘 다 같은 결과를 반환합니다. +
-

논리 연산자

- -

논리 연산자는 보통 부울 값과 사용됩니다; 부울 값들과 사용될때, 연산자는 부울값을 반환합니다. 그러나,&& 과 || 연산자는 실제로 명시된 피연자들 중 하나를 반환합니다. 따라서, 만약 이 연산자들이 부울 값이 아닌 값들과 함께 쓰였을때, 그들은 부울 값이 아닌 값을 반환할지도 모릅니다. 논리 연산자들은 다음의 표에서 설명됩니다.

- - - - - - - - - - - - - - - - - - - - - - - - - +

논리 연산자

+ +

+ 논리 연산자는 보통 불리언(논리) 값과 함께 사용해서 불리언 값을 반환합니다. 그러나 + &&|| 연산자는 사실 두 피연산자 중 하나를 반환하는 것으로, 만약 둘 중 하나가 + 불리언 값이 아니라면 논리 연산자의 반환 값도 불리언 값이 아닐 수 있습니다. 아래의 표에서 논리 연산자의 설명을 볼 수 + 있습니다. +

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

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

-
논리 NOT (!)!expr단일 피연산자를 true로 변환할 수 있으면 false를 반환합니다. 그렇지 않으면 true를 반환합니다.
+ + + + + + + + + + + + + + + + + + + + + + +
+ 논리 연산자 +
연산자사용법설명
+ 논리 AND + (&&) + + expr1 && expr2 + + expr1false로 변환할 수 있으면 expr1을 반환합니다. 그 외의 경우에는 + expr2를 반환합니다. 따라서 불리언 값과 함께 사용한 경우, 둘 다 참일 때 true를, 그 + 외에는 false를 반환합니다. +
논리 OR (||)expr1 || expr2 + expr1true로 변환할 수 있으면 expr1을 반환합니다. 그 외의 경우에는 + expr2를 반환합니다. 따라서 불리언 값과 함께 사용한 경우, 둘 중 하나가 참일 때 true를, + 그 외에는 false를 반환합니다. +
+ 논리 NOT + (!) + !expr + 단일 피연산자를 true로 변환할 수 있으면 false를 반환합니다. 그 외에는 + true를 반환합니다. +
-

false로 변환될 수 있는 표현 예제들은 null, 0, NaN, 빈 문자열 (""), 또는 정의되지 않음 으로 평가될 수 있습니다.

+

+ false로 변환할 수 있는 표현식은 평가 결과가 {{jsxref("null")}}, 0, {{jsxref("NaN")}}, 빈 + 문자열(""), {{jsxref("undefined")}}인 경우입니다. +

-

다음의 코드는 && (논리 곱) 연산자의 예제를 보여주고 있습니다.

+

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

-
var a1 =  true && true;     // t && t returns true
+
+var a1 =  true && true;     // t && t returns true
 var a2 =  true && false;    // t && f returns false
 var a3 = false && true;     // f && t returns false
 var a4 = false && (3 == 4); // f && f returns false
@@ -467,9 +734,10 @@ var a6 = false && "Cat";    // f && t returns false
 var a7 = "Cat" && false;    // t && f returns false
 
-

다음의 코드는 || (논리 합) 연산자의 예제를 보여주고 있습니다.

+

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

-
var o1 =  true || true;     // t || t returns true
+
+var o1 =  true || true;     // t || t returns true
 var o2 = false || true;     // f || t returns true
 var o3 =  true || false;    // t || f returns true
 var o4 = false || (3 == 4); // f || f returns false
@@ -478,449 +746,546 @@ var o6 = false || "Cat";    // f || t returns Cat
 var o7 = "Cat" || false;    // t || f returns Cat
 
-

다음의 코드는 ! (논리 부정) 연산자의 예제를 보여주고 있습니다.

+

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

-
var n1 = !true;  // !t returns false
+
+var n1 = !true;  // !t returns false
 var n2 = !false; // !f returns true
 var n3 = !"Cat"; // !t returns false
 
-

단락 평가

+

단락 평가

-

논리 연산자가 왼쪽에서 오른쪽으로 평가될때, 논리연산자는 다음의 규칙을 따라서 "단축 계산"으로 검사됩니다:

+

+ 논리 연산자는 왼쪽에서 오른쪽의 순서로 평가하므로, 다음 규칙을 사용해서 "단락"(short-circuit) 평가가 가능한지 + 판별합니다. +

    -
  • false && anything 는 false로 단축 계산됩니다.
  • -
  • true || anything 는 true로 단축 계산됩니다.
  • +
  • + false && 아무거나는 거짓으로 단락 평가합니다. +
  • +
  • + true || 아무거나는 참으로 단락 평가합니다. +
-

이 논리 규칙들은 이러한 평가가 언제나 정확하다고 보증합니다. 위에서 anything 부분은 평가되지 않았고, 어떤 부작용도 아무런 효과를 미치지 못한다는 것에 주목하세요.

+

+ 논리 규칙은 위의 단락 평가가 항상 옳음을 보증합니다. 아무거나 부분의 표현식은 평가도 하지 않으므로, 해당 + 표현식에서 유발하게 되는 부수 효과도 전혀 발생하지 않음에 주의하세요. +

+ +

+ 참고로 ||을 사용한 두 번째 단락 평가의 경우, 최근 코드에서는 새로운 + 널 병합 연산자 + (??)를 사용할 수도 있습니다. 널 병합 연산자는 첫 번째 연산자가 "널과 유사"한, 즉 {{jsxref("null")}}이거나 {{jsxref("undefined")}}일 때만 두 번째 피연산자를 반환합니다. ''와 + 0도 유효한 값이라면 널 병합 연산자가 기본 값을 나타낼 때 더 좋은 선택지입니다. +

-

문자열 연산자

+

문자열 연산자

-

문자열 값으로 사용될 수 있는 비교 연산자에 덧붙여서, 연결 연산자 (+)는 두 문자열 값을 연결하고,두 문자열이 합쳐진 새로운 문자열을 반환합니다.

+

+ 문자열에 사용할 수 있는 비교 연산자들 외에도, 문자열 연결(+) 연산자는 두 문자열의 값을 서로 연결한 새로운 + 문자열을 반환합니다. +

예를 들어,

-
console.log("my " + "string"); // console logs the string "my string".
+
console.log('나만의 ' + '문자열'); // 콘솔에 "나만의 문자열"을 기록
-

복합 할당 연산자인 += 또한 문자열을 연결하는데 사용할 수 있습니다.

+

단축 할당 연산자인 += 또한 문자열을 연결결할 때 사용할 수 있습니다.

예를 들어,

-
var mystring = "alpha";
-mystring += "bet"; // evaluates to "alphabet" and assigns this value to mystring.
+
+var mystring = '한';
+mystring += '글'; // "한글"로 평가되며, mystring에 "한글"을 할당함
+
-

조건 (삼항) 연산자

+

조건 (삼항) 연산자

-

조건 연산자 는 JavaScript에서 3개의 항을 사용하는 유일한 연산자 입니다. 조건 연산자는 조건에 따라 2개의 값중 하나를 가질 수 있습니다. 문법은 다음과 같습니다:

+

+ 조건 연산자는 JavaScript에서 세 개의 + 피연산자를 받는 유일한 연산자입니다. 조건 연산자는 주어진 조건에 따라 두 값 중 하나를 반환합니다. 구문은 다음과 + 같습니다. +

-
조건 ? 값1 : 값2
-
+
condition ? val1 : val2
-

만약 조건이 참이라면, 조건 연산자는 값1을 값으로 갖습니다. 그렇지 않은 경우 조건 연산자는 값2을 값으로 갖습니다. 표준 연산자를 사용하는 어디든 조건연산자를 사용할 수 있습니다.

+

+ 만약 condition이 참이라면, 조건 연산자는 val1을 반환하고, 그 외에는 val2를 + 반환합니다. 다른 연산자를 사용할 수 있는 곳이라면 조건 연산자도 사용할 수 있습니다. +

에들 들어,

-
var status = (age >= 18) ? "adult" : "minor";
+
+var status = (age >= 18) ? "성인" : "미성년자";
 
-

이 구문은 age 변수가 18보다 같거나 클때 "adult" 값을 status 변수에 할당합니다. 그렇지 않은 경우, 이 구문은 "minor"값을 status변수에 할당합니다.

+

+ 위의 명령문은 age가 18 이상이라면 status 변수에 "성인"을 할당하고, 그렇지 않으면 + "미성년자"를 할당합니다. +

-

쉼표 연산자

+

쉼표 연산자

-

쉼표 연산자 (,)는 두 피연산자를 평가하고, 마지막 피연산자의 값을 반환합니다. 이 연산자는 주로 for 반복문 안에서 각각의 시간에 복수의 변수들을 갱신하기 위하여 사용합니다.

+

+ 쉼표 연산자(,)는 두 피연산자를 + 모두 평가하고, 오른쪽 피연산자의 값을 반환합니다. 쉼표 연산자는 주로 for 반복문 안에서 사용해서 한 번의 + 반복으로 다수의 변수를 변경할 때 사용합니다. 그 외의 상황에 사용하는 것은, 꼭 필요하지 않다면 좋지 않은 코드 스타일로 + 여겨집니다. 대개 쉼표 연산자보다는 두 개의 분리된 명령문을 사용하는 편이 낫습니다. +

-

예를 들어, a는 각 변에 10개의 원소가 있는 2차원 배열일때, 다음의 코드는 콤마 연산자를 두 변수를 한번에 증가 시키기 위하여 사용하였습니다. 이 코드는 배열의 대각선에 위치한 원소를 출력합니다:

+

+ 쉼표 연산자의 예제로는, a가 2차원 배열로서 10행 10열의 요소를 가지고 있다면, 다음 코드는 쉼표 연산자를 + 사용해서 두 개의 변수를 한꺼번에 업데이트하는 모습을 보입니다. 코드의 실행 결과는 a의 요소를 대각선((0, + 0), (1, 1), (2, 2), ...)으로 출력한 것입니다. +

-
var x = [0,1,2,3,4,5,6,7,8,9]
+
+var x = [0,1,2,3,4,5,6,7,8,9];
 var a = [x, x, x, x, x];
 
-for (var i = 0, j = 9; i <= j; i++, j--)
-  console.log('a[' + i + '][' + j + ']= ' + a[i][j]);
- -

단항 연산자

- -

단항 연산자는 오직 하나의 피연산자를 가지고 연산을합니다.

- -

delete

- -

delete연산자는 객체, 객체의 속성 또는 배열의 특정한 위치에 있는 객체를 삭제합니다. 문법은 다음과 같습니다:

- -
delete objectName;
-delete objectName.property;
-delete objectName[index];
-delete property; // legal only within a with statement
+for (var i = 0, j = 9; i <= j; i++, j--);
+//                                   ^
+  console.log('a[' + i + '][' + j + ']= ' + a[i][j])
 
-

objectName은 객체의 이름이고, property는 객체에 존재하는 속성이고,index는 배열의 위치를 나타내는 정수입니다.

+

단항 연산자

-

네번째 형태의 경우,객체의 속성을 삭제하기 위하여 with 구문이 있어야만 동작합니다.

+

단항 연산은 오직 하나의 피연산자만 사용하는 연산입니다.

-

delete 연산자를 var 구문을 사용하지 않고 묵시적으로 만들어진 변수를 삭제할 때 사용할 수 있습니다.

+

delete

-

만약 delete연산자의 동작이 성공했다면, delete 연산자는 속성이나, 원소를 undefined 로 설정합니다. delete 연산자는 연산이 수행 가능할때 true값을 반환합니다; 수행이 불가능 할 경우 false 값을 반환합니다.

+

+ delete연산자는 객체의 속성을 삭제합니다. 구문은 다음과 같습니다. +

-
x = 42;
-var y = 43;
-myobj = new Number();
-myobj.h = 4;    // create property h
-delete x;       // returns true (can delete if declared implicitly)
-delete y;       // returns false (cannot delete if declared with var)
-delete Math.PI; // returns false (cannot delete predefined properties)
-delete myobj.h; // returns true (can delete user-defined properties)
-delete myobj;   // returns true (can delete if declared implicitly)
+
+delete object.property;
+delete object[propertyKey];
+delete objectName[index];
 
-
배열의 원소를 삭제하기
+

+ 위의 구문에서, objectName은 객체의 이름이고, property는 객체에 존재하는 속성, + propertyKey는 존재하는 속성을 가리키는 문자열이나 심볼입니다. +

-

배열의 원소를 삭제할때, 배열의 길이에는 영향을 주지 못합니다. 예를 들어, 만약 a[3], a[4]를 삭제 했다면 a[4]a[3]는 undefined(정의되지 않음)상태로 되어 있습니다.

+

+ delete 연산자가 속성을 성공적으로 삭제한 이후, 해당 속성을 접근하려고 하면 undefined가 + 반환됩니다. delete는 속성을 제거할 수 있는 경우에는 true를 반환하고, 제거할 수 없을 땐 + false를 반환합니다. +

-

delete 연산자가 배열의 한 원소를 삭제하였을때, 그 원소는 배열에 존재하지 않습니다. 다음의 예제에서, trees[3]delete 연산자에 의해 제거되었습니다.그러나, trees[3] 는 아직도 다룰수 있고 undefined(정의 되지 않음) 을 반환합니다.

+
+delete Math.PI;     // false 반환 (설정 불가한 속성 삭제 불가)
 
-
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
-delete trees[3];
-if (3 in trees) {
-  // this does not get executed
-}
+var myobj = {h: 4};
+delete myobj.h;     // true 반환 (사용자 정의 속성 삭제 가능)
 
-

만약 배열의 원소가 존재하지만 undefined(정의 되지 않음)값을 가지고 싶으면, delete 연산자 대신 undefined 키워드를 사용하세요. 다음의 예제에서, trees[3]undefined값을 할당받습니다,그러나 배열의 원소는 아직도 존재합니다:

+
배열의 원소 삭제하기
-
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
-trees[3] = undefined;
-if (3 in trees) {
-  // this gets executed
-}
-
+

+ 배열도 평범한 객체이므로, 기술적으로는 delete를 사용해서 요소를 제거하는 것이 가능합니다. 그러나 이는 + 좋은 방법이 아니므로 피해야 합니다. 배열의 속성을 제거해도 배열 길이 속성은 영향을 받지 않으며, 다른 요소의 인덱스도 + 그대로 남아있습니다. 이런 동작을 원한다면 단순히 값을 undefined로 덮어쓰는 편이 훨씬 낫습니다. 실제로 + 배열을 변형하고자 하면 {{jsxref("Array.splice", "splice")}}와 같은 다양한 배열 메서드를 사용하세요. +

-

typeof

+

typeof

-

typeof 연산자는 다음과 같은 방법으로 사용됩니다:

+

+ typeof 연산자는 다음과 같은 방법으로 + 사용합니다. +

-
typeof 피연산자
-typeof (피연산자)
+
+typeof operand
+typeof (operand)
 
-

typeof 연산자 피연산자의 타입을 나타내는 문자열을 반환합니다. 피연산자 는 어떤 타입인지 반환될 문자열, 변수, 키워드,또는 객체입니다 . 괄호 표현은 선택사항입니다.

+

+ typeof 연산자는 평가 전의 피연산자 타입을 나타내는 문자열을 반환합니다. operand는 문자열, + 변수, 키워드, 객체 등 타입을 알아낼 값입니다. 주위의 괄호는 선택 사항입니다. +

-

다음의 변수를 정의했다고 가정하세요:

+

다음과 같은 변수를 가정하겠습니다.

-
var myFun = new Function("5 + 2");
+
+var myFun = new Function("5 + 2");
 var shape = "round";
 var size = 1;
 var foo = ['Apple', 'Mango', 'Orange'];
 var today = new Date();
 
-

typeof 연산자는 이 변수들에 대하여 다음과 같은 값을 반환합니다:

- -
typeof myFun;     // returns "function"
-typeof shape;     // returns "string"
-typeof size;      // returns "number"
-typeof foo;       // returns "object"
-typeof today;     // returns "object"
-typeof dontExist; // returns "undefined"
-
- -

typeof 연산자는 키워드truenull에 대하여 다음과 같은 결과를 반환합니다:

+

typeof 연산자는 위의 변수들에 대해서 다음과 같은 값을 반환합니다.

-
typeof true; // returns "boolean"
-typeof null; // returns "object"
+
+typeof myFun;     // "function" 반환
+typeof shape;     // "string" 반환
+typeof size;      // "number" 반환
+typeof foo;       // "object" 반환
+typeof today;     // "object" 반환
+typeof dontExist; // "undefined" 반환
 
-

typeof 연산자는 숫자와 문자열에 대하여 다음과 같은 결과를 반환합니다:

+

키워드 truenull에 대해서는 다음과 같은 결과를 반환합니다.

-
typeof 62;            // returns "number"
-typeof 'Hello world'; // returns "string"
+
+typeof true; // "boolean" 반환
+typeof null; // "object" 반환
 
-

typeof 연산자는 객체의 속성에 대하여 속성이 갖고있는 타입의 값을 반환합니다.

+

숫자와 문자열에서는 다음과 같은 결과를 반환합니다.

-
typeof document.lastModified; // returns "string"
-typeof window.length;         // returns "number"
-typeof Math.LN2;              // returns "number"
+
+typeof 62;            // "number" 반환
+typeof 'Hello world'; // "string" 반환
 
-

typeof 연산자는 메소드와 함수들에 대하여 다음과 같은 결과를 반환합니다:

+

객체의 속성에 사용하면 속성이 갖고 있는 값의 타입을 반환합니다.

-
typeof blur;        // returns "function"
-typeof eval;        // returns "function"
-typeof parseInt;    // returns "function"
-typeof shape.split; // returns "function"
+
+typeof document.lastModified; // "string" 반환
+typeof window.length;         // "number" 반환
+typeof Math.LN2;              // "number" 반환
 
-

typeof 연산자는 미리 정의된 객체에 대하여 다음과 같은 결과를 반환합니다:

+

메서드와 함수에 대해선 다음과 같은 결과를 반환합니다.

-
typeof Date;     // returns "function"
-typeof Function; // returns "function"
-typeof Math;     // returns "object"
-typeof Option;   // returns "function"
-typeof String;   // returns "function"
+
+typeof blur;        // "function" 반환
+typeof eval;        // "function" 반환
+typeof parseInt;    // "function" 반환
+typeof shape.split; // "function" 반환
 
-

void

+

사전 정의된 객체에 대해선 다음과 같은 결과를 반환합니다.

-

void 연산자 는 다음과 같은 방법들로 사용됩니다:

- -
void (식)
-void 식
+
+typeof Date;     // "function" 반환
+typeof Function; // "function" 반환
+typeof Math;     // "object" 반환
+typeof Option;   // "function" 반환
+typeof String;   // "function" 반환
 
-

void 연산자는 값을 반환하지 않고 평가되도록 명시합니다. 은 JavaScript의 평가될 표현 입니다. 괄호 로 둘러싸는것은 선택사항이지만, 괄호로 둘러싸는게 좋은 사용방법입니다.

- -

void 연산자를 표현을 하이퍼링크 에서 명시할때 사용할 수 있습니다 . 구문은 실행이 되나, 현재의 문서에는 로드되지 않습니다.

+

void

-

다음의 코드는 사용자가 클릭을 하였을때 아무 일도 안하는 하이퍼링크를 생성합니다. 사용자가 클릭을 했을때, void(0) JavaScript에서 아무런 영향을 줄 수 없는 undefined(정의 되지않음)으로 평가됩니다.

+

+ void 연산자는 다음과 같이 사용합니다. +

-
<a href="javascript:void(0)">Click here to do nothing</a>
+
+void (expression)
+void expression
 
-

다음의 코드는 사용자가 클릭을 하였을때, 폼을 제출하는 하이퍼링크를 생성합니다.

+

+ void 연산자는 표현식을 평가할 때 값을 반환하지 않도록 지정합니다. expression은 평가할 + JavaScript 표현식입니다. 주위 괄호는 선택 사항이지만, 사용하면 좋습니다. +

-
<a href="javascript:void(document.form.submit())">
-Click here to submit</a>
+

관계 연산자

-

관계 연산자

- -

관계 연산자는 피연산자들을 비교하고 ,비교의 참 여부에 기반하여 부울 값을 반환합니다.

+

관계 연산자는 피연산자를 서로 비교하고, 비교 결과가 참인지에 따라 불리언 값을 반환합니다.

in

-

in 연산자는 객체에 특정한 속성이 있는경우 true를 반환합니다. 구문은 다음과 같습니다:

+

+ in 연산자는 지정한 속성이 지정한 객체에 + 존재할 경우 true를 반환합니다. 구문은 다음과 같습니다. +

-
propNameOrNumber in objectName
-
+
propNameOrNumber in objectName
-

propNameOrNumber는 속성의 이름을 나타내는 문자열 또는 배열의 인덱스를 나타내는 숫자이고, objectName은 객체의 이름입니다.

+

+ propNameOrNumber는 속성이나 배열 인덱스를 나타내는 문자열, 숫자, 심볼 표현식이며 + objectName은 객체의 이름입니다. +

-

다음의 예제는 in 연산자의 사용 예를 보여줍니다.

+

다음 코드는 in 연산자의 예제입니다.

-
// Arrays
+
+// 배열
 var trees = ["redwood", "bay", "cedar", "oak", "maple"];
-0 in trees;        // returns true
-3 in trees;        // returns true
-6 in trees;        // returns false
-"bay" in trees;    // returns false (you must specify the index number,
-                   // not the value at that index)
-"length" in trees; // returns true (length is an Array property)
-
-// built-in objects
-"PI" in Math;          // returns true
+0 in trees;        // true 반환
+3 in trees;        // true 반환
+6 in trees;        // false 반환
+"bay" in trees;    // false 반환 (인덱스에 위치한 값이 아니라
+                   // 인덱스 자체를 지정해야 함)
+"length" in trees; // true 반환 (length는 Array의 속성임)
+
+// 내장 객체
+"PI" in Math;          // true 반환
 var myString = new String("coral");
-"length" in myString;  // returns true
+"length" in myString;  // true 반환
 
-// Custom objects
+// 사용자 정의 객체
 var mycar = { make: "Honda", model: "Accord", year: 1998 };
-"make" in mycar;  // returns true
-"model" in mycar; // returns true
+"make" in mycar;  // true 반환
+"model" in mycar; // true 반환
 
-

instanceof

+

instanceof

-

instanceof 연산자는 명시된 객체가 명시된 객체형인 경우 true를 반환합니다. 구문은 다음과 같습니다:

+

+ instanceof 연산자는 지정한 객체가 + 지정한 객체 타입에 속하면 true를 반환합니다. +

-
objectName instanceof objectType
-
+
objectName instanceof objectType
-

objectName은 objectType 과 비교할 객체의 이름이고, objectType 은 {{jsxref("Date")}} 또는 {{jsxref("Array")}}과 같은 객체형 입니다.

+

+ objectNameobjectType과 비교할 객체의 이름이고, objectType은 + {{jsxref("Date")}}, {{jsxref("Array")}}와 같은 객체 타입입니다. +

-

instanceof 연산자를 동작시간에 객체의 형태를 확인할 필요가 있을때 사용하세요. 예를 들어, 예외가 발생하였을때, 던저진 예외의 형태에 따라 예외를 처리하는 코드로 나뉘게 할 수 있습니다.

+

+ 런타임에 객체의 타입을 확인할 필요가 있으면 instanceof 연산자를 사용하세요. 예컨대 예외 처리 시에, 잡아낸 + 예외의 타입에 따라 다른 방법으로 처리할 수 있습니다. +

-

예를 들어, 다음의 코드는instanceof 연산자를theDay 객체가 Date 형의 객체인지 알아내는 코드입니다. theDay객체는 Date 형의 객체이기 때문에, if 문 안의 명령문들은 실행됩니다.

+

+ 다음의 코드는 instanceof 연산자를 사용해서 theDay 객체가 Date 객체인지 알아내는 + 예제입니다. theDay 객체는 Date 객체이기 때문에, if 명령문 안의 내용이 + 실행됩니다. +

-
var theDay = new Date(1995, 12, 17);
+
+var theDay = new Date(1995, 12, 17);
 if (theDay instanceof Date) {
-  // statements to execute
+  // 실행할 명령문
 }
 
-

연산자 우선순위

+

연산자 우선순위

-

연산자의 우선순위는 구문을 수행할 때 수행될 순서를 결정합니다. 괄호를 통하여 우선순위를 재정의 할 수 있습니다.

+

+ 연산자의 우선순위는 표현식을 평가할 때 연산자를 적용하는 순서를 결정합니다. 괄호를 사용하면 우선순위를 바꿀 수 + 있습니다. +

-

다음의 표는 우선순위가 높은 순서부터 낮은 순서까지, 연산자의 우선순위에 대하여 설명하고 있습니다.

+

아래 표는 우선순위가 높은 순서에서 낮은 순서로 연산자를 나열합니다.

- - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
연산자 우선순위
Operator typeIndividual operators
맴버 연산자. []
객체 호출/생성 연산자() new
부정/증가 연산자! ~ - + ++ -- typeof void delete
곱셈/나눗셈 연산자* / %
덧셈/뺄셈 연산자+ -
비트단위 시프트 연산자<< >> >>>
관계 연산자< <= > >= in instanceof
같음 비교 연산자== != === !==
비트 단위 논리곱 연산자&
비트단위 배타적 논리합 연산자^
비트단위 논리합 연산자|
논리 곱 연산자&&
논리 합 연산자||
조건 연산자?:
할당 연산자= += -= *= /= %= <<= >>= >>>= &= ^= |=
콤마 연산자,
+ 연산자 우선순위 +
연산자 유형개별 연산자
맴버 접근. []
인스턴스 호출/생성() new
증감! ~ - + ++ -- typeof void delete
곱하기/나누기 연산자* / %
더하기/빼기 연산자+ -
비트 시프트<< >> >>>
관계< <= > >= in instanceof
동등/일치== != === !==
비트 AND&
비트 XOR^
비트 OR|
논리 AND&&
논리 OR||
조건?:
할당 + = += -= *= /= %= <<= >>= >>>= &= ^= |= &&= ||= ??= +
쉼표,
-

각 각의 연산자에 대한 추가적인 상세사항에 대해 연결된, 더 자세한 표를 보고 싶으면, JavaScript Reference에서 보실 수 있습니다.

+

+ 각각의 연산자로 향하는 링크를 포함한 더 자세한 표는 + JavaScript 참고서에서 찾을 수 + 있습니다. +

-

표현식

+

표현식

-

코드 값으로 확인된 표현은 그 어떤 타당한 단위입니다.

+

표현식이란 값으로 이행하는 임의의 유효한 코드 단위를 말합니다.

-

개념적으로, 2가지의 유형이 있습니다. 첫번째는, 변수에 값을 할당시키는 것, 두번째는 단순히 값을 갖는것이 있습니다.

+

+ 구문적으로 유효한 표현식은 모두 어떤 값으로 이행하지만, 개념적으로는 두 가지로 나뉩니다. 하나는 부수 효과가 있는(예시: + 변수에 값을 할당) 표현식이고, 다른 하나는 평가하면 어떤 값으로 이행하는 표현식입니다. +

-

x = 7이란 표현은 첫번째 유형입니다. 이 표현은 x에다가 7을 할당시키기위해 =연산자를 사용합니다. 그 표현자체 7로 계산됩니다.

+

+ x = 7은 앞의 범주에 포함됩니다. 이 표현식은 = 연산자를 사용해서 값 7을 x 변수에 + 할당합니다. 표현식 자체도 7로 평가됩니다. +

-

3 + 4란 코드는 두번째 표현방식의 예입니다. 이 표현은 7이라는 결과로 할당하는것없이 3과 4를 더하기위해 +연산자를 사용합니다.

+

+ 3 + 4는 뒤쪽 범주로 들어갑니다. 이 표현식은 + 연산자를 사용해서 3과 4를 더하지만, 결과인 7을 + 변수에 할당하지는 않습니다. +

-

JavaScript는 아래 표현범주를 따릅니다.

+

JavaScript의 표현식은 다음과 같은 범주로 구분할 수 있습니다.

    -
  • 산수 : 예를 들어 3.14159를 숫자로 평가합니다. (일반적으로 산술 연산자를 사용합니다.)
  • -
  • 문자열 : 예를 들어 "Fred"나 "234"를 문자열로 평가합니다. (일반적으로 문자열 연산자를 사용합니다.)
  • -
  • 논리 : 참이나 거짓으로 평가합니다. (종종 논리 연산자를 수반합니다.)
  • -
  • 일차식 : JavaScript에서 기본핵심어와 일반적인 표현입니다.
  • -
  • 좌변식 : 좌변값들이 배치의 목적입니다.
  • +
  • 산수: 숫자, 예컨대 3.14159로 평가됩니다. 보통 산술 연산자를 사용합니다.
  • +
  • + 문자열: 문자열, 예컨대 "프레디", "234" 등으로 평가됩니다. 보통 문자열 연산자를 + 사용합니다. +
  • +
  • 논리: 참이나 거짓으로 평가됩니다. 대개 논리 연산자를 포함합니다.
  • +
  • 일차 표현식: JavaScript의 키워드와 일반 표현식입니다.
  • +
  • 좌변 표현식: 좌변 값은 할당의 목적지입니다.
-

중요한 표현식

+

일차 표현식

-

JavaScript에서의 기본적인 키워드와 일반적인 표현식입니다.

+

JavaScript의 키워드와 일반 표현식입니다.

this

-

현재 객체를 참조하는 데 this 키워드를 사용합니다. 일반적으로, this는 메소드에서 호출하는 객체를 참조합니다. 점(.)이나 괄호([])로 접근할 수 있습니다.

+

+ 현재 객체를 참조하려면 + this 키워드를 사용하세요. 일반적으로 + this는 메서드의 호출 객체를 참조합니다. 다음과 같이, this를 점이나 대괄호 표기법과 함께 + 사용하세요. +

-
this["propertyName"]
+
+this['propertyName']
 this.propertyName
 
-

어떤 객체의 최솟값 최댓값에 대하여, value 프로퍼티가 유효범위에 속하는지를 평가하는 validate 함수를 호출했다고 가정해봅시다.

+

+ 최대와 최소 값을 받아서, 어떤 객체의 value 속성 유효성을 검증하는 validate라는 함수를 + 가정해봅시다. +

-
function validate(obj, lowval, hival){
+
+function validate(obj, lowval, hival) {
   if ((obj.value < lowval) || (obj.value > hival))
     console.log("Invalid Value!");
 }
 
-

다음과 같이 각 form 요소의 onChange 이벤트 처리기에서 validate 함수를 호출할 수 있습니다. this 일차식을 사용하여 form 요소(element)를 전달할 수 있습니다:

+

+ 다음과 같이, 각 양식 요소의 {{domxref("GlobalEventHandlers/onchange", "onchange")}} 이벤트 처리기에서 + validate를 호출할 때 this를 사용해서 양식 요소의 참조를 제공할 수 있습니다. +

-
<p>Enter a number between 18 and 99:</p>
-<input type="text" name="age" size=3 onChange="validate(this, 18, 99);">
+
+<p>18과 99 사이의 수를 입력:</p>
+<input type="text" name="age" size=3 onchange="validate(this, 18, 99);">
 
-

그룹 연산자

+

그룹 연산자

-

그룹연산자 ()는 표현식 평가의 우선순위를 조절합니다. 예를 들어, 곱셈과 나눗셈 연산을 무시하고, 우선 덧셈 뺄셈 연산을 먼저 수행할 수도 있습니다.

+

+ 그룹연산자 ()는 표현식 평가의 우선순위를 조절합니다. 예를 들어, 곱하기와 나누기보다 더하기와 빼기 연산을 + 먼저 수행할 수 있습니다. +

-
var a = 1;
+
+var a = 1;
 var b = 2;
 var c = 3;
 
-// default precedence
-a + b * c     // 7
-// evaluated by default like this
-a + (b * c)   // 7
+// 기본 우선순위에서는
+a + b * c;     // 7
+// 이런 순서로 평가함
+a + (b * c);   // 7
 
-// now overriding precedence
-// addition before multiplication
-(a + b) * c   // 9
+// 우선순위 재정의
+// 곱하기보다 더하기를 먼저 수행
+(a + b) * c;   // 9
 
-// which is equivalent to
-a * c + b * c // 9
+// ...하면 아래와 같음
+a * c + b * c; // 9
 
-

좌변식

+

좌변 표현식

-

좌측값들이 좌변식의 목적입니다.

+

좌변 값은 할당의 목적지입니다.

-

new

+

new

-

당신은 사용자 정의 객체 형식 또는 한 내장된 객체 형식의 인스턴스를 만드는 데는 new 연산자사용할 수 있습니다. new는 아래와 같이 사용할 수 있습니다:

+

+ new 연산자를 사용하면 사용자 정의 객체 + 타입이나 내장 객체 타입의 인스턴스를 생성할 수 있습니다. 아래 코드처럼 사용하세요. +

-
var objectName = new objectType([param1, param2, ..., paramN]);
+
+var objectName = new objectType([param1, param2, ..., paramN]);
 

super

-

Super 키워드개체의 부모에 함수를 호출하는 데 사용됩니다. 예를 들어 이것은 부모생성자를 부르는 클래스들과 함께 유용합니다

+

+ super 키워드는 객체의 부모가 가진 함수를 호출할 때 + 사용합니다. 예를 하나 들면, 클래스에서 부모의 생성자를 + 호출해야 할 때 유용하게 쓸 수 있습니다. +

-
super([arguments]); // calls the parent constructor.
+
+super([arguments]); // 부모 생성자 호출
 super.functionOnParent([arguments]);
 
-

확산연산자

- -

확산연산자는 다중인수(함수호출)또는 다중요소(문자배열)들이 예상되는 곳에서 확장될 수 있는 표현을 하게합니다.

- -

Example: 만약 하나의 배열에 다른 하나의 배열을 추가하고 싶을 때에는 Array 리터럴 구문이 더이상 충분하지않으므로 push, splice, concat과 같은 함수를 사용하는 것이 좋습니다. 하지만 확산연산자를 사용할 경우 좀 더 간결한 구문으로 구현할 수 있습니다. 

- -
var parts = ['shoulder', 'knees'];
-var lyrics = ['head', ...parts, 'and', 'toes'];
-
-//[ 'head', 'shoulders', 'knees', 'and', 'toes' ]
-
- -

위와 같이, 확산연산자의 함수 호출은 다음과 같이 사용합니다.

- -
function f(x, y, z) { }
-var args = [0, 1, 2];
-f(...args);
-
{{PreviousNext("Web/JavaScript/Guide/Functions", "Web/JavaScript/Guide/Numbers_and_dates")}}
-- cgit v1.2.3-54-g00ecf