개발 알다가도 모르겠네요

연산자 본문

학습일지/모던 자바스크립트 Deep Dive

연산자

이재빵 2022. 6. 17. 10:03
728x90

문자열 연결 연산자

// 문자열 연결 연산자
'1' + 2; // -> '12'
1 + '2'; // -> '12'

// 산술 연산자
1 + 2; // -> 3

// true는 1로 타입 변환된다.
1 + true; // -> 2

// false는 0으로 타입 변환된다.
1 + false; // -> 1

// null은 0으로 타입 변환된다.
1 + null; // -> 1

// undefined는 숫자로 타입 변환되지 않는다.
+undefined;    // -> NaN
1 + undefined; // -> NaN

위의 코드를 보면 암묵적으로 타입이 자동 변환되는 것을 알 수 있다.

이를 암묵적 타입 변환 또는 타입 강제 변환 이라고 한다.

 

동등/일치 비교 연산자

비교 연산자 의미 사례 설명 부수 효과
== 동등 비교 x == y x와 y의 값이 같음 X
=== 일치 비교 x === y x와 y의 값과 타입이 같음 X
!= 부동등 비교 x != y x와 y의 값이 다름 X
!== 불일치 비교 x !== y x와 y의 값과 타입이 다름 X
// 동등 비교
5 == 5; // -> true

// 타입은 다르지만 암묵적 타입 변환을 통해 타입을 일치시키면 동등하다.
5 == '5'; // -> true
// 동등 비교. 결과를 예측하기 어렵다.
'0' == ''; // -> false
0 == '';   // -> true
0 == '0';  // -> true
false == 'false';   // -> false
false == '0';       // -> true
false == null;      // -> false
false == undefined; // -> false
// 일치 비교
5 === 5; // -> true

// 암묵적 타입 변환을 하지 않고 값을 비교한다.
// 즉, 값과 타입이 모두 같은 경우만 true를 반환한다.
5 === '5'; // -> false
// NaN은 자신과 일치하지 않는 유일한 값이다.
NaN === NaN; // -> false

// Number.isNaN 함수는 지정한 값이 NaN인지 확인하고 그 결과를 불리언 값으로 반환한다.
Number.isNaN(NaN); // -> true
Number.isNaN(10);  // -> false
Number.isNaN(1 + undefined); // -> true

ES6에서 도입된 Object.is 메소드는 다음과 같이 예측 가능한 정확한 비교 결과를 반환한다.

그 외에는 일치 비교 연산자(===)와 동일하게 동작한다.

-0 === +0;         // -> true
Object.is(-0, +0); // -> false

NaN === NaN;         // -> false
Object.is(NaN, NaN); // -> true

 

typeof 연산자

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를 반환하고 있는데 이는 자바스크립트 첫 번째 버전의 버그.

하지만 기존 코드에 영향을 줄 수 있어 아직까지 수정되지 못하고 있다고 한다.

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

'학습일지 > 모던 자바스크립트 Deep Dive' 카테고리의 다른 글

원시 값과 객체의 비교  (0) 2022.07.05
객체 리터럴  (0) 2022.06.29
타입 변환과 단축 평가  (0) 2022.06.16
데이터 타입과 연산자  (0) 2022.06.16
모던 자바스크립트 공부 시작  (0) 2022.06.16