[자바스크립트 딥다이브] 07. 연산자

07장 연산자

산술 연산자

피연산자를 대상으로 수학적 계산 수행해 새로운 숫자 값을 만듬.

 

이항 산술 연산자

• +(덧셈)
• -(뺄셈)
• *(곱셈)
• /(나눗셈)
• %(나머지)

 

단항 산술 연산자

• ++(증가)
• --(감소)
• + (<- 아무 효과 없음)
• -(부호 반전)

 

증가/감소(++/--) 연산자는 피연산자의 값을 변경하는 부수효과가 있음.

• 증가/감소 연산자가 피연산자의 앞에 있을 경우
  => 먼저 피연산자의 값을 증가/감소 시킨 후 나머지 연산
• 증가/감소 연산자가 피연산자의 뒤에 있을 경우
  => 먼저 연산을 수행한 후 피연산자의 값을 증가/감소

var x = 5, result;

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

// 선 증가 후 할당
result = ++x; // result(7), x(7)
console.log(result, x); // 7 7 

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

// 선 감소 후 할당
result = --x; // result(5) x(5)
console.log(result, x); // 5 5

 

+와 -를 숫자 타입이 아닌 피연산자에 사용할경우 해당 연산자를 숫자 타입으로 변환하여 반환함. (피연산자 변경X, 숫자 타입으로 변환한 값을 생성해서 반환)

var y = '1';

console.log(+y); // 문자열을 숫자로 타입 변환
console.log(y); // '1'. 부수효과X

-(-10); // 10. 부호 반전

-'10'; // -10. 문자열을 숫자로 타입변환

-true; // -1. 불리언값을 숫자로 타입변환

-'hello'; // NaN. 문자열은 숫자로 타입변환 X

 

문자열 연결 연산자

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

// 문자열 연결
'10' + 1 = '101'

// 산술연산자
10 + 1 = 11

// true는 1로 변환
10 + true = 11

// false는 0으로 변환
10 + false = 10

// null은 0으로 변환
10 + null = 10

// undefined는 숫자로 타입변환 X
10 + undefined = NaN

암묵적 타입변환, 또는 타입 강제 변환
: 개발자의 의도와 상관없이 자바스크립트 엔진에 의해 암묵적으로 타입이 자동 변환되는 것

 

할당 연산자

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

할당연산자예시동일표현

=	a = 5	a = 5
+=	a += 5	a = a + 5
-=	a -= 5	a = a - 5
*=	a *= 5	a = a * 5
/=	a /= 5	a = a / 5
%=	a %= 5	a = a % 5

할당문은 값으로 평가되는 표현식인 문으로서 할당된 값으로 평가됨.

 

비교 연산자

좌항과 우항의 피연산자를 비교, 그 결과를 불리언 값으로 반환.

 

동등/일치 비교 연산자

좌항과 우항의 피연산자가 같은값으로 평가되는지 비교해 결과를 불리언 값으로 반환.
차이점은 비교하는 엄격성의 정도.

동등/부동등 비교 연산자(==/!=)는 좌항과 우항의 값이 같다면 true를 반환하지만,
일치/불일치 비교 연산자(===/!==)는 좌항과 우항의 값과 타입이 모두 같아야만 true를 반환한다.

동등비교 연산자는 결과 예측이 어려움으로 일치 비교 연산자를 사용한다.

// 동등비교
5 == 5 // true
5 == '5' // true. 암묵적 타입변환을 통해 타입을 일치시키면 동등함

// 일치비교
5 === 5 // true
5 === '5' // false. 숫자와 문자열임으로 타입이 다르다 

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

숫자가 NaN인지 알아보려면 => Number.isNan 내장함수 사용

Number.isNaN(NaN); // true
Number.isNaN(100); // false
Number.isNaN(100 + undefined); // true

 

대소 관계 비교 연산자

피연산자의 크기를 비교해 불리언 값을 반환.

>, <, >=, <=

 

삼항 조건 연산자

조건식의 평가 결과에 따라 반환할 값을 결정. 값으로 평가할 수 있는 표현식인 문.

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

 

논리 연산자

||(OR), &&(AND), !(NOT)

 

typeof 연산자

피연산자의 데이터 타입을 문자열로 반환.

typeof ''; // 문자열 -> string
typeof 100; // 숫자 -> number
typeof NaN; // NaN -> number
typeof true; // boolean
typeof undefined; // undefined
typeof Symbol(); // symbol
typeof null; // object
typeof []; // 배열 -> object
typeof {}; // 객체 -> object
typeof new Date(); // object
typeof function () {}; // 함수 ->  function

typeof로 null을 연산했을때 object를 반환하므로 값이 null인지를 판단할때는 일치 연산자(===)를 사용한다.

 

지수 연산자

ES7에서 도입.
좌항의 피연산자를 밑으로, 우항의 피연산자를 지수로하여 거듭제곱한 숫자값을 반환.
이전에는 Math.pow 메서드를 사용함.
이항연산자중 우선순위가 가장 높음.

console.log(2**3); // 8
console.log(3**1.5); // 5.196152422706632
console.log(4**0); // 1
console.log(5**-2); // 0.04