From da78a9e329e272dedb2400b79a3bdeebff387d47 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:42:17 -0500 Subject: initial commit --- .../guide/expressions_and_operators/index.html | 926 +++++++++++++++++++++ 1 file changed, 926 insertions(+) create mode 100644 files/ko/web/javascript/guide/expressions_and_operators/index.html (limited to 'files/ko/web/javascript/guide/expressions_and_operators') diff --git a/files/ko/web/javascript/guide/expressions_and_operators/index.html b/files/ko/web/javascript/guide/expressions_and_operators/index.html new file mode 100644 index 0000000000..f5e711304f --- /dev/null +++ b/files/ko/web/javascript/guide/expressions_and_operators/index.html @@ -0,0 +1,926 @@ +--- +title: 표현식과 연산자 +slug: Web/JavaScript/Guide/Expressions_and_Operators +tags: + - Beginner + - Expressions + - Guide + - JavaScript + - Operators + - 'l10n:priority' + - 연산자 +translation_of: Web/JavaScript/Guide/Expressions_and_Operators +--- +
{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Functions", "Web/JavaScript/Guide/Numbers_and_dates")}}
+ +

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

+ +

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

+ +

연산자

+ +

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

+ + + +

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

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

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

+ +

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

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

또는

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

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

+ +

할당 연산자

+ +

할당 연산자는 오른쪽 피연산자의 값을 왼쪽 피연산자에 할당합니다. 기본적인 할당 연산자는 오른쪽의 피연산자 값을 왼쪽 피연산자 값에 할당하는 등호(=) 입니다. 즉 x = y 는 y 값을 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
+ +

구조 분해

+ +

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

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

비교 연산자

+ +

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

+ +
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

+
+ +
+

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

+
+ +

산술 연산자

+ +

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

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

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

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
산술 연산자
연산자설명예제
나머지 연산자 (%)이항 연산자입니다. 두 피연산자를 나눈후 나머지를 반환합니다.12 % 5 는 2를 반환합니다.
증가 연산자 (++)단항 연산자입니다. 피연산자에 1을 더합니다. 만약 연산자를 피연산자 앞(++x)에 사용하면, 피연산자에 1을 더한 값을 반환합니다.; 만약 연산자를 피연산자 뒤(x++)에 사용하면, 피연산자에 1을 더하기 전 값을 반환합니다.x 가 3이면 ++x 는 x 를 4로 만들고 4를 반환합니다. 반면 x++ 는 3을 반환하고 x 를 4로 만듭니다.
감소 연산자 (--)단항 연산자입니다. 피연산자로 부터 1을 뺍니다. 반환값은 증가 연산자와 유사합니다.x 가 3이면 --x 는 x 를 2로 만들고2를 반환합니다. 반면 x-- 는 3을 반환하고 x 를 2로 만듭니다.
단항 부정 연산자 (-)단항 연산자 입니다. 피연산자의 반대값(부호 바뀐값)을 반환합니다. x 가 3이면 -x 는 -3을 반환합니다.
숫자화 연산자 (+)단항연산자 입니다. 피연산자가 숫자값이 아니라면 피연산자를 숫자로 변환하기를 시도합니다.+"3" 은 3을 반환합니다.
+ +true 는 1. 을 반환합니다.
+ +

비트 연산자

+ +

비트 연산자는 피연산자를 10진수, 16진수, 8진수처럼 취급하지 않고 32비트의 집합으로 취급합니다. 예를 들면, 10진수의 9는 2진수의 1001로 나타낼 수 있습니다. 비트 단위 연산자는 이진법으로 연산을 수행하지만, 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비트 만큼 이동시킨 값을 반환합니다.
+ +

비트 논리 연산자

+ +

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

+ + + +

예를 들면, 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
+ +

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

+ +

비트 시프트 연산자

+ +

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

+ +

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

+ +

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

+ + + + + + + + + + + + + + + + + + + + + + + + + + + +
비트 시프트 연산자
연산자설명예제
왼쪽 시프트
+ (<<)		이 연산자는 첫번째 피연산자를 특정한 수의 비트를 왼쪽으로 이동시킵니다. 왼쪽으로 초과되어 이동되는 비트들은 버려집니다. 오른쪽으로부터 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.
+ +

논리 연산자

+ +

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

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

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

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

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

+ +

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

+ +
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
+var a5 = "Cat" && "Dog";    // t && t returns Dog
+var a6 = false && "Cat";    // f && t returns false
+var a7 = "Cat" && false;    // t && f returns false
+
+ +

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

+ +
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
+var o5 = "Cat" || "Dog";    // t || t returns Cat
+var o6 = false || "Cat";    // f || t returns Cat
+var o7 = "Cat" || false;    // t || f returns Cat
+
+ +

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

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

단락 평가

+ +

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

+ + + +

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

+ +

문자열 연산자

+ +

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

+ +

예를 들어,

+ +
console.log("my " + "string"); // console logs the string "my string".
+ +

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

+ +

예를 들어,

+ +
var mystring = "alpha";
+mystring += "bet"; // evaluates to "alphabet" and assigns this value to mystring.
+ +

조건 (삼항) 연산자

+ +

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

+ +
조건 ? 값1 : 값2
+
+ +

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

+ +

에들 들어,

+ +
var status = (age >= 18) ? "adult" : "minor";
+
+ +

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

+ +

쉼표 연산자

+ +

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

+ +

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

+ +
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
+
+ +

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

+ +

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

+ +

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

+ +

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

+ +
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)
+
+ +
배열의 원소를 삭제하기
+ +

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

+ +

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

+ +
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+delete trees[3];
+if (3 in trees) {
+  // this does not get executed
+}
+
+ +

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

+ +
var trees = ["redwood", "bay", "cedar", "oak", "maple"];
+trees[3] = undefined;
+if (3 in trees) {
+  // this gets executed
+}
+
+ +

typeof

+ +

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

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

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

+ +

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

+ +
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 연산자는 키워드true 와 null에 대하여 다음과 같은 결과를 반환합니다:

+ +
typeof true; // returns "boolean"
+typeof null; // returns "object"
+
+ +

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

+ +
typeof 62;            // returns "number"
+typeof 'Hello world'; // returns "string"
+
+ +

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

+ +
typeof document.lastModified; // returns "string"
+typeof window.length;         // returns "number"
+typeof Math.LN2;              // returns "number"
+
+ +

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

+ +
typeof blur;        // returns "function"
+typeof eval;        // returns "function"
+typeof parseInt;    // returns "function"
+typeof shape.split; // returns "function"
+
+ +

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

+ +
typeof Date;     // returns "function"
+typeof Function; // returns "function"
+typeof Math;     // returns "object"
+typeof Option;   // returns "function"
+typeof String;   // returns "function"
+
+ +

void

+ +

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

+ +
void (식)
+void 식
+
+ +

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

+ +

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

+ +

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

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

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

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

관계 연산자

+ +

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

+ +

in

+ +

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

+ +
propNameOrNumber in objectName
+
+ +

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

+ +

다음의 예제는 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
+var myString = new String("coral");
+"length" in myString;  // returns true
+
+// Custom objects
+var mycar = { make: "Honda", model: "Accord", year: 1998 };
+"make" in mycar;  // returns true
+"model" in mycar; // returns true
+
+ +

instanceof

+ +

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

+ +
objectName instanceof objectType
+
+ +

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

+ +

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

+ +

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

+ +
var theDay = new Date(1995, 12, 17);
+if (theDay instanceof Date) {
+  // statements to execute
+}
+
+ +

연산자 우선순위

+ +

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

+ +

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

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
연산자 우선순위
Operator typeIndividual operators
맴버 연산자. []
객체 호출/생성 연산자() new
부정/증가 연산자! ~ - + ++ -- typeof void delete
곱셈/나눗셈 연산자* / %
덧셈/뺄셈 연산자+ -
비트단위 시프트 연산자<< >> >>>
관계 연산자< <= > >= in instanceof
같음 비교 연산자== != === !==
비트 단위 논리곱 연산자&
비트단위 배타적 논리합 연산자^
비트단위 논리합 연산자|
논리 곱 연산자&&
논리 합 연산자||
조건 연산자?:
할당 연산자= += -= *= /= %= <<= >>= >>>= &= ^= |=
콤마 연산자,
+ +

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

+ +

표현식

+ +

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

+ +

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

+ +

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

+ +

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

+ +

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

+ + + +

중요한 표현식

+ +

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

+ +

this

+ +

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

+ +
this["propertyName"]
+this.propertyName
+
+ +

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

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

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

+ +
<p>Enter a number between 18 and 99:</p>
+<input type="text" name="age" size=3 onChange="validate(this, 18, 99);">
+
+ +

그룹 연산자

+ +

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

+ +
var a = 1;
+var b = 2;
+var c = 3;
+
+// default precedence
+a + b * c     // 7
+// evaluated by default like this
+a + (b * c)   // 7
+
+// now overriding precedence
+// addition before multiplication
+(a + b) * c   // 9
+
+// which is equivalent to
+a * c + b * c // 9
+
+ +

좌변식

+ +

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

+ +

new

+ +

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

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

super

+ +

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

+ +
super([arguments]); // calls the parent constructor.
+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