모던 자바스크립트 Deep Dive - 제 07장

<모던 자바스크립트 Deep Dive - 제 07장>

2023. 02. 08

07장. 연산자

 

---

 

7.1 산술 연산자)

산술 연산자는 피연산자의 개수에 따라 이항 산술 연산자와 단항 산술 연산자로 구분할 수 있다. 

7.1.1 이항 산술 연산자

2개의 피연산자를 산술 연산함, 피연산자 값을 변경하는 부수효과가 없음.

즉, 피연산자의 값이 바뀌는게 아니고 새로운 값을 만드는거임

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

 

7.1.2 단항 산술 연산자

1개의 피연산자를 산술 연산함

연산자	의미	부수 효과
++	증가	O
--	감소	O
+	아무런 효과X	X
-	양수를 음수로, 음수를 양수로 반전한 값 반환	X

증가 ++ , 감소 -- 연산자는 피연산자의 값을 변경하는 부수 효과가 있음!

이런 증가, 감소 연산자는 그 연산자의 위치에 의미가 있다. 

피연산자 앞에 위치하면?    먼저 피연산자 값을 증가/감소 시킨 후, 다른 연산을 수행

피연산자 뒤에 위치하면?    먼저 다른 연산을 수행한 후, 피연산자 값을 증가/감소

 

ex)

let x = 5;

let result;

result = x++;       (먼저 할당한 후에 증가)           => result는 5고, x는 증가한 6임

result = ++x;       (먼저 증가한 후에 할당)           => 먼저 증가해서 x는6, 후에 할당하므로 result도 6임

 

7.1.3 문자열 연결 연산자

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

'1' + 2   의 경우에는 피연산자 중 '1'이 문자열이기 때문에 '12'가 됨.

1 + true    의 경우에는 불리언 true를 1로 타입 변환함!

이처럼 불리언 타입인 true를 암묵적으로 숫자 타입으로 변환하는데,

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

 

---

 

7.2 할당 연산자)

할당 연산자는 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다. 

 

할당 연산자	예	동일표현	부수 효과
=	x = 5	x = 5	O
+=	x += 5	x = x + 5	O
-=	x -= 5	x = x - 5	O
*=	x *= 5	x = x * 5	O
/=	x /= 5	x = x / 5	O
%=	x %= 5	x = x % 5	O

 

---

7.3 비교 연산자)

==	x와 y의 값이 같음
===	x와 y의 값, 타입이 같음
!=	x와 y의 값이 다름
!==	x와 y의 값, 타입이 다름

'==' 동등비교 연산자는 좌항과 우항의 피연산자를 비교할 때

암묵적 타입 변환을 통해 타입을 일치시킨 후 같은지 비교한다. 

ex)  5 == '5'         => 서로 타입은 타르지만 타입 변화를 통해 true 값을 반환한다.

따라서 이런 ==(동등비교) 연산자는 예측하기 어려운 결과를 만들어낼 수 있다.

대신 '===' 일치비교 연산자를 사용하는게 좋다. 

 

=== 연산자는 좌항과 우항의 피연산자가 타입도 같고, 값도 같은 경우에만 true값을 반환한다.

이 연산자에서 유일하게 자신과 일치하지 않는 값은 NaN이다.

NaN === NaN;    은 false값을 반환한다. 

 

대소 관계 비교 연산자는 따로 정리X

---

7.4 삼항 조건 연산자)

삼항 조건 연산자의 표현식은 다음과 같다

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

 

ex)  

const x = 10;

const result = x%2 ? '홀수' : '짝수';

console.log(result);

위의 예제에서 10인 x값을 2로 나눈 나머지는 0이기때문에 

false에 해당하므로 '짝수'값을 출력한다.

---

7.5  논리 연산자)

||	or
&&	and
!	not(부정)

---

7.8  typeof 연산자)

typeof 연산자는 피연산자의 데이터 타입을 반환한다.

string, number, boolean, undefined, symbol, object, function 중 하나를 반환하는데

null을 반환하는 경우는 없고 null 타입 확인하려면 typeof 대신 === 연산자를 사용한다.

 

 

---

https://link.coupang.com/a/F6ksK

모던 자바스크립트 Deep Dive:자바스크립트의 기본 개념과 동작 원리

"이 포스팅은 쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받습니다."