[Deep Dive] 07장 연산자
피연산자
- 연산자의 대상
- 값으로 평가될 수 있는 표현식
1. 산술 연산자
- 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만듬.
- 산술 연산이 불가능한 경우
NaN을 반환
* 이항 산술 연산자
| 이항 산술 연산자 | 의미 | 부수효과 |
|---|---|---|
+ |
덧셈 | X |
- |
뺄셈 | X |
* |
곱셈 | X |
/ |
나눗셈 | X |
% |
나머지 | X |
* 단항 산술 연산자
| 단항 산술 연산자 | 의미 | 부수효과 |
|---|---|---|
++ |
증가 | O |
-- |
감소 | O |
+ |
효과 X | X |
- |
양수를 음수로, 음수를 양수로 반전한 값 반환 | X |
증가/감소 연산을 하면 피연산자의 값을 변경하는 암묵적 할당이 일어남.
증가/감소 연산자는 위치에 의미가 있다.
- 피연산자 앞에 위피한 전위 증가/감소 연산자는 먼저 피연산자의 값을 증가/감소시킨후 다른 연산을 수행.
- 피연산자 뒤에 위피한 후위 증가/감소 연산자는 먼저 다른 연산을 수행한 후 피연산자의 값을 증가/감소.
* 문자열 연결 연산자
+ 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.
2. 할당 연산자
할당 연산자는 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다.
| 할당 연산자 | 예 | 동일 표현 | 부수효과 |
|---|---|---|---|
= |
x=5 | x=5 | O |
+= |
x+=5 | x=x+5 | O |
-= |
x-=5 | x=x-5 | O |
*= |
x*=5 | x=x*5 | O |
/= |
x/=5 | x=x/5 | O |
%= |
x%=5 | x=x%5 | O |
부수효과 => 변수값이 변함.
3. 비교 연산자
비교 연산자는 좌항과 우항의 피연산자를 비교한 다음 그 결과를 불리언 값으로 반환.
* 동등/일치 비교 연산자
| 비교 연산자 | 의미 | 사례 | 설명 | 부수효과 |
|---|---|---|---|---|
== |
동등 비교 | x==y | x와 y의 값이 같음 | X |
=== |
일치 비교 | x===y | x와 y의 값과 타입이 같음 | X |
!= |
부동등 비교 | x!=y | x와 y의 값이 다름 | X |
!== |
불일치 비교 | x!==y | x와 y의 값과 타입이 다름 | X |
==와===는 같아 보이지만 정확한 비교를 위해서는 ===를 사용하는게 좋다.
==는 비교할때 암묵적인 타입변환을 통해 타입을 일치시킨다.
* 동등/일치 비교 연산자
| 대소 관계 비교 연산자 | 예제 | 설명 | 부수효과 |
|---|---|---|---|
> |
x>y | x가 y보디 큼 | X |
< |
x<y | x가 y보디 작음 | X |
>= |
x>=y | x가 y보디 크거나 같음 | X |
<= |
x<=y | x가 y보디 작거나 같음 | X |
4. 삼항 조건 연산자
삼항 조건 연산자는 조건식의 평가 결과에 따라 반환할 값을 결정.
조건식 ? 조건식이 true일때 반환할 값 : 조건식이 false일때 반환할 값
// x와 y 중에 더 큰 값을 반환
var jongbin = x>y ? x : y
console.log(jongbin) // 값처럼 사용 가능
삼항 조건 연산자를 중복해서 사용할 수 있다.
var jongbin = num ? (num>0 "양수" : "음수") : "0";
5. 논리 연산자
논리 연산자는 우항과 좌항의 피연산자를 논리 연산.
| 논리 연산자 | 의미 | 부수 효과 |
|---|---|---|
|| |
논리합(AND) | X |
&& |
논리곱(OR) | X |
! |
부정(NOT) | X |
불리언 값을 반환한다.(true, false)
6. 쉼표 연산자
쉼표 연산자는 파례대로 피연산자를 평가하고 마지막 피연산자의 결과를 반환.
var x, y, z;
x=1, y=2, x=3;
// 결과
// 3
7. 그룹 연산자
소괄호(())로 묶어 내부 피연산자의 연산을 먼저한다.
8. typeof 연산자
typeof연산자는 피연산자의 데이터 타입을 문자열로 반환.
string, number, boolean, undefined, symbol, object, function 중 한가지를 반환.
9. 지수 연산자
- ES7에서 도입
- 좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭 제곱한 값을 반환.
Math.pow메서드와 같다.- 우선순위가 가장 높다.
2 ** 2; // 4
2 ** 10; // 1024
11. 그 외 연산자
| 연산자 | 개요 |
|---|---|
?. |
옵셔널 체이닝 연산자 |
?? |
null 병합 연산자 |
delete |
프로퍼티 삭제 |
new |
생성자 함수를 호출할 때 사용하여 인스턴스를 생성 |
instanceof |
좌변의 객체가 우변의 생성자 함수와 연결된 인스턴스인지 판별 |
in |
프로퍼티 존재 확인 |
12. 연산자의 우선순위
연산자가 여러개 있을 때 수행되는 순서.
| 우선순위 | 연산자 |
|---|---|
| 1 | () |
| 2 | new(매개변수 존재), ., [](포로퍼티 접근), ()(함수호출), ?.(옵셔널 체이닝 연산자) |
| 3 | new(매개변수 미존재) |
| 4 | x++, x-- |
| 5 | !x, +x, -x, ++x, --x, typeof, delete |
| 6 | **(이항연산자 중에서 우선순위가 가장 높다) |
| 7 | *, /, % |
| 8 | +, - |
| 9 | <, <=, >, >=, in, instanceof |
| 10 | ==, !=, ===, !== |
| 11 | ??(null 병합연산자) |
| 12 | && |
| 13 | || |
| 14 | ? ... : ... |
| 15 | 할당연산자(=, +=, -=,…) |
| 16 | , |
13. 연산자 결합 순서
| 결합 순서 | 연산자 |
|---|---|
| 좌항→우항 | +, -, /, %, <, <=, >, >=, &&, ||, ., [], (), ??, ?., in, instanceof |
| 우항→좌항 | ++, --, 할당연산자(=, +=, -=,…), !x, +x, -x, ++x, --x, typeof, delete, ? ... : ... |
이웅모 선생님의 모던 자바스크립트 Deep Dive를 공부하기 위해 정리한 글입니다.
혹시나 보시다가 고칠 부분이나 마음에 안드시는 부분이 있다면 말씀해주시면 감사하겠습니다!