[모던 자바스크립트] 7장 연산자

* 본 블로그 글은 모던 자바스크립트를 읽으며 진행했음을 밝힙니다.

* 개인적인 공부 기록용이, 상업적으로 사용하지 않으며 문제가 있을 시 즉시 글을 내리도록 하겠습니다.

 

7장 연산자

 

1. 연산자란?

하나 이상의 표현식을 대상으로 어떠한 연산을 수행하여 하나의 값을 만드는 것을 말한다.

🧇 쉽게 말해 + - * / 등 을 말한다.

 

2. 연산자 종류

🥞 산술 연산자

🧈 수학적 계산을 수행해주는 연산자이다.

🧈 산술 연산이 불가능하면 NaN을 반환한다.

산술 연산자	의미
+	덧셈
-	뺄셈
*	곱셈
/	나눗셈(몫)
%	나눗셈(나머지)
++	증가 연산자
--	감소 연산자

🧈 증가/감소 연산자는 위치에 따라 다른 결과를 보여주니 조심하자.

var x = 5;
var 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 str = '1';	// 문자열

// string => number
console.log(+str);	// 1
console.log(str);	// '1'

// boolean => number
var boolT = true;
console.log(+bool);	// 1
console.log(bool);	// true

// boolean => number
var boolF = false;
console.log(+bool);	// 0
console.log(bool);	// false

// NaN
var word = 'Hello';
console.log(+word);	// NaN
console.log(word);	// 'Hello'

🧈  문자열도 이렇게 이어진다.

'1' + 2 	// '12'
1 + '2' 	// '12'

1 + 2 		// 3
1 + true	// 2

1 + false	// 1

1 + null	// 1

+undefined	// NaN
1 + undefined	// NaN

 

🥞 할당 연산자

🧈 혼동하면 안된다. 오른쪽에 있는 친구가 왼쪽으로 간다.

 

🥞 비교 연산자

🧈 양쪽을 비교한다.

비교 연산자	의미	예시	설명
==	동등 비교	x == y	x와 y 가 값이  같음
===	일치 비교	x === y	x와 y의 값과 타입까지 같음
!=	불동등 비교	x != y	x와 y가 값이 다름
!==	불일치 비교	x !== y	x와 y의 값과 타입이 다름

🧈 보통 === / !== 를 사용한다.

🧈 그래야 엄격하게 검사할 수 있다.

대소 비교 연산자	예시	설명
>	x > y	x가 y 보다 크다.
<	x < y	x가 y보다 작다.
>=	x >= y	x가 y보다 크거나 같다.
=<	x =< y	x가 y보다 작거나 같다

 

🥞 삼항 연산자

🧈 이건 그냥 외우면 된다. 

var A = 20;
var B = 40;

var result = A > B ? 'A가 크다' : 'B가 크다';

🧈 조건식 ? 결과가 true일 경우 : 결과가 false인 경우

 

🥞 논리 연산자

🧈 좀 헷갈릴 수도 있다.

🧈 이 친구도 그냥 외우면 쓸 곳이 많다.

논리 연산자	의미
||	OR
&&	AND
!	부정

🧈 OR는 || 기준 어느 한 쪽이 참이면 참이다.

🧈 AND는 둘다 참이어야 참이다.

🧈 !true면 false를 !false면 true를 반환한다.

 

🥞 쉼표 연산자

쉼표로 변수를 나열한다.

🧈 사실 써본 적 없다.

 

🥞 그룹 연산자

소괄호를 통해 묶어서 연산을 선 수행한다.

 

🥞 typeof 연산자

타입이 궁금하면 사용한다.

var str = 'string'

console.log(typeof str) // string

 

🥞 지수 연산자

ES7에서 도입되었다.

** 를 기준으로 좌측은 밑, 우측은 지수로 거듭 제곱을 수행한다.

 

🥞 기타

연산자	이름
?.	옵셔널 체이닝 연산자
??	null 병합 연산자
delete	프로퍼티 삭제
new	생성자 함수 호출 + 인스턴스 생성
instanceof	좌측의 객체가 우측의 생성자 함수와 연결된 인스턴스 인지 판별
in	프로퍼티 존재 확인

🧈 이외에도 우선순위 등,, 있지만 이건 체득하자!

🧈 사실 연산자도 이런 것들이 있구나 정도만 알아두고, 실제로 사용하면서 익히자!

 

끝!