03_연산자(operator)

1. JavaScript에서의 연산자

1_1) 비교 연산자 (comparison operator)

💡

값을 비교해 결과 값을 boolean 타입인 true나 false로 반환한다.

• if문이나 for문 같은 제어문의 조건식에서 주로 사용하게 된다.
• 좌항과 우항의 비교 연산자를 비교한 다음, 결과를 boolean 타입으로 반환한다.

console.log(`1 == '1' : ${1 == '1'}`);
console.log(`1 == true : ${1 == true}`);
console.log(`1 === '1' : ${1 === '1'}`);
console.log(`1 === true : ${1 === true}`);

• 동등 연산자와 일치 연산자

  • 동등 연산자와 일치 연산자는 같은 듯 다른 연산자이다.
  • 같은 값인지 비교하는 것은 같지만 동등 연산자는 값만을 비교하고 일치 연산자는 값과 타입 모두 비교한다.
  • 동등 연산자
    • ==, !=의 형태로 좌항과 우항이 같은 값으로 평가되는지 비교한 후, boolean 타입 값을 반환한다.
    • 암묵적 타입 변환을 통해 타입을 일치 시킨 뒤 같은 값인지 비교한다.
  • 일치 연산자
    • ===의 형태로 좌항과 우항이 같은 값과 타입으로 평가되는지 비교한 후, 모두 같은 경우 true를 반환한다.
    • 엄격한 비교가 이루어지므로 암묵적 타입 변환이 발생하지 않는다.

1_2) 논리 연산자(logical operator)

• && 연산자 (and)

  • 앞선 값이 false라면 바로 false를 반환하고 true면 뒤의 값을 반환한다.

    console.log(true && 'aaa');  // aaa
    console.log(false && 'aaa');  // false

• || 연산자 (or)

  • 앞선 값이 true라면 바로 true를 반환하고 false면 뒤의 값을 반환한다.

    console.log(true || 'aaa');  // true
    console.log(false || 'aaa');  // aaa

• 단축 평가(short circuit evaluation)
  • 논리 연산자는 왼쪽에서 오른쪽 순서대로 평가가 이루어지는데 왼쪽 항만 보았을 때 평가 결과가 나오면 형 변환 없이 피연산자를 그대로 반환한다.
  • 논리적으로 값이 참인지 거짓인지 판단만 하고 연산자에 따라 값을 그대로 반환하는 것이다.
• Falsy한 값들

  • JavaScript는 특정 상황에서 특정 값을 boolean으로 판단한다.

  • Falsy한 값이라는 것은 이런 상황에서 false로 평가되는 값이다.

    if (false)
    if (null)
    if (undefined)
    if (0)
    if (NaN)
    if ("")

• nullish 병합 연산자

  • ??를 사용해 평가한다

  • 좌항이 null, undefined일 경우에만 다음 평가를 진행한다

    console.log(0 || "aaa"); // "aaa" 
    console.log(0 ?? "aaa"); // 0  
    console.log("" || "aaa"); // "aaa" 
    console.log("" ?? "aaa"); // ""  
    console.log(null || undefined || "aaa"); // "aaa" 
    console.log(null ?? undefined ?? "aaa"); // "aaa"

  • 변수에 값이 없을 때 할당하는 용도로도 유용하다

    const a = undefined;
    const b = a ?? 'newValue'
    
    console.log(b)  // newValue

• 증감 연산자(increment and decrement operator)
  • 증감 연산자는 피연산자를 1씩 증가 혹은 감소 시킬 때 사용하는 연산자이다
  • 피연산자가 단 하나뿐인 단항 연산자이다
  • 해당 연산자가 피연산자의 어느 방향에 위치하는 지에 따라 연산의 순서와 결과가 달라진다
  • 후위 연산자
    • 변수에 뒤에 위치한 것을 의미한다
    • 변수를 먼저 대입한 후에 연산을 수행한다
  • 전위 연산자
    • 연산자가 변수의 앞에 위치한 것을 의미한다
    • 연산을 먼저 수행한 뒤에 변수를 대입한다
  • ++

    • 변수의 값을 1씩 증가 시킨다

      let num = 1;
      num++;
      console.log(num);  // 2

  • --

    • 변수의 값을 1씩 감소 시킨다

      let num = 1;
      num--;
      console.log(num);  // 0