JavaScript - 연산자(Operator)

String concatenation(+)

cosole.log('my' + ' cat');
console.log('1' + 2);
console.log(`string literals: 1 + 2 = ${1 + 2}`);

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승)

Increment(++), decrement(—) operators

• 피연산자 뒤에 붙여(x++/x—) 접미사로 사용한 경우 증가/감소하기 전의 값을 반환
• 피연산자 앞에 붙여(++x/—x) 접두사로 사용한 경우 증가/감소한 후의 값을 반환

let counter = 2;
const preIncrement = ++counter;
// -> counter = counter + 1;
// preIncrement = counter;
console.log(`preIncrement: ${preIncrement}, counter: ${counter}`);
                           //preIncrement: 3, counter: 3
const postIncrement = counter++;
// post Increment = counter;
// counter = counter + 1;
console.log(`postIncrement: ${postIncrement}, counter: ${counter}`);
                           //postIncrement: 3, counter: 4

Assignment operators(대입 연산자)

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

Comparison operators(비교 연산자)

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

Logical operators(논리 연산자)

• || (or): 하나의 값만 true여도 true 반환(처음값이 true면 거기서 멈춤)
• && (and): 모든 값이 true여야 true 반환(처음값이 false면 거기서 멈춤)
• ! (not): 값을 반대로 바꿔줌 (truthy, falsy 여부 반전)

연산을 많이 하는 함수, expression(수식)은 마지막으로 호출

NOT → AND → OR 순서로 처리

const value1 = true;
const value2 = 4 < 2;
// || (or), finds the first truthy value
console.log(`or: ${value1 || value2 || check()}`); // f

// && (and), finds the first falsy value
console.log(`and: ${value1 && value2 && check()}`); // f
// null check: often used to compress long if-statement
// nullableObject && nullableObject
if (nullableObject != null) {
  nullableObject.something;
}

function check() {
  for (let i = 0; i < 10; i++) {
    // wasting time
    console.log('T^T');
  }
  return true;
}

// ! (not)
cosole.log(!value1); // f

Equality operators(비교 연산자)

• 비교 === (== 로도 비교는 가능하나, 타입을 검사하지 않아 오류가 날 수 있다.)

const stringFive = '5';
const numberFive = 5;

// == loose equality, with type conversion
console.log(stringFive == numberFive); // t
console.log(stringFive != numberFive); // f

// === strict equality, no type conversion
cosole.log(stringFive === numberFive); // f
console.log(stringFive !== numberFive); // t

// object equality by reference
const gazero1 = { name: 'gazero' };
const gazero2 = { name: 'gazero' };
const gazero3 = gazero1;
cosole.log(gazero1 == gazero2); // f
cosole.log(gazero1 === gazero2); // f
cosole.log(gazero1 === gazero3); // t

// equality - puzzler
cosole.log(0 == false); // T
cosole.log(0 === false); // F
console.log('' == false); // T
console.log('' === false); // F
console.log(null == undefined); // T
console.log(null === undefined); // F

Conditional operators(조건 연산자): if

• if, else if , else

const name = 'gazero';
if (name === 'gazero') {
  console.log('Welcome, Gazero!');
} else if (name === 'coder') {
  console.log('You are amazing coder');
} else {
  console.log('unknown');
}

Ternary operator(삼항 조건 연산자): ?

• condition ? value1 : value2;

true면 왼쪽 실행, false면 오른쪽 실행

console.log(name === 'gazero' ? 'yes' : 'no');

switch operator

• use for multiple if checks
• use for enum-like value check
• use for multiple type checks in TS

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