연산자는 진짜 진짜 기본 내용이기 때문에 간단하게 넘어가겠다!!!
7.1 산술 연산자
산술 연산자(arithmatic operator)는 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술 연산이 불가능한 경우 NaN을 반환한다.
✳️ 이항 산술 연산자
이항(binary) 산술 연산자는 2개의 피연산자를 산술 연산하며, 피연산자의 값을 바꾸는 부수 효과 없이 새로운 숫자 값만을 만들어낸다.
+: 덧셈-: 뺄셈*: 곱셈/: 나눗셈%: 나머지
✳️ 단항 산술 연산자
단항(unary) 산술 연산자는 1개의 피연산자를 산술 연산하며, 증가와 감소 연산자는 피연산자의 값을 변경하는 부수 효과가 있다. 즉, 연산 후 피연산자의 값을 변경하는 암묵적 할당이 이루어진다.
++: 증가--: 감소+: 어떠한 효과도 없다.-: 양수를 음수로, 음수를 양수로 반전한 값을 반환한다.
+ 단항 산술 연산자는 숫자 타입이 아닌 피연산자에 사용되었을 때 피연산자를 숫자 타입으로 변환하여 반환한다. 이때 피연산자의 값을 변견하는 부수효과는 없다.
✳️ 문자열 연결 연산자
+ 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.
// 문자열 연결 연산자
'1' + 2; // '12'
1 + '2'; // '12'
// 산술 연산자
1 + 2; // 3
1 + true; // 2
1 + false; // 1
1 + null; // 1
1 + undefined; // NaN7.2 할당 연산자
할당 연산자(assignment operator)는 우항에 있는 피연산자의 평가 결과를 좌항의 변수에 할당한다. 좌항에 변수에 값을 할당하므로 변수의 값이 바뀌는 부수 효과가 있다.
7.3 비교 연산자
비교 연산자(comparison operator)는 좌항과 우항을 비교해 그 결과를 불리언 값으로 반환한다. 주로 if 문이나 for 문 등의 제어문 조건식에서 사용된다.
✳️ 동등/일치 비교 연산자
동등 비교(loose equality)
연산자와 일치 비교(strict equality) 연산자는 좌항과 우항의 피연산자가 같은 값인지 비교해 불리언 값을 반환한다. 영문 이름에서 알 수 있듯이 동등 비교 연산자는 느슨하게 비교하지만, 일치 비교 연산자는 엄격한 비교를 한다. 대체 무슨 소리인지 아래의 표를 보면서 알아보자.
동등 비교 연산자는 두 피연산자를 비교하기 전에 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다. 때문에 아래와 같은 결과가 나온다.
5 == 5; // true
5 == '5'; // true
'0' == ''; // false
0 == ''; // true
false == 'false'; // false
false == '0'; // true
false == null; // false
false == undefined // false이와 같이 동등 비교 연산자는 결과를 예측하기 힘들기 때문에 사용하지 않는 것이 좋다. 대신 일치 비교 연산자를 사용하자. 일치 비교 연산자는 타입과 값 모두가 같은 경우에만 true를 반환한다. 따라서 결과를 예측하기가 쉽다.
5 === 5; // true
5 === '5'; // false일치 비교 연산자에서 주의할 것은 NaN이다. NaN은 자기 자신과 일치하지 않는다!!!
NaN === NaN; //falseNaN을 비교하기 위해서는 빌트인 함수인 Number.isNaN을 사용하자.
Number.isNaN(NaN); // true
Number.isNaN(10); // false
Number.isNaN(1 + undefined); // true✳️ 대소 관계 비교 연산자
대소 관계 비교 연산자는 피연산자의 크기를 비교하여 불리언 값을 반환한다.
7.4 삼항 조건 연산자
삼항 조건 연산자(ternary operator)는 조건식의 평가 결과에 따라 반환할 값을 결정한다. 부수 효과는 없으며, 형식은 다음과 같다.
조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 false일 때 반환할 값;
만약 첫 번째 피연산자인 조건식이 평가 결과가 불리언 값이 아니면 불리언 값으로 암묵적 타입 변환이 일어난다.이때 조건식이 참이면 콜론(:) 앞의 두 번째 피연산자가 평가되어 반환되고, 거짓이면 콜론(:) 뒤의 세 번째 피연산자가 평가되어 반환된다.
var x = 4;
var result = x % 2 ? '홀수' : '짝수';
// 4 % 2는 0이고, 0은 false로 암묵적 타입 변환된다.
console.log(result); // 짝수삼항 연산자는 if...else 문과 유사하게 처리된다. 하지만 삼항 조건 연산자 표현식은 값처럼 사용할 수 있는 반면에 if...else 문으로 값처럼 사용될 수 없다는 차이가 있다. if...else 문은 표현식이 아닌 문이고, 삼항 조건 연산자는 표현식인 문이기 때문이다.
7.5 논리 연산자
논리 연산자(logical operator)는 우항과 좌항의 피연산자를 논리 연산한다.
||: 논리합(OR)&&: 논리곱(AND)!: 부정(NOT)
각 논리 연산자는 아래와 같이 동작한다.
// 논리합(||) 연산자
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
!'hello'; // false
!0; // true논리 부정 연산자는 항상 불리언 값으로 평가된다. 단, 불리언 값이 아닌 피연산자에 대해서는 불리언 값으로의 암묵적 타입 변환이 일어나기 때문에 피연산자가 반드시 불리언 값일 필요는 없다.
논리합(||) 또는 논리곱(&&) 연산자 표현식의 평가 결과는 항상 불리언 값이지 않다.
'Cat' && 'Dog'; // 'Dog'위와 같은 표현식을 단축 평가라고 하는데, 이해 대해서는 9장에서 알아보도록 하자.
7.6 쉼표 연산자
쉼표 연산자는 왼쪽 피연산자부터 차례대로 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환한다.
var x,, y, z;
x = 1, y = 2, z = 3; // 37.7 그룹 연산자
소괄호(())로 피연산자를 감싸는 것을 그룹 연산자라고 부른다. 초등학생 때 배웠던 그 연산자와 정확히 동일하게 동작한다. 그룹 연산자는 자신이 피연산자인 표현식을 가장 면저 평가하며, 그룹 연산자를 사용하여 연산자의 우선순위를 조절할 수 있다.
7.8 typeof 연산자
typeof 연산자는 피연산자의 데이터 타입을 문자열로 반환한다. typeof 연산자는 "string", "number", "boolean", "undefined", "symbol", "object", "function" 중 하나의 문자열을 반환한다.
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, 배열, 객체, 정규 표현식은 모두 "object"로 반환된다는 사실을 꼭 기억해두자! 또, 선언하지 않은 식별자를 typeof 연산자에 넣으면 ReferenceError가 발생하는 것이 아니라 undefined를 반환한다는 사실도 꼭 기억해두자.
💡 null..?
null이 "object"로 반환되는 것은 버그다~~! 하지만 기존 코드에 영향을 줄 수 있기 때문에 아직까지도 수정되지 못하고 있다. null 타입인지 확인하고 싶을 때는 typeof 연산자 대신 일치 연산자(===)를 사용하도록 하자.
7.9 지수 연산자
지수 연산자는 ES7에서 도입되었다. 지수 연산자는 좌항의 피연산자를 밑(base)으로, 우항의 피연산자를 지수(exponent)로 거듭 제곱한 결과를 반환한다.
2 ** 2; // 4
2 ** 2.5; // 5.65685424949238
2 ** 0; // 1
2 ** -2; // 0.25
// 음수를 밑으로 사용하려면 괄호로 묶어야 한다.
(-5) ** 2 // 25
// 할당 연산자와 함께 사용할 수 있다.
var num = 5;
num **= 2; // 25
// 지수 연산자는 이항 연산자 중 우선순위가 가장 높다.
2 * 5 ** 2; // 50지수 연산자는 Math.pow() 메서드와 같은 역할을 한다. 거듭제곱 연산을 두 번 이상 하는 경우 Math.pow() 메서드보다 지수 연산자의 가독성이 더 좋다.
2 ** (3 ** 2); // 512
Math.pow(2, Math.pow(3, 2)); // 512📎 연산자 우선순위 및 결합 순서
마지막으로 연산자의 우선순위와 결합 순서를 간단하게 살펴보자.
✳️ 연산자 우선순위
✳️ 연산자 결합 순서
