본문 바로가기
웹 프로그래밍/JavaScript | TypeScript

[모던 자바스크립트 Deep Dive] 7장. 연산자

by 청량리 물냉면 2024. 3. 21.
반응형

7.1. 산술 연산자

산술 연산이 불가능한 경우, NaN을 반환한다.

 

7.1.2 단항 산술 연산자

숫자가 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환하여 반환한다. 이때 피연산자를 변경하는 것은 아니고 숫자 타입으로 변환한 값을 생성해 반환한다. 따라서 부수효과는 존재하지 않는다 (=다른 코드에 영향을 주지 않는다) .

var x = "1";
console.log(+x); //1
console.log(typeof +x); //number
console.log(x);  //"1"

var x = false;
console.log(+x); //0
console.log(typeof +x); //number

var x = "Hello";
console.log(+x); //NaN
console.log(typeof +x); //number

 

- 단항 연산자피연산자의 부호를 반전한 값을 반환한다. +단항 연산자와 마찬가지로 숫자 타입이 아닌 피연산자에 사용하면 피연산자를 숫자 타입으로 변환하여 반환한다. 부수효과는 존재하지 않는다.

var x = -10;
console.log(-x); //10

var x = false;
console.log(-x); //-0

var x = "10";
console.log(-x); //-10

var x = "Hello";
console.log(-x); //NaN

 

 

7.3. 비교 연산자

  • 동등 비교(==) 연산자는 좌, 우항 피연산자를 비교할 때 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다.
  • 일치 비교(===) 연산자는 좌, 우항 피연산자가 타입도 같고 값도 같은 경우에만 true를 반환한다.

 

7.6. 쉼표 연산자

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

var x, y, z;
(x = 1), (y = 2), (z = 3);  //3

 

 

7.8. typeof 연산자

typeof: 피연산자의 데이터 타입을 문자열로 반환하는 연산자

Type Result
Undefined "undefined"
* Null "object"
Boolean "boolean"
Number "number"
BigInt "bigint"
String "string"
Symbol (ECMAScript 2015에서 추가) "symbol"
호스트 객체 (JS 환경에서 제공) 구현체마다 다름
Function 객체 (ECMA-262 표현으로는 [[Call]]을 구현하는 객체) "function"
다른 모든 객체 "object"

 

🚫주의🚫

1. typeof 연산자로 null값을 연산할 시, "null"이 아닌 "object"를 반환하는데 이는 js에 존재하는 버그이다. 기존 코드에 영향을 줄 수 있기 때문에 해당 버그는 아직까지 수정되지 못하고 있다.

따라서 값이 null타입인지 확인할 때는 typeof 연산자 대신 일치(===) 연산자를 사용해야 한다.

2. 선언하지 않은 식별자를 typeof 연산자로 연산할 시 ReferenceError 대신 undefined가 반환된다.

 

 

7.9. 지수 연산자

2 ** 2 // 4
2 ** 0 // 1
2 ** -2 // 0.25
2 ** 3 // 8

 

지수 연산자 도입 이전에는 Math.pow 메서드를 사용했다.

Math.pow(2, 2); //4
Math.pow(2, 0); //1
Math.pow(2, -2); //0.25
Math.pow(2, 3); //8

 

 

7.10. 그 외의 연산자

  • ?. : 옵셔널 체이닝 연산자
  • ??: null 병합 연산자
  • delete: 프로퍼티 삭제
  • new: 생성자 함수 호출 시 사용하여 인스턴스 생성
  • in: 프로퍼티 존재 확인

 

7.12. 연산자 우선순위

우선순위 연산자 유형 결합성 연산자
19 그룹 없음 ( … )
18 멤버 접근 좌결합성 … . …
계산된 멤버 접근 좌결합성 … [ … ]
new (인자 리스트 제공) 없음 new … ( … )
함수 호출 좌결합성 … (  )
옵셔널 체이닝 좌결합성 ?.
17 new (인자 리스트 생략) 우결합성 new …
16 후위 증가 없음 … ++
후위 감소 … --
15 논리 NOT 우결합성 ! …
비트 NOT ~ …
단항 양부호 + …
단항 부정 - …
전위 증가 ++ …
전위 감소 -- …
typeof typeof …
void void …
delete (en-US) delete …
await await …
14 거듭제곱 우결합성 … ** …
13 곱하기 좌결합성 … * …
나누기 … / …
나머지 … % …
12 더하기 좌결합성 … + …
빼기 … - …
11 비트 왼쪽 시프트 좌결합성 … << …
비트 오른쪽 시프트 (en-US) … >> …
비트 부호 없는 오른쪽 시프트 (en-US) … >>> …
10 미만 (en-US) 좌결합성 … < …
이하 (en-US) … <= …
초과 (en-US) … > …
이상 (en-US) … >= …
in … in …
instanceof … instanceof …
9 동등 좌결합성 … == …
부등 … != …
일치 (en-US) … === …
불일치 (en-US) … !== …
7 비트 AND 좌결합성 … & …
7 비트 XOR (en-US) 좌결합성 … ^ …
6 비트 OR (en-US) 좌결합성 … | …
5 논리 AND 좌결합성 … && …
4 논리 OR 좌결합성 … || …
널 병합 연산자 좌결합성 … ?? …
3 조건 (삼항) 우결합성 … ? … : …
2 할당 (en-US) 우결합성 … = …
… += …
… -= …
… **= …
… *= …
… /= …
… %= …
… <<= …
… >>= …
… >>>= …
… &= …
… ^= …
… |= …
… &&= …
… ||= …
… ??= …
yield 우결합성 yield …
yield* yield* …
1 쉼표 / 시퀀스 좌결합성 … , …

 

 


출처:

 

 

반응형