연산자 (Operator)
하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행하여 새로운 값을 생성.피연산자 (Operand)
연산되는 대상.
// 산술 연산자
5 * 4 // -> 20
// 문자열 연결 연산자
'My name is ' + 'Lee' // -> 'My name is Lee'
// 할당 연산자
color = 'red' // -> 'red'
// 비교 연산자
3 > 5 // -> false
// 논리 연산자
true && false // -> false
// 타입 연산자
typeof 'Hi' // -> string
산술 연산자 (Arithmetic Operator)
피연산자를 대상으로 수학적 계산을 수행하여 새로운 값을 생성.
산술 연산이 불가능하면 NaN 반환.
2개의 피연산자를 산술 연산하여 숫자 값을 생성.
5 + 2; // -> 7
5 - 2; // -> 3
5 * 2; // -> 10
5 / 2; // -> 2.5
5 % 2; // -> 1
1개의 피연산자를 산술 연산하여 숫자 값을 생성.
var x = 1;
// ++ 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이뤄진다.
x++; // x = x + 1;
console.log(x); // 2
// -- 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이뤄진다.
x--; // x = x - 1;
console.log(x); // 1
var x = 5, result;
// 선할당 후증가(postfix increment operator)
result = x++;
console.log(result, x); // 5 6
// 선증가 후할당(prefix increment operator)
result = ++x;
console.log(result, x); // 7 7
// 선할당 후감소(postfix decrement operator)
result = x--;
console.log(result, x); // 7 6
// 선감소 후할당 (prefix decrement operator)
result = --x;
console.log(result, x); // 5 5
// 아무런 효과가 없다.
+10; // -> 10
+(-10); // -> -10
숫자 타입이 아닌 피연산자에 + 또는 - 연산자를 사용하면 피연산자를 숫자 타입으로 변환하여 반환.
var x = '1';
// 문자열을 숫자로 타입 변환한다.
console.log(+x); // 1
// 부수 효과는 없다.
console.log(x); // "1"
// 불리언 값을 숫자로 타입 변환한다.
x = true;
console.log(+x); // 1
// 부수 효과는 없다.
console.log(x); // true
// 불리언 값을 숫자로 타입 변환한다.
x = false;
console.log(+x); // 0
// 부수 효과는 없다.
console.log(x); // false
// 문자열을 숫자로 타입 변환할 수 없으므로 NaN을 반환한다.
x = 'Hello';
console.log(+x); // NaN
// 부수 효과는 없다.
console.log(x); // "Hello"
// 부호를 반전한다.
-(-10); // -> 10
// 문자열을 숫자로 타입 변환한다.
-'10'; // -> -10
// 불리언 값을 숫자로 타입 변환한다.
-true; // -> -1
// 문자열은 숫자로 타입 변환할 수 없으므로 NaN을 반환한다.
-'Hello'; // -> NaN
// 문자열 연결 연산자
'1' + 2; // -> '12'
1 + '2'; // -> '12'
// 산술 연산자
1 + 2; // -> 3
// true는 1로 타입 변환된다.
1 + true; // -> 2
// false는 0으로 타입 변환된다.
1 + false; // -> 1
// null은 0으로 타입 변환된다.
1 + null; // -> 1
// undefined는 숫자로 타입 변환되지 않는다.
+undefined; // -> NaN
1 + undefined; // -> NaN
우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당.
var x;
x = 10;
console.log(x); // 10
x += 5; // x = x + 5;
console.log(x); // 15
x -= 5; // x = x - 5;
console.log(x); // 10
x *= 5; // x = x * 5;
console.log(x); // 50
x /= 5; // x = x / 5;
console.log(x); // 10
x %= 5; // x = x % 5;
console.log(x); // 0
var str = 'My name is ';
// 문자열 연결 연산자
str += 'Lee'; // str = str + 'Lee';
console.log(str); // 'My name is Lee'
var x;
// 할당문은 표현식인 문이다.
console.log(x = 10); // 10
var a, b, c;
// 연쇄 할당. 오른쪽에서 왼쪽으로 진행.
// ① c = 0 : 0으로 평가된다
// ② b = 0 : 0으로 평가된다
// ③ a = 0 : 0으로 평가된다
a = b = c = 0;
console.log(a, b, c); // 0 0 0
좌항, 우항의 피연산자를 비교하고 결과를 불리언 값으로 반환.
동등 비교 연산자
느슨한 비교 수행. (타입이 달라도 값이 같으면 true)일치 비교 연산자
엄격한 비교 수행. (타입과 값 모두 같아야 true)
// 동등 비교
5 == 5; // -> true
// 타입은 다르지만 암묵적 타입 변환을 통해 타입을 일치시키면 동등하다.
5 == '5'; // -> true
// 동등 비교. 결과를 예측하기 어렵다.
'0' == ''; // -> false
0 == ''; // -> true
0 == '0'; // -> true
false == 'false'; // -> false
false == '0'; // -> true
false == null; // -> false
false == undefined; // -> false
// 일치 비교
5 === 5; // -> true
// 암묵적 타입 변환을 하지 않고 값을 비교한다.
// 즉, 값과 타입이 모두 같은 경우만 true를 반환한다.
5 === '5'; // -> false
NaN
은 자신과 일치하지 않는 유일한 값.
숫자가 NaN
인지 조사하려면 Number.isNaN
을 사용해야 한다.
// NaN은 자신과 일치하지 않는 유일한 값이다.
NaN === NaN; // -> false
// Number.isNaN 함수는 지정한 값이 NaN인지 확인하고 그 결과를 불리언 값으로 반환한다.
Number.isNaN(NaN); // -> true
Number.isNaN(10); // -> false
Number.isNaN(1 + undefined); // -> true
// 양의 0과 음의 0의 비교. 일치 비교/동등 비교 모두 결과는 true이다.
0 === -0; // -> true
0 == -0; // -> true
-0 === +0; // -> true
Object.is(-0, +0); // -> false
NaN === NaN; // -> false
Object.is(NaN, NaN); // -> true
// 부동등 비교
5 != 8; // -> true
5 != 5; // -> false
5 != '5'; // -> false
// 불일치 비교
5 !== 8; // -> true
5 !== 5; // -> false
5 !== '5'; // -> true
// 대소 관계 비교
5 > 0; // -> true
5 > 5; // -> false
5 >= 5; // -> true
5 <= 5; // -> true
조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 false일 때 반환할 값.
var x = 2;
// 2 % 2는 0이고 0은 false로 암묵적 타입 변환된다.
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 짝수
var x = 2, result;
// 2 % 2는 0이고 0은 false로 암묵적 타입 변환된다.
if (x % 2) result = '홀수';
else result = '짝수';
console.log(result); // 짝수
삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문.
var x = 10;
// 삼항 조건 연산자 표현식은 표현식인 문이다. 따라서 값처럼 사용할 수 있다.
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 짝수
우항, 좌항의 피연산자를 논리 연산.
// 논리합(||) 연산자
true || true; // -> true
true || false; // -> true
false || true; // -> true
false || false; // -> false
// 논리곱(&&) 연산자
true && true; // -> true
true && false; // -> false
false && true; // -> false
false && false; // -> false
// 논리 부정(!) 연산자
!true; // -> false
!false; // -> true
// 암묵적 타입 변환
!0; // -> true
!'Hello'; // -> false
// 단축 평가
'Cat' && 'Dog'; // -> 'Dog'
왼쪽 연산자부터 피연잔사를 평가하고, 마지막 평가까지 끝나면 평가 결과를 반환.
var x, y, z;
x = 1, y = 2, z = 3; // 3
자신의 피연산자 표현식을 가장 먼저 평가.
연산자의 우선 순위를 조절할 수 있다.
10 * 2 + 3; // -> 23
// 그룹 연산자를 사용하여 우선순위를 조절
10 * (2 + 3); // -> 50
피연산자의 데이터 타입을 문자열로 반환.
typeof '' // -> "string"
typeof 1 // -> "number"
typeof NaN // -> "number"
typeof true // -> "boolean"
typeof undefined // -> "undefined"
typeof Symbol() // -> "symbol"
typeof null // -> "object"
typeof [] // -> "object"
typeof {} // -> "object"
typeof new Date() // -> "object"
typeof /test/gi // -> "object"
typeof function () {} // -> "function"
null
은 typeof에서 object
를 반환하는데, 자바스크립트의 버그이다.
그런데 이걸 고치기에는 너무 많은 곳에서 활용되고 있어서 건들지 못하고 있다고 한다.
var foo = null;
typeof foo === null; // -> false
foo === null; // -> true
선언하지 않은 식별자를 typeof 연산자로 연산하면 undefined
가 반환.
// undeclared 식별자를 선언한 적이 없다.
typeof undeclared; // -> undefined
좌항의 피연산자를 밑 (Base)으로, 우항의 피연산자를 지수 (Exponent)로 거듭 제곱.
2 ** 2; // -> 4
2 ** 2.5; // -> 5.65685424949238
2 ** 0; // -> 1
2 ** -2; // -> 0.25
Math.pow(2, 2); // -> 4
Math.pow(2, 2.5); // -> 5.65685424949238
Math.pow(2, 0); // -> 1
Math.pow(2, -2); // -> 0.25
// 지수 연산자의 결합 순서는 우항에서 좌항이다. 즉, 우결합성을 갖는다.
2 ** (3 ** 2); // -> 512
Math.pow(2, Math.pow(3, 2)); // -> 512
-5 ** 2;
// SyntaxError: Unary operator used immediately before exponentiation expression.
// Parenthesis must be used to disambiguate operator precedence
(-5) ** 2; // -> 25
var num = 5;
num **= 2; // -> 25
2 * 5 ** 2; // -> 50
할당 연산자 (=), 증가/감소 연산자 (++/—), delete 연산자 등은 다른 코드에 직접적인 영향을 미치는 부수 효과가 있다.
var x;
// 할당 연산자는 변수 값이 변하는 부수 효과가 있다.
// 이는 x 변수를 사용하는 다른 코드에 영향을 준다.
x = 1;
console.log(x); // 1
// 증가/감소 연산자(++/--)는 피연산자의 값을 변경하는 부수 효과가 있다.
// 피연산자 x의 값이 재할당되어 변경된다. 이는 x 변수를 사용하는 다른 코드에 영향을 준다.
x++;
console.log(x); // 2
var o = { a: 1 };
// delete 연산자는 객체의 프로퍼티를 삭제하는 부수 효과가 있다.
// 이는 o 객체를 사용하는 다른 코드에 영향을 준다.
delete o.a;
console.log(o); // {}
()
연산자의 어느 쪽부터 평가를 수행할 것인지를 나타내는 순서