[Deep dive] 7장 연산자

7.1 산술 연산자 (arithmetic operator)

 

- 산술 연산이 불가능한 경우 NaN 반환

 

7.1.1 이항 산술 연산자 

 

- 2개의 피연산자를 산술 연산하여 숫자 값을 만듬

- 모든 이항 산술 연산자는 피연산자의 값을 변경하는 부수 효과 (side effect)가 없다.

- +,-,*,/,%

 

7.1.2 단항 산술 연산자 

 

- 1개의 피연산자를 산술 연산하여 숫자 값을 만듬

단항 산술 연산자	의미	부수효과
++	증가	o
--	감소	o
+	피연산자를 숫자 타입으로 변환	x
-	양수를 음수로, 음수를 양수로 반전	x

- 증가/감소 연산자 

 

 - 전위 증감

 : 먼저 피연산자의 값을 증가/감소시킨 후, 다른 연산을 실행

 - 후위 증감

 : 먼저 다른 연산을 수행한 후, 피연산자의 값을 증가/감소 

 

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"

//불리언 값을 숫자로 타입변환
x = true;
console.log(x); //1
//부수효과는 없음
console.log(x); //true

//문자열을 숫자로 타입 변환할 수 없으므로 NaN을 반환
x = 'Hello';
console.log(+x); //NaN
//부수효과는 없음
console.log(x); //"Hello"

- - 단항 연산자 

 - 피연산자의 부호를 반전한 값을 반환 

 - 숫자 타입이 아닌 피연산자에 사용하면 피연산자를 숫자 타입으로 변환하여 반환

 

7.1.3 문자열 연결 연산자 

 

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

- 그 외의 경우는 산술연산자로 동작

//문자열 연결 연산자 
'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

 

7.2 할당 연산자 (assginement operator)

 

- 우항에 있는 피연산자의 평과 결과를 좌항에 있는 변수에 할당

- 좌항의 변수에 값을 할당하므로 변수 값이 변화는 부수 효과가 있음

 

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

 -> 여러 변수에 동일한 값을 연쇄할당 가능 

var a,b,c; 

//연쇄할당. 오른쪽에서 왼쪽으로 진행
//c=0 : 0으로 평가 
//b=0 : 0으로 평가 
//c=0 : 0으로 평가 
a=b=c=0;

console.log(a,b,c); //0 0 0

7.3 비교 연산자 (comparsion operator)

 

- 좌항과 우항의 피연산자를 비교한 다음 그 결과를 불리언 값으로 반환

 

7.3.1 동등/일치 연산자 

 

- 동등 비교 : 느슨한 비교 

- 일치 비교 : 엄격한 비교 

비교 연산자	의미	사례	설명	부수효과
==	동등 비교	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

 

-일치 비교 연산자 (===)는 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에 한하여 true 반환

//일치 비교 
5 === 5; //true

//암묵적 타입 변환을 하지 않고 값을 비교 
//값과 타입이 모두 같은 경우면 true 반환
5 === '5'; //false

- NaN은 자신과 일치하지 않는 유일한 값

- 숫자가 NaN인지 조사하려면 빌트인 함수 Number.isNaN함수 사용

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

- 자바스크립트에는 양의 0, 음의 0이 있는데, 이들을 비교하면 true 반환

0 === -0; //true
0 == -0; //true

 

7.3.2 대소 관계 비교 연산자 

 

- 피연산자의 크기를 비교하여 불리언 값으로 반환

- >,<,>=,<=

 

 

7.4 삼항 조건 연산자 (ternnary operator)

 

- 조건식의 평가 결과에 따라 반환할 값을 결정

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

- 조건식의 평가 결과가 불리언 값이 아니면 불리언 값으로 암묵적 타입 변환

var x = 2;

//2%2는 0이고 0은 false로 암묵적 타입 변환
var result = x%2 ? '홀수' : '짝수';

console.log(result); //짝수

- 삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식 문임

 

 

7.5 논리 연산자(logical operator)

 

- 우항과 좌항의 피연산자(부정 논리 연산자의 경우 우항의 피연산자)논리 연산

논리 연산자	의미	부수 효과
||	논리합(OR)	X
&&	논리곱(AND)	X
|	부정(NOT)	X

- 논리 부정(!) 연산자는 항상 불리언 값을 반환 

- 피연산자가 불리언값이 아니면 불리언 타입으로 암묵적 타입 변환

//암묵적 타입 변환
!0; //true
!'Hello'; // false

- 논리합(||) 또는 논리합(&&) 연산자 표현식의 평가 결과는 불리언 값이 아닐 수 있음

- 언제나 2개의 피연산자 중 한쪽으로 평가됨

//단축 평가 
'Cat' %% 'Dog'; //'Dog'

 

7.6 쉼표 연산자

 

- 왼쪽 피연산자부터 차례대로 피연산자를 평가하고 마지막 피연산자의 평가가 끝나면

 마지막 피연산자의 평가결과를 반환

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

 

7.7 그룹 연산자 

 

- 소괄호()로 피연산자를 감싸 연산자의 우선순위 조절 가능

 

 

7.8 typeof 연산자 

 

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

- "string",  "number", "boolean", " undefined", " symbol", "object", " function" 중 하나를 반환

- null은 "object"로 반환

 

- 값이 null 타입인지 확인할 때는 일치 연산자(===) 사용

var foo = null;

typeof foo === null; //false
foo === null; //true

 

7.9 지수 연산자 

 

- 좌항의 피연산자를 밑(base)으로, 우항의 피연산자를 지수(exeponent)로 거듭제곱하여  숫자 값을 반환

2 ** 2; //4
2 ** 0; //1
2 ** -2; //0.25

- 이항 연산자 중에서 우선순위가 가장 높음

- 지수 연산자의 결합 순서는 우항에서 좌항 (우결합성)

2**(3**2); //512

 

7.10 그외의 연산자 

 

연산자	개요
?.	옵셔널 체이닝 연산자
??	null 병합 연산자
delete	프로퍼티 삭제
new	생성자 함수를 호출할 때 사용하여 인스턴스를 생성
instanceof	좌변의 객체가 우변의 생성자 함수와 연결된 인스턴스인지 판별
in	프로퍼티 존재 확인

 

7.11 연산자의 부수 효과 

 

- 부수효과가 있는 연산자 

 1) 할당 연산자(=)

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

 3) delete 연산자 

 

var x;

//할당 연산자 
x=1;
console.log(x); //1

//증감 연산자
// 피연산자 x의 값이 재할당되어 변경
x++;
console.log(x); //2

var o = {a:1}; 

//delete 연산자 
//o객체를 사용하는 다른 코드에 영향을 줌
delete o.a;
console.log(o); // {}