Link Search Menu Expand Document
Operator
Table of contents
  1. String concatenation 문자열 연산자
  2. Numeric operators 산술 연산자
  3. Increment and decrement operators 증감 연산자
    1. preIncrement
    2. postIncrement
    3. preDecrement
    4. postDecrement
  4. Assignment operators 대입 연산자
  5. Comparison operators 비교 연산자
  6. Logical operators 논리 연산자
    1. || (or)
    2. && (and)
    3. ! (not)
  7. Equality operators 비교 연산자
    1. == (loose equlity)
    2. === (strict equlity)
  8. Conditional operators 조건 연산자 : if, else if, else
  9. Ternary operators 삼항 연산자
  10. Switch operators
  11. Ref.

Operator 연산자란 프로그래밍에서 쓰이는 기호들을 말한다.

String concatenation 문자열 연산자

console.log("my" + "cat"); // mycat
console.log("1" + 2); //12
console.log(`string literals: 1+2 = ${1 + 2}`); // string literals: 1+2 = 3

Numeric operators 산술 연산자

console.log(1 + 1); // add
console.log(1 - 1); // substract
console.log(1 / 1); // divide
console.log(1 * 1); // multiply
console.log(5 % 2); // remainder 나머지 값
console.log(2 ** 3); // exponentiation 2의 3승 =8

Increment and decrement operators 증감 연산자

preIncrement

: counter에 1을 더한 다음에 preIncrement에 할당한다는 뜻

let counter = 2;
const preIncrement = ++counter;
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);
// preIncrement =3, counter=3

preIncrement는 아래와 동일한 코드

counter = counter + 1;
preIncrement = counter;

postIncrement

: postIncrement에 먼저 counter값을 할당한 다음 1을 더해서 counter를 출력함

let counter = 2;
const postIncrement = counter++;
console.log(`postIncrement: ${postIncrement}, counter: ${counter}`);
// postIncrement =2, counter=3

postIncrement는 아래와 동일한 코드

postIncrement = counter;
counter = counter + 1;

preDecrement

: counter에 1을 뺀 다음에 preIncrement에 할당한다는 뜻

let counter = 2;
const preDecrement = --counter;
console.log(`preDecrement: ${preDecrement}, counter: ${counter}`);
// preDecrement=1, counter=1

postDecrement

: postDecrement에 먼저 counter값을 할당한 다음 1을 빼서 counter를 출력함

let counter = 2;
const postDecrement = counter--;
console.log(`postDecrement: ${postDecrement}, counter: ${counter}`);
// postDecrement=2, counter=1

Assignment operators 대입 연산자

반복되는 x를 생략해서 코드를 작성하는 방법

let x = 3;
let y = 6;
x += y; // x = x + y;
x -= y; // x = x - y;
x *= y; // x = x * y;
x /= y; // x = x / y;

Comparison operators 비교 연산자

비교하는 operators

console.log(10 < 6); // less than
console.log(10 <= 6); // less than or equal
console.log(10 > 6); // greater than
console.log(10 >= 6); // greater than or equal

Logical operators 논리 연산자

|| (or)

or 연산자는 처음으로 true 값이 나오면 멈춘다 (하나 이상이 ture이면 되기 때문)

그렇기 때문에 연산이 많은 함수를 제일 마지막에 두고, 심플한 value값을 앞에 둬야 한다

const value1 = true;
const value2 = 4 < 2;

console.log(`or: ${value1 || value2 || check()}`);

function check() {
  for (let i = 0; i < 10; i++) {
    //wasting time => 시간을 낭비하다가 결국 true를 출력하는 함수
    console.log("🤪");
  }
  return true;
}

// or: true (value1이 true이기 때문에 true가 출력됨)

&& (and)

and 연산자는 처음으로 false값이 나오면 멈춘다 (모든 값이 true여야 하기 때문에)

간단하게 null을 체크할 때도 사용한다

nullableObject가 null이 아닐때만 something을 가져올 수 있도록

if (nullableObject != null) {
  nullableObject.something;
}

! (not)

값을 반대로 바꿔주는 역할

value1이 true이기 때문에 false로 바꿔서 출력됨

const value1 = true;
console.log(!value1); // false

Equality operators 비교 연산자

== (loose equlity)

type이 다른 경우에도 같다고 출력함

⇒ string 5와 number 5를 ==으로 물어보면 true라고 출력

=== (strict equlity)

type이 다른 경우에 다르다고 출력함

⇒ string 5와 number 5를 ===으로 물어보면 false라고 출력

== 과 ===

// object equlity by reference
const ellie1 = { name: "ellie" };
const ellie2 = { name: "ellie" };
const ellie3 = ellie1;
console.log(ellie1 == ellie2); // false 각각 다른 ref가 저장되어 있으므로
console.log(ellie1 === ellie2); // false
console.log(ellie1 === ellie3); // true

// equlity - puzzlere
console.log(0 == false); // true (emthy string은 다 false로 간주)
console.log(0 === false); // false (0은 boolean type이 아니므로)
console.log("" == false); // true (emthy string은 다 false로 간주)
console.log("" === false); // false (0은 boolean type이 아니므로)
console.log(null == undefined); // true
console.log(null === undefined); // false (type이 서로 다르므로)

Conditional operators 조건 연산자 : if, else if, else

const name = "dowon";
if (name === "dowon") {
  console.log("Welcome, Dowon!");
} else if (name === "coder") {
  console.log("You are amazing coder");
} else {
  console.log("unkwon");
}
// Welcome, Dowon!

Ternary operators 삼항 연산자

condition ? value1 : value2;조건 ? 참:거짓

⇒ condition인 ?가 true면 value1을 출력하고, false이면 value2를 출력한다

가독성을 위해서 간단한 코드일때만 사용하는 것이 좋다

const name = "dowon";
console.log(name === "dowon" ? "yes" : "no");
// yes

Switch operators

if, if else를 계속 반복한다면 switch 사용을 고려하는 것이 좋다

const browser = "IE";
switch (browser) {
  case "IE":
    console.log("go away!");
    break;
  case "Chrome":
  case "Firefox":
    console.log("love you!");
    break;
  default:
    console.log("same all!");
    break;
}

Ref.


Page last modified: 2021-02-08 16:02:77.