모던자바스크립트 Deep Dive - 7장 연산자

연산자

✔️ 값으로 평가된 피연산자를 연산해 새로운 값을 만든다

 

▪️ 산술 연산자 (arithmetic operator)

- 피연산자를 대상으로 수학적 계산을 수행해 새로운 숫자값을 반환

- 산술연산 불가시 NaN (Not a Number) 반환

▫️ 이항 산술 연산자 ⇨ +, -, *, /, %

- 2개의 피연산자를 산술 연산해 숫자 값을 만듦 -> 부수효과 없음

▫️ 단항 산술 연산자 ⇨ ++, --, +, -

- 1개의 피연산자를 산술 연산해 숫자 값을 만듦 -> 부수효과 있기도 하고(++, --) 없기도 함(+, -)

❗️ 증가/감소(++/--) 연산자는 피연산자의 값을 변경하는 암묵적 할당이 이뤄진다.

- ++/--가 피연산자의 앞에 위치할 경우 선증가/선감소 후할당 (++n, --n)

- ++/--가 피연산자의 뒤에 위치할 경우 선할당 후증가/후감소 (n++, n--)

let foo=3, x;

x=foo++ // 선할당 후증가
console.log(foo, x) // 4 3

x=++foo // 선증가 후할당
console.log(foo, x) // 5 5

x=--foo // 선감소 후할당
console.log(foo, x) // 4 4

x=foo-- // 선할당 후감소
console.log(foo, x) // 3 4

▪️ 할당 연산자 (assignment operator) ⇨ =, +=, -=, *=, /=, %=, **= 등

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

- 할당문도 값으로 평가되는 표현식인 문! -> 여러 변수에 동일한 값 연쇄할당 가능

 

▪️ 비교 연산자 (comparison operator) ⇨ ==, !=, ===, !==

- 부수효과 없음

- 동등비교(==, !=) : 값 비교 O / 타입 비교 X ❗️암묵적 타입변환으로 이해하기 어려운 안티패턴이 종종 존재 => 일치비교연산자를 사용하자!

- 일치비교(===, !==) : 값 비교 O / 타입 비교 O 

🔸 단 NaN은 유일하게 자기 자신과 일치하지 않는 값임 → 이를 비교시 Number.isNaN()함수 / Object.is()함수를 사용해야 함

 

▪️ 대소 관계 비교 연산자 ⇨ >, <, >=, <=

- 부수효과 없음

 

▪️ 삼항 조건 연산자(ternary operator)

condition ? value if the statement is true : value if the statement is false

- 조건식의 평가 결과에 따라 반환할 값 결정 -> 부수효과 없음

- if-else문과 유사하지만 차이점 존재

✅ 삼항 조건 연산자 표현식은 값처럼 사용할 수 있으나 if-else문은 불가능함

❗️조건이 여러개인 경우는 If-else문이 가독성이 더 좋다

let score = 80;
let result = score >= 80?'pass':'fail';
console.log(result) // 'pass'

// score가 90점 이상이면 'A', 80점 이상이면 'B' 70점 이상이면 'C' 60점 이상이면 'D' 이외는 'F'
// if-else문
let score = 68;
if(score>=90){
    result='A'
} else if(score>=80){
    result='B'
} else if(score>=70){
    result='C'
} else if(score>=60){
    result='D'
} else {
    result='F'
}
console.log(result) // 'D'

// ternary operator
let score = 68;
let result = score>=90?'A':(score>=80?'B':(score>=70?'C':(score>=60?'D':'F')))
console.log(result) // 'D'

 

▪️ 논리 연산자 (logical operator) ⇨ ||(OR), &&(AND), !(NOT)

- 부수효과 없음

- 논리 부정(!) 연산자는 무조건 Boolean값 반환 → 피연산자가 Boolean값이 아니어도 암묵적 타입변환

- 논리합(||)과 논리곱(&&)의 평가결과를 Boolean이 아닐 수도 있음 → 어느 한쪽으로 평가됨

- De morgan's law

(1>3)||(1<5) // true
(1>3)&&(1<5) // false

!'0' // false
!0 // true

// 단축평가 - 9장
'Cat'&&'Dog' // 'Dog' 
'Cat'||'Dog' // 'Cat'

▪️ 쉼표 연산자 ⇨ ,

- 왼쪽부터 차례대로 평가 후 마지막 피연산자의 평가 결과 반환

 

▪️ 그룹 연산자 ⇨ ()

- 우선순위 제일 높음

 

▪️ typeof 연산자 ⇨ typeof

- 데이터타입을 문자열로 반환 (7가지 → string, number, boolean, object, function, symbol, undefined)

- typeof null → object (❗️bug❗️) 따라서 null의 type은 typeof가 아닌 일치비교연산자(===, !==)로 확인

- 선언하지 않은 식별자는 ReferenceError가 아닌 undefined가 뜸

typeof '1' // string
typeof true // boolean
typeof {} // object
typeof null // object

let a;
typeof a // undefiend => ReferenceError 발생하지 않음!

▪️ 지수 연산자 ⇨ **

- Math.pow() 메서드와 동일

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

2**2 // 4
Math.pow(2,2) //4

2*2**4 // 256(x) 32(o)