3. 자바스크립트 데이터 타입과 연산자 #7 연산자

본 글은 인사이드 자바스크립트 도서의 내용을 복습하기 위해서 작성된 글입니다.

3.7 연산자

자바스크립트 연산자의 대부분은 다른 언어와 유사하다. 자바스크립트에서 주의해야 할 연산자는 대표적으로 아래와 같다.

1. + 연산자
2. typeof 연산자
3. ==(동등) 연산자, ===(일치) 연산자
4. !! 연산자

 

3.7.1 + 연산자

+ 연산자는 더하기 연산과 문자열 연결 연산을 수행한다. 아래 예제와 같이 두 연산자가 모두 숫자일 경우에만 더하기 연산이 수행되고 나머지는 문자열 연결 연산이 이루어진다.

let add1 = 1+2;
let add2 = "my" + "string";
let add3 = 1 + "string";
let add4 = "string" + 2;

console.log(add1);  // 3
console.log(add2);  // mystring
console.log(add3);  // 1string
console.log(add4);  // string2

3.7.2 typeof 연산자

typeof 연산자는 피연산자의 타입을 문자열 형태로 리턴한다. 여기서 null과 배열이 'object'라는 점, 함수는 'function'이라는 점에 유의해야 한다.

 

각 타입별 typeof 연산자 결과

기본 타입	숫자	'number'
기본 타입	문자열	'string'
기본 타입	불린값	'boolean'
기본 타입	null	'object'
기본 타입	undefined	'undefined'
참조 타입	객체	'object'
참조 타입	배열	'object'
참조 타입	함수	'function'

 

3.7.3 ==(동등) 연산자와 ===(일치) 연산자

자바스크립트에서는 두 값이 동일한지를 확인하는 데, 두 연산자를 모두 사용할 수 있다.

• ==(동등) 연산자 : 비교하려는 피연산자의 타입이 다를 경우에 타입 변환을 거친 다음 비교
• ===(일치) 연산자 : 피연산자의 타입이 다를 경우에 타입을 변경하지 않고 비교한다.

==(동등) 연산자와 ===(일치) 연산자의 차이점

console.log(1=='1');    // true
console.log(1==='1');   // false

==(동등) 연산자의 경우는 두 피 연산자의 타입이 다르므로 숫자를 문자열로 변환하여 비교한다. 따라서 두 값이 같다고 판단해서 true가 반환된다.

 

반면 ===(일치) 연산자는 두 피연산자가 타입이 다르므로 그대로 false가 출력된다. 자바스크립트 코딩 가이드에서는 ===(동등) 연산자를 사용하는 것을 권한다.

 

3.7.4 !! 연산자

!! 연산자의 역할은 피연산자를 불린값으로 변환하는 것이다.

 

!! 연산자 활용을 통한 불린 값 변환

console.log(!!0);           // false
console.log(!!1);           // true
console.log(!!"string");    // true
console.log(!!'');          // false
console.log(!!true);        // true
console.log(!!false);       // false
console.log(!!null);        // false
console.log(!!undefined);   // false
console.log(!!{});          // true, 객체가 빈 객체라도 true
console.log(!![1,2,3]);     // true

 

References

인사이드 자바스크립트, 송형주 저