연산자란?

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

//산술연산자5 * 4// 20//문자열 연결 연산자'My name is' + 'himchan'

//할당연산자
color = 'red'// red//비교연산자3 > 5// false//논리연산자true && false// false//타입 연산자
tyoeof 'Hi'// string

증가(++) / 감소(--) 연산자

증가/감소(++/—) 연산자는 위치에 의미가 있다.

피연산자 앞에 위치한 전위 증가/감소 연산자는 먼저 피연산자의 값을 증가/감소시킨 후, 다른 연산을 수행한다.

피연산자 뒤에 위치한 후위 증가/감소 연산자는 먼저 다른 연산을 수행한 후, 피연산자의 값을 증가/감소 시킨다.

var x = 5, result;

//선할당후 증가
result = x++;
console.log(result, x);// 5, 6//선증가 후할당
result = ++x;
console.log(result, x)// 7 7//선할당 후감소
result = x--;
console.log(result, x)// 7 6//선감소 후할당
result = --x;
console.log(result,x)// 5 5

숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환하여 반환한다.

var x = 5, result;

//선할당후 증가
result = x++;
console.log(result, x);// 5, 6//선증가 후할당
result = ++x;
console.log(result, x)// 7 7//선할당 후감소
result = x--;
console.log(result, x)// 7 6//선감소 후할당
result = --x;
console.log(result,x)// 5 5

숫자 타입이 아닌 피연산자에 + 단항 연산자를 사용하면 피연산자를 숫자 타입으로 변환하여 반환한다. 이때 피연산자를 변경하는 것은 아니고 숫자 타입으로 변환한 값을 생성해서 반환한다.

var x = '1';

//문자열을 숫자로 타입 변환한다.console.log(+x);//1//부수효과는 없다.console.log(x);// '1'//불리언 값을 숫자로 타입 변환한다.var x = true;

console.log(+x);// 1console.log(x);// true//불리언 값을 숫자로 타입 변환한다.var x = false;

console.log(+x);// 0console.log(x);// false// 문자열을 숫자 타입 변환할 수 없으므로 NaN을 반환한다.
x = 'Hello';

console.log(+x);// NaNconsole.log(x);// 'Hello'

문자열 연결 연산자

+연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.

// 문자열 연결 연산자'1' + 2 ;// '12'1 + '2';// '12'// 산술 연산자 true는 1로 타입변환 한다.1 + true// 2// false는 0으로 타입 변환한다.1 + false;// 1// null은 0으로 타입 변환한다.1+ null;// 1//undefined는 숫자로 타입 변환되지 않는다.
+undefined// NaN1 + undefined// NaN

위 코드에서 주목할 것은 개발자의 의도와는 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되기도 한다.

ex) 1 + true // 2

이를 암묵적 타입 변환(implicit coercion) 또는 타입 강제 변환(type coercion)이라고 한다.

비교 연산자

동등 비교(==) : 값이 동등한지 비교

일치 비교(===) : 값과 타입이 일치한지 비교

// 동등 비교는 결과를 예측하기 어렵다// * 안티패턴 : 결과를 예측하기 어려워 지양하는 패턴'0' == '';//false0 == '; // true
0 == '0' // true

false == 'false'; // false
false == '0'; //true
false == null; //false
false == undefined; // false

// 양의 0과 음의 0의 비교, 일치 비교/동등 비 모두 결과는 true다.

0 === -0; // true

0 === -0 // true

NaN

NaN === NaN;// false 자기 자신과 일치하지 않는 유일한 값이다.isNaN(NaN);// trueisNaN(10);// falseisNaN(1 + undefined);// true

Object.is 메서드

앞에서 살펴본 바와 같이 동등 비교 연산자(==), 일치 비교 연산자(===)는 +0과 -0을 동일하다고 평가한다. 또한 동일한 값인 NaN과 NaN을 비교하면 다른 값이라고 평가한다.

Es6에서 도입된 Object.is 메서드는 다음과 같이 에측 가능한 정확한 비교 결과를 반환한다. 그 외에는 일치 비교 연산자(===)와 동일하고 동작한다.

-0 === +0;// trueObject.is(-0, +0);// falseNaN == NaN;// falseObject.is(NaN, NaN);// true

삼항 조건 연산자

조건식 ? 조건식이 true일 떄 반환할 값 : 조건식이 false일 때 반환할 값

var x = 2, result;

// 2 % 2는 0이고 false로 암묵적 타입 변환된다.if ( x % 2) result = '홀수';
else result = '짝수';

console.log(result);// 짝수

삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식인 문이다.

var x = 10;

var result = x % 2 ? '홀수' : '짝수';
console.log(result);// 짝수

논리 연산자

|| : 논리합(or)

&& : 논리곱(AND)

! : 부정(NOT)

false || true;// truetrue || false;//  truetrue &&  false;// falsefalse && true;// false

!true;// false
!false// true

!0;// true
!'Hello'; /false

typeof 연산자

typeof 연산자는 피연산자의 데이터 타입을 문자열로 반환한다. typeof 연산자는 7가지 문자열 'string', 'number', boolean', undefined', 'symbol', 'object', 'function' 중 하나를 반환한다. 'null'을 반환하는 경우는 없다.

• **주의 ***

선언하지 않은 식별자를 typeof 연산자로 연산해보면 ReferenceError가 발생하지 않고 undefined를 반환한다.

지수연산자

2 ** 2// 4Math.pow(2, 2);// 4//음수를 거듭제곱의 밑으로 사용해 계산하려면 다음과 같이 괄호로 묶어야 한다.

-5 ** 2;
//SyntaxError

(-5) ** 2;//25// 지수 연산자는 이항 연산자 중에서 우선 순위가 가장 높다2 * 5 ** 2;//50