728x90
1. 산술 연산자
- 피연산자 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만듬
- 이항 산술 연산자 ex) + , - , * , / , %
- 단항 산술 연산자 ex) ++ , -- , + , -
- 증가/감소(++/--) 연산자 : 피연산자의 값을 변경
- 전위 증가/감소 연산자와 후위 증가/감소 연산자로 나눠짐
var x = 1;
// ++ 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이뤄짐
x ++; x = x + 1;
console.log(x); // 2
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
//숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 숫자 타입으로 변환하여 반환
// + 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작
// 문자열 연결 연산자
'1' + 2; // -> 3
// true는 1로 타입 변환
1 + true; // -> 2
- 개발자의 의도와 상관 없이 자바스크립트 엔진에 의해 암묵적인 타입 변환 발생 (타입 강제 변환)
2. 할당 연산자
- 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당 ex) = , += , -= , *= , /= , %=
- 할당문도 (값으로 평가되는) 표현식인 문
var x;
// 할당문은 표현식인 문이다.
console.log(x = 10); // 10
3. 비교 연산자
- 좌항과 우항의 피연산자 비교, 결과를 불리언 값으로 반환
- if 문이나 for 문 같은 제어문의 조건식에서 주로 사용
- 동등/일치 비교 연산자
- 동등/부동등 연산자 ex) == , !=
- 두 개의 값이 서로 같음
- 좌항 우항의 피연산자 비교 시 암묵적 타입 변환으로 타입을 일치 시킴, 타입 변환 후 같은 값이면 true
- 일치/불일치 비교 연산자 ex) === , !==
- 두 개의 값이 서로 같고 타입이 같음
- 좌항 우항의 피연잔사가 타입, 값도 같은 경우만 true
- 일치 비교 연산자만 사용할 것
- 대소 관계 연산자 ex) > , < , >= , <=
- 동등/부동등 연산자 ex) == , !=
// 일치 비교
5 === 5; // -> true
// NaN은 자신과 일치하지 않는 유일한 값
NaN === NaN; // -> false
// 숫자가 NaN인지 조사 시 빌트인 함수 Number.isNaN 사용
Number.isNaN(NaN); // -> true
Number.inNaN(10); // -> false
Number.inNaN(1 + undefined); // -> true
// ES6에서 도입된 Object.is 메서드 사용 시 예측 가능한 정확한 비교 결과 반환
-0 === +0; // -> true
Object.is(-0, +0) // -> false
NaN === NaN; // -> false
Object.is(NaN, NaN) // -> true
4. 삼항 조건 연산자
- 조건식의 평가 결과에 따라 반환할 값 결정
- 조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 false일 때 반환할 값
- 삼항 조건 연산자 표현식은 값으로 사용 가능
var x = 2;
// 2 % 2 는 0이고 0은 false로 암묵적 타입 변환 됨
var result = x % 2 ? '홀수' : '짝수';
consle.log(result); // 짝수
5. 논리 연산자
- 우항과 좌항의 피연산자를 논리 연산 ex) || , && , !
// 논리합(||) 연산자
true || true; // -> true
true || false; // -> true
// 논리곱(&&) 연산자
true && true; // -> true
true && false; // -> false
// 논리 부정(!) 연산자
!true; // -> false
- 논리합, 논리곱 연산자표현식의 평가 결과는 불리언이 아닐 경우도 있음. 2개의 피연산자 중 어느 한쪽으로 평가 됨
// 단축 평가
'Cat' && 'Dog'; // -> 'Dog'
6. 쉼표 연산자
- 왼쪽 피연산자부터 차례대로 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환
var x, y, z;
x = 1, y = 2, z = 3; // 3
7. 그룹 연산자
- 연산자의 우선 순위 조절 가능
8. typeof 연산자
- 피연산자의 데이터 타입을 문자열로 반환
- 7가지 문자열 중 하나 반환 ex) string, number, boolean, undefined, symbol, object, function
- 반환된 문자열은 7개의 데이터 타입과 정확히 일치하지 않음
- 값이 null인지 확인할 때는 일치 연산자(===) 사용
- 선언하지 않은 식별자를 연산시 참조에러가 아닌 undefined 반환
// undeclared 식별자를 선언한 적이 없음
typeof undeclared; // undefined
9. 지수 연산자
// ES7에서 도입. 좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭 제곱하여 숫자 값 반환
2 \*\* 2; // -> 4
2 ++ 0; // -> 1
// 도입 이전에는 Math.pow 메서드 사용
Math.pow(2, 2); // -> 4
// 음수를 거듭제곱의 밑으로 사용 시 괄호로 묶기
(-5) \*\* 2; // -> 25
// 할당 연산자와 함께 사용 가능
var num = 5;
num \*\*= 2; // -> 25
- 이항 연산자 중 우선순위가 가장 높음
10. 그외 연산자
- ?. , ?? , delete, new, instanceof , in
11. 연산자의 부수 효과
- 다른 코드에 영향을 주는 부수 효과가 있는 연산자 있음
- 할당 연산자(=) , 증가/감소 연산자(++/--), delete 연산자
var x;
// 할당 연산자 : 변수 값이 변하는 부수 효과, x 변수 사용하는 다른 코드에 영향
x = 1;
console.log(x); // 1
// 증가/감소 연산자 : 피연산자의 값을 변경하는 부수 효과
x++;
cosole.log(x); // 2
var o = { a: 1};
// delete 연산자 : 객체의 프로퍼티를 삭제하는 부수 효과 , o 객체 사용하는 다른 코드에 영향
delte o.a;
console.log(o); // {}
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 | ll |
14 | ? ... : ... |
15 | 할당 연산자(=, +=, -=, ...) |
16 | , |
13. 연산자 결합 순서
- 연산자의 어느 쪽부터 평가를 수행할 것인지 나타내는 순서
결합 순서 | 연산자 |
---|---|
좌항 -> 우항 | +, -, /, %, <, <=, &&, ll, (), [], ??, ?., in, instanceof, . |
우항 -> 좌항 | ==, --, 할당연산자, !x, +x, -x, ++x, --x, typeof, delete, ? ...:..., ** |
참고 : 모던 자바스크립트 Deep Dive
728x90
'TIL > JavaScript' 카테고리의 다른 글
[딥다이브] 9장 타입 변환과 단축 평가 (0) | 2022.04.24 |
---|---|
[딥다이브] 8장 제어문 (0) | 2022.04.24 |
프론트엔드 웹개발 환경 셋팅 (0) | 2022.04.21 |
[딥다이브] 6장 데이터 타입 (0) | 2022.04.20 |
[딥다이브] 5장 표현식과 문 (0) | 2022.04.20 |