본문 바로가기
개인공부/모던 자바스크립트 Deep Dive

7. 연산자

by 강물둘기 2022. 12. 20.

 개념 

 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입, 지수연산 등을 수행해 하나의 값으로 만드는것.

 

1. 산술 연산자

 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자 값을 만든다. 산술 연산이 불가능한 경우 NaN 반환

ex) 이항 산술연산자( +, -, *, /, % ) 단항 산술연산자( ++, --, +, -)

* ++, -- 의 경우 위치에 따라 다르게 동작한다. 

* +연산자의 경우 다른 타입의 변수를 숫자로 타입변환하거나 문자열끼리 연결할 때 사용한다.

 

2. 할당 연산자

우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 좌항의 변수값이 변하는 부수효과가 있다.

ex) = , +=, -=, *=, /=, %= 

* 할당문은 표현식이다.

 

3. 비교 연산자

 좌항과 우항의 피연산자를 비교한 다음 그 결과를 불리언 값으로 반환한다. 제어문의 조건식에서 주로 사용

ex) 동등/일치 비교 연산자(==, ===, !=, !==). 대소관계 비교 연산자(<, >, <=, >=)

* NaN은 자신과 일치하지 않는 유일한 값이다.( NaN === NaN;  // false)

 

4. 삼항 조건 연산자

기본문법  :    조건식 ? (참일때 반환할 값) : (거짓일 때 반환할 값);

var age = 26;
var beverage = (age >= 21) ? "Beer" : "Juice";
console.log(beverage); // "Beer"

 자바스크립트의 유일한 삼항 연산자이며 부수효과는 없다. 삼항 조건 연산자는 조건문이므로  if else 문과 비슷하게 동작한다.

* if else문과 가장 큰 차이점은 삼항 조건 연산자는 표현식이기 때문에 값처럼 사용할 수 있다.(다른 표현식의 일부가 될 수 있다.)

 

5. 논리 연산자

우항과 좌항의 피연산자(부정 논리 연산자의 경우 우항의 피연산자)를 논리 연산한다. 

ex) ||  ,  && , ! 

* 부정 연산자는 언제나 Boolean값을 반환한다. 다른 타입의 값을 Boolean값으로 바꿀 때 사용하기도한다.

* 논리합(||), 논리곱(&&) 연산자는 2개의 피연산자 중 어느 한쪽으로 평가된다. (9.4절 단축평가 참조)

 

6. 쉼표 연산자

왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과 반환

 

7. 그룹 연산자()

연산자의 우선순위 조정. 그룹연산자가 연산 우선순위가 가장 높다.

 

8. typeof 연산자

피연산자의 데이터타입을 반환한다. 

* typeof null은 object를 반환한다.( javascript 첫번째 버전 버그)

*선언되지 않은 변수는 undefined를 반환한다.

 

9.지수 연산자

좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로 거듭제곱하여 숫자값을 반환한다. Math.pow() 매서드와 비슷하다.

2 ** 3   // 8
Math.pow(2,3) // 8
(-5) ** 2; // 25	음수의 거듭제곱을 밑으로 사용하려면 괄호로 묶어야한다.

10. 그외의 연산자

ex) ?.  ??  delete. new.  instanceof.  in 각각의 장에서 자세히 다룰예정

 

11. 부수효과를 가지는 연산자

부수효과란 다른 코드에 영향을 주는 것을 말한다. 

ex) =  , ++,  -- , delete

 

12. 연산자 우선순위

연산자 끼리의 우선순위가 존재한다. 그룹연산자(괄호)를 사용하여 우선순위를 정하는 것을 권장한다.

 

13. 연산자 결합순서

연산자의 어느쪽부터 평가를 수행할 것인지를 나타내는 순서를 말한다.

결합 순서 연산자
좌항 ➡️ 우항 +, -, /, %, <, <=, >, >=, &&, ||, ., [], (), ??, ?., in, instanceof
우항 ➡️ 좌항 ++, --, 할당연산자(=,+=,...), !x, +x, -x, ++x, --x, typeof, delete, ? ... : ..., ..., **

 

Reference

- 이웅모 ,  모던 자바스크립트 Deep Dive , 위키북스 , 2020 

 

'개인공부 > 모던 자바스크립트 Deep Dive' 카테고리의 다른 글

10장 객체 리터럴  (0) 2022.12.23
9. 타입변환과 단축평가  (0) 2022.12.21
8. 제어문  (0) 2022.12.21
6.데이터타입  (0) 2022.12.19
4. 변수 / 5. 표현식과 문  (1) 2022.12.17

댓글