JS Deep Dive - 연산자

연산자는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수 연산 등을 수행해 하나의 값을 만든다. 이때 연산의 대상자를 피연산자라고 한다. 피연산자는 값으로 평가될 수 있는 표현식 이어야 하며, 피연산자와 연산자의 조합으로 이루어진 연산자 표현식도 값으로 평가될 수 있는 표현식이다.

산술 연산자

---

이항 산술 연산자

5+2; // 덧셈
5-2; // 뺄셈
5*2; // 곱셈
5/2; // 나눗셈
5%2; // 나머지

단항 산술 연산자

var x = 1;

// ++, -- 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이루어진다.
x++; // x = x + 1;
console.log(x); //2

// 선할당 후증가
var result = x++;
console.log(result, x); // 5 6

// 선증가 후 할당
result = ++x;
console.log(result, x); // 7 7

문자열 연결 연산자

// + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.
'1' + 2; // ->'12'
1 + '2'; // '12'

1 + true; // -> 2

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

var str = 'My name is ';
//문자열 연결 연산자
str += 'Lee';
console.log(str); // 'My name is Lee'

비교 연산자

---

동등/일치 비교 연산자

// 동등 비교
'0' == ''; // false
0 == ''; // true
0 == '0'; // true
false == 'false' // false
false == '0' // true
false == null // false
false == undefined // false

// 일치 비교
5 === 5 // true
5 === '5' // false
NaN === NaN // false
0 === -0 // true

// 부동등 비교
5 != 8 // true
5 != 5 // flase

// 불일치 비교
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;

if ( x % 2 ) result = '홀수';
else         result = '짝수';

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

// 암묵적 타입 변환
!'Hello'; // false
!0; // true

// 단축 평가
'Cat' && 'Dog'; // 'Dog'

쉼표, 그룹, 지수 연산자

---

// 쉼표 연산자
var x, y, z;

x = 1, y = 2, z = 3; // 3

// 그룹 연산자
10 * 2 + 3; // 23
// 그룹 연산자를 사용하여 우선순위를 조절
10 * (2 + 3); // 50

// 지수 연산자(좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭 제곱하여 숫자 값을 반환
2 ** 2; // 4
2 ** 0; // 1
2 ** -2; // 0.25
(-5) ** 2; // 25

연산자 우선순위

---

우선순위	연산자
1	( )
2	new(매개변수), ., [ ](프로퍼티 접근), ( )(함수 호출), ? .(옵셔널 체이닝 연산자)
3	new(매개변수 x)
4	x++, x--
5	!x, +x, -x, ++x, --x, typeof, delete
6	**(이항 연산자중에서 우선순위가 가장 높음)
7	*,/,%
8	+,-
9	<, <=, >, >-, in, instanceof
10	==, !-, ---, !==
11	??(null 병합 연산자)
12	&&
13	or 연산자
14	? ... : ...
15	할당 연산자(=, +=, -=,)
16	,