▶ 연산자(Operator)
연산자는 하나 이상의 표현식을 대상으로 산술, 할당, 비교, 논리, 타입 연산 등을 수행해 하나의 값을 만든다. 이 때 연산의 대상을 피연산자(Operand)라고 한다.
- 피연산자도 평가되어 하나의 값이 되므로 표현식이고 피연산자를 연산자와 결합한 연산자 표현식도 물론 표현식이다.
- 연산자는 값으로 평가된 피연산자를 연산해 새로운 값을 만든다.
// 산술 연산자
5 * 4 // 20
// 문자열 연결 연산자
'My name is ' + 'sieun' // "My name is sieun"
// 할당 연산자
const color = 'red'; // "red"
// 비교 연산자
3 > 5 // false
// 논리 연산자
(5 > 3) && (2 < 4) // true
// 타입 연산자
typeof 'Hi' // "string"▶ 산술 연산자
산술 연산자는 피연산자의 개수에 따라 이항 산술 연산자(2개의 피연산자)와 단항 산술 연산자(1개의 피연산자)로 구분하며, 산술 연산이 불가능한 경우
NaN을 반환한다.
▷ 이항 산술 연산자
| 이항 산술 연산자 | 의미 |
|---|---|
| + | 덧셈 |
| - | 뺄셈 |
| * | 곱셈 |
| / | 나눗셈 |
| % | 나머지 |
const x = 3;
const y = 2;
console.log(x + y); // 5
console.log(x - y); // 1
console.log(x * y); // 6
console.log(x / y); // 1.5
console.log(x % y); // 1- 이항 덧셈 연산자는 문자열을 연결한다.
let apples = "2";
let oranges = "3";
console.log( apples + oranges ); // 23▷ 단항 산술 연산자
| 단항 산술 연산자 | 의미 |
|---|---|
| ++ | 증가 |
| -- | 감소 |
| + | 어떠한 효과도 없다. |
| - | 양수를 음수로, 음수를 양수로 반전한 값을 반환한다. |
- ++ / -- 연산자는 위치에 의미가 있다.
- 연산자가 피연산자 앞에 위치하면 먼저 피연산자 값을 증가/감소시킨 후 다른 연산을 수행한다.
- 연산자가 피연산자 뒤에 위치하면 먼저 다른 연산을 수행한 후, 피연산자의 값을 증가/감소시킨다.
let x = 3;
let value;
// 선대입 후증가
value = x++;
console.log(value, x); // 3 4
// 선증가 후대입
value = ++x;
console.log(value, x); // 5 5
// 선대입 후감소
value = x--;
console.log(value, x); // 5 4
// 선감소 후대입
value = --x;
console.log(value, x); // 3 3+10 // 10
-(-10); // 10
-"10"; // 숫자 -10 (문자열을 숫자로 타입 변환)
-true; // 숫자 -1 (불리언 값을 숫자로 타입 변환)
-"문자열" // NaN (문자열을 숫자로 타입 변환 할 수 없기 때문)const x = "10";
console.log(x); // 문자열 "10"
console.log(+x); // 숫자 10
const y = true;
console.log(y); // 불리언 true
console.log(+y); // 숫자 1
const z = "문자열";
console.log(z); // "문자열"
console.log(+z); // NaN (문자열을 숫자로 타입 변환 할 수 없기 때문)
▶ 문자열 연결 연산자
+연산자는 피연산자 중 하나 이상이 문자열인 경우 문자열 연결 연산자로 동작한다.
let a = 2;
console.log("1" + a); // 문자열 '12' 출력개발자의 의도와 상관 없이 암묵적으로 타입이 자동 변환 되기도 하는데 이를 암묵적 타입 변환이라고 한다.
▶ 할당 연산자
- 변수에 값을 대입할 때 사용하는 이항 연산자이며, 우항에 있는 피연산자의 평가 결과를 좌항에 있는 변수에 할당한다.
- 할당문은 하나의 값으로 평가되는 표현식인 문이다.
| 할당 연산자 | 사례 | 동일표현 |
|---|---|---|
| = | x=y | x=y |
| += | x+=y | x=x+y |
| -= | x-=y | x=x-y |
| *= | x*=y | x=x*y |
| /= | x/=y | x=x/y |
| %= | x%=y | x=x%y |
let x;
console.log((x = 5)); // 5
console.log((x += 5)); // 10
console.log((x -= 5)); // 5
console.log((x *= 5)); // 25
console.log((x /= 5)); // 5
console.log((x %= 5)); // 0console.log(0 == false); // true
console.log(0 === false); // false
console.log("" == false); // true
console.log("" === false); // false
console.log(null == undefined); // true
console.log(null === undefined); // false▶ 비교 연산자
좌항과 우항의 피연산자를 비교하여 불리언 값을 반환한다.
▷ 동등/일치 비교 연산자
| 비교 연산자 | 의미 | 사례 | 설명 |
|---|---|---|---|
| == | 동등 비교 | x == y | x와 y의 값이 같다 |
| === | 일치 비교 | x === y | x와 y의 값과 타입이 같다 |
| != | 부동등 비교 | x != y | x와 y의 값이 다르다 |
| !== | 뷸일치 비교 | x != =y | x와 y의 값과 타입이 다르다 |
//동등 비교
console.log(3 == "3"); // true
//일치 비교
console.log(3 === "3"); // false
//부동등 비교
console.log(3 != "3"); // false
// 불일치 비교
console.log(3 !== "3"); // true동등 비교 연산자는 먼저 암묵적 타입 변환을 통해 타입을 일치시킨 후 같은 값인지 비교한다.
따라서 좌항의 우항의 피연산자가 타입은 다르더라도 true를 반환할 수 있는 것이다.
console.log(10 == 10); // true
console.log(10 == "10"); // true동등 비교 연산자는 결과를 예측하기 어려움으로 일치 비교 연산자를 사용하는 것이 좋다.
일치 비교 연산자는 좌항과 우항의 피연산자가 타입도 같고 값도 같은 경우에만 true를 반환한다.
console.log(10 === 10); // true
console.log(10 === "10"); // falseNaN은 자신과 일치하지 않는 유일한 값이다.
console.log(NaN === NaN); // flase따라서 숫자가 NaN인지 조사하려면 함수 Number.isNaN을 사용한다.
console.log(Number.isNaN(NaN)); // true
console.log(Number.isNaN(10)); // flase
console.log(Number.isNaN(1 + undefined)); // true
▷ 대소 관계 비교 연산자
| 비교 연산자 | 사례 | 의미 |
|---|---|---|
| > | x>y | x가 y보다 크다 |
| < | x<y | x가 y보다 작다 |
| >= | x>=y | x가 y보다 같거나 크다 |
| <= | x<=y | x가 y보다 같거나 작다 |
console.log(2 > 3); // false
console.log(2 < 3); // true
console.log(2 >= 3); // false
console.log(2 <= 3); // true▶ 삼항 조건 연산자
조건식의 평가 결과에 따라 반환할 값을 결정한다.
조건식 ? 조건식이 true일 때 반환할 값 : 조건식이 flase일 때 반환할 값
const x = 2;
const resule = x === 3 ? "정답입니다" : "틀렸습니다";
console.log(resule); // "틀렸습니다"const x = 3;
const result = x > 1 ? "크다" : "작다";
console.log(result); // "크다"▶ 논리 연산자
주어진 논리식을 판단하여, 참(true)과 거짓(false)을 반환한다.
| 논리 연산자 | 의미 | 설명 |
|---|---|---|
| && | 논리합(OR) | 논리식이 모두 참이면 참을 반환(논리 AND 연산) |
| \\ | 논리곱(AND) | 논리식 중에서 하나라도 참이면 참을 반환(논리 OR 연산) |
| ! | 부정(NOT) | 논리식의 결과가 참이면 거짓을, 거짓이면 참을 반환(논리 NOT 연산) |
아래코드 && 연산자가 사용되었고, 논리식 중 하나가 false 이므로
돌아가출력
const age = 22;
const value = false;
if (age >= 22 && value) {
console.log("너는 술을 살 수 있어!");
} else {
console.log("돌아가");
}아래코드 || 연산자가 사용되었고, 논리식 중 하나라도 참이므로
너는 술을 살 수 있어!출력
const age = 22;
const value = false;
if (age >= 22 || value) {
console.log("너는 술을 살 수 있어!");
} else {
console.log("돌아가");
}원래대로라면
너는 술을 살 수 있어!가 출력되어야 하지만, 논리 부정 연산자의 사용으로돌아가출력
const age = 22;
const value = false;
if (!(age >= 22 || value)) {
console.log("너는 술을 살 수 있어!");
} else {
console.log("돌아가");
}
▶ 기타 연산자
문자열 결합 연산자, 삼항 연산자, 쉼표 연산자, delete 연산자, typeof 연산자, instanceof 연산자, voide 연산자가 존재한다.
문서에서 자세히 확인해보자: TCP 기타 연산자
📎참조
