JavaScript 연산자

연산자

연산자는 하나 이상의 표현식을 대상으로 연산을 수행하여 하나의 값을 만드는 역할을 만든다.

예를 들어, 1 + 2 가 있을 때 연산자는 +이고 1과 2를 대상으로 연산을 수행하여 3이라는 값을 만든다.

그리고 1, 2는 피연산자라 불린다.

 

단항 연산자

단항 연산자는 하나의 피연산자만 사용하는 연산이다.

• void: 표현식을 평가할 때 값을 반환하지 않도록 지정한다.
• typeof: 평가 전의 피연산자 타입을 나타내는 문자열을 반환한다.
• delete: 객체의 속성을 삭제한다.

const a = { name: "apple" };
console.log(a); // { name: "apple" }

console.log(void a); // undefined

console.log(typeof a); // object

delete a.name; 
console.log(a); // {}

 

산술 연산자

산술 연산자는 두 개의 숫자를 피연산자로 받아서 하나의 숫자를 반환한다.

• 단항 산술 연산자: 1개의 피 연산자를 산술 연산하여 숫자값을 반환한다.
• 이항 산술 연산자: 2개의 피 연산자를 산술 연산하여 숫자값을 반환한다.

//  단항 산술 연산자
let a = 1;

a++; // a = a + 1
console.log(a); // 2

a--; // a = a - 1
console.log(a); // 1

console.log(-a); // -1 (양수를 음수로 반전)

// 이항 산술 연산자
let b = 5;
let c = 2;

console.log(b + c); // 7 (덧셈)
console.log(b - c); // 3 (뺄셈)
console.log(b * c); // 10 (곱셈)
console.log(b / c); // 2.5 (나눗셈)
console.log(b % c); // 1 (나머지)

 

관계 연산자

관계 연산자는 피연산자를 비교하고 결과가 참인지 거짓인지에 따라 boolean값을 반환한다.

• in: 객체 내에 속성이 존재할 경우 true를 반환한다.
• instanceof: 특정 객체 타입에 속하면 true를 반환한다.

const a = { name: "apple" };

console.log("name" in a); // true
console.log("color" in a); // false

console.log(a instanceof Object); // true
console.log(a instanceof Number); // false

 

비교 연산자

비교 연산자는 피연산자를 비교하고, 결과가 참인지에 거짓인지에 따라 boolean 값을 반환한다.

피연산자로 숫자뿐만 아니라 문자열, 논리형, 객체 등의 타입이 들어올 수 있다.

• 동등 연산자(==): 서로 같으면 true
• 일치 연산자(===): 서로 같고, 타입까지 같으면 true
• 부동 연산자(!=): 서로 다르면 true
• 불일치 연산자(!==): 서로 다르고, 타입도 다르면 true
• 이외에도 >, >=, <, <= 등이 있다.

let a = 1;
let b = "1";

console.log(a == b); // true
console.log(a === b); // false
console.log(a != b); // false
console.log(a !== b); // true

 

논리 연산자

논리 연산자는 두 개의 피연산자 중 하나를 반환한다.

무조건 Boolean값을 리턴하지 않으며, 논리 연산자가 여러 개 있을 경우 우선순위에 따라 이를 실행하며 먼저 실행한 식의 결과에 따라서 뒤의 식을 실행한다.

• A && B (AND): A가 false일 경우 A를, A가 true일 경우 B를 반환한다.
• A || B (OR): A가 false일 경우 B를, A가 true일 경우 A를 반환한다.

null, undefined, 빈 문자열은 false로 평가하므로 이를 활용하여 &&는 null 검사, ||는 캐싱 값에 대해서 사용할 수 있다.

let a = true;
let b = "b";

console.log(a && b); // b
console.log(a || b); // true

let c = false;
let d = "d";

console.log(c && d); // false
console.log(c || d); // d

 

기타 연산자들

• 쉼표 연산자: 두 연산자를 모두 평가한 후 오른쪽 피연산자의 값을 반환한다.
• 문자열 연산자: 두 문자열 값을 서로 연결하여 새로운 문자열을 반환한다.
• 옵셔널 연산자: 객체의 속성을 참조시 유효하지 않은 경우 에러가 아닌 undefined를 반환한다.
• 할당 연산자: 오른쪽 피연산자가 왼쪽 피연산자에 값을 할당한다.(+=, -=, *=, /=, &=, **=, &&=, ||=)
• 삼항 연산자: A ? B : C 형태로 A가 true일 경우 B를, A가 false일 경우 C를 반환한다.

// 쉼표 연산자
let a = (1, 2);
console.log(a); // 2

// 문자열 연산자
console.log("Hello" + " " + "World"); // Hello World

// 옵셔널 연산자
const b = {
  name: {
    firstName: "Minje",
    lastName: "Kim",
  },
};
console.log(b.name?.firstName); // Minje
console.log(b.address?.city); // undefined

// 할당 연산자
let c = 3;
c += 5;
console.log(c); // 8

// 삼항 연산자
const d = true;
const e = false;
console.log(d ? "t" : "f"); // t
console.log(e ? "t" : "f"); // f