1. 개요
- 하나 이상의 표현식을 대상으로 산술,할당,비교,논리,타입,지수 연산 등을 수행해 하나의 값을 만듬
- 피연산자도 표현식이고 연산자 표현식(피연산자 + 연산자)도 표현식
2. 산술 연산자
2.1 단항 산술 연산자
**증가/감소(++/--)연산자는 피연산자의 값을 변경하는 부수효과가 있음(암묵적 할당)
var x = 1;
x++; // x = x+1
console.log(x);//2
**증가/감소 연산자는 위치에 따라 의미가 달라짐
var x = 5, result;
x++ ; 선할당 후증가
result = x++;
console.log(result,x); // 5 6
++x ; 선증가 후할당
result = ++x;
console.log(result,x); // 7 72.2 문자열 연결 연산자
- 숫자 타입이 아닌 피연산자에 +/- 단항연산자를 사용하면 숫자 타입으로 변환한 값을 생성해서 반환
(피연산자를 변경하는 것은 아님)
문자열 타입변환
var x = "1" // string
+x // 1 number
x= "1"
불리언값 타입변환
x = true;
+x // 1 number
x= true
긴 문자열 타입 변환
x = 'hello'; // string
+x // NaN
x= 'hello'- 문자열 연결 연산자
- 연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작
//문자열 연결 연산자
'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;3. 할당 연산자
우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당
좌항의 변수에 값을 할당하므로 변수 값이 변하는 부수 효과가 있음
var x;
x = 10;
console.log(x); // 10
x += 5; // x = x + 5;
console.log(x); // 15
x -= 5; // x = x - 5;
console.log(x); // 10
x *= 5; // x = x * 5;
console.log(x); // 50
x /= 5; // x = x / 5;
console.log(x); // 10
x %= 5; // x = x % 5;
console.log(x); // 0
var str = 'My name is ';
// 문자열 연결 연산자
str += 'Lee'; // str = str + 'Lee';
console.log(str); // 'My name is Lee'
//연쇄할당도 가능
var a, b, c;
// 연쇄 할당. 오른쪽에서 왼쪽으로 진행.
// c = 0 : 0으로 평가된다.
// b = 0 : 0으로 평가된다.
// a = 0 : 0으로 평가된다.
a = b = c = 0;
console.log(a, b, c); // 0 0 0
4. 비교 연산자
- 동등 비교 연산자 (==)
암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교
// 동등 비교
5 == 5; // true
// 타입은 다르지만 암묵적 타입 변환을 통해 타입을 일치시키면 동등하다.
5 == '5'; // true
***주의점
//동등 비교 연산자의 문제점 : 비교 , 결과를 예측하기 어렵다.
'0'==''; //false
0==''; // true
...등 안티패턴- 일치 비교 연산자 (===)
좌항과 우항의 피연산자가 타입도 같고, 값도 같은 경우 true를 반환
// 일치 비교
5 === 5; // true
// 암묵적 타입 변환을 하지 않고 값을 비교
// 즉, 값과 타입이 모두 같은 경우만 true를 반환
5 === '5'; // false
***주의점
// NaN은 자신과 일치하지 않는 유일한 값
NaN === NaN; // false
// isNaN함수: 지정한 값이 NaN인지 확인하고 그 결과를 불리언 값으로 반환
isNaN(NaN); // true
isNaN(10); // false
isNaN(1+undefined); // true
//양의 0과 음의 0의 비교, 일치 비교/동등 비교 모두 true
0 ==== -0; // true
0 == -0; // true- Object.js 메서드 (동등/일치 비교 연산자의 대안, es6)
-0 === +0 // true
Object.is(-0,+0); //false
NaN === NaN; // false
Object.is(NaN,NaN); //true- 부동등 비교/ 불일치 비교
부동등 비교
5 != 8; // true
5 != 5; // false
5! = '5'; // false
불일치 비교
5 !== 8; // true
5 !== 5; // false
5 !== '5'; // true4.1 대소 관계 비교 연산자
, <, ≥, ≤ 피연산자의 크기를 비교하여 불리언값을 반환
5. 삼항 조건 연산자
- 조건식의 평가 결과에 따라 반환할 값을 결정. 부수효과는 없음
var x = 2;
// 조건식(표현식) ? 참이면 반환될 결과 : 거짓이면 반환될 결과
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 짝수- 삼항 조건 연산자 표현식은 값으로 평가할 수 있는 표현식(if...else문은 아님)
var x = 10;
var result = x % 2 ? '홀수' : '짝수';
console.log(result); // 짝수6. 논리연산자
우항과 좌항의 피연산자를 논리연산한다.
논리합(||) 연산자
true || false; // true
논리곱(&&) 연산자
false && true; // false
논리 부정(!)연산자는 (피연산자가 불리언 값이 아니면 불리언 타입으로 암묵적 타입변환을 해서라도)
언제나 불리언 값을 반환한다.
!0; // true
그러나, 논리합(||) 연산자과 논리곱(&&) 연산자의 평가 결과는 불리언 값이 아닐 수도 있다.
언제나 2개의 피연산자 중 어느 한쪽으로 평가된다.
'Cat' && 'Dog' ; // Dog
7. 쉼표 연산자
쉼표(,) 연산자는 왼쪽 피연산자부터 차례대로 피연산자를 평가하고
마지막 피연산자의 평가가 끝나면 마지막 피연산자의 평가 결과를 반환
var x, y, z;
x = 1, y = 2, z = 3; // 38. 그룹 연산자
소괄호로 피연산자를 감싸는 그룹 연산자는 자신의 피연사자인 표현식을 가장 먼저 평가.
그룹 연산자는 연산자 우선순위가 가장 높음.
10 * 2 + 3; // 23
// 그룹 연산자를 사용하여 우선순위를 조절
10 * (2 + 3); // 509. typeof 연산자
피연산자의 데이터 타입을 문자열로 반환.
이 때, 7가지 문자열("string","number","boolean","undefined","symbol","object","function"
중 하나를 반환. (7개의 데이터타입 중 null만 없음)
typeof 1 // "number"
typeof NaN // "number"
typeof true // "boolean"
**특이 케이스
typeof null// "object"
그래서 null인지 확인할 때는 일치 연산자(===) 사용
var foo = null;
typeof foo === null;// false
foo === null; //true10. 지수 연산자
우항의 피연산자를 지수로 거듭제곱하여 숫자 값을 반환
2**2; // 4
2 ** 0; // 1
//음수를 거듭제곱의 밑으로 사용할 때는 괄호로 묶어야 함.
(-5) ** 2 // 25
//할당 연산자와 함께 사용 가능
var num = 5;
num **= 2; // 2511. 연산자의 부수효과
- 다른 코드에 영향을 주는 부수효과가 있는 일부 연산자
- 할당 연산자(=)
- 증가/감소 연산자 (++/- -)
- delete 연산자
