4. [Modern JS Deep Dive] 연산자, 제어문

책을 보고 새로 배운 내용을 정리했기 때문에 모든 내용이 정리되어 있지는 않습니다.

산술 연산자

1. 이항 산술 연산자

2. 단항 산술 연산자

이항 산술 연산자와 다르게 부수 효과가 있다.

var x = 1;
x++;

console.log(x); // 2

위 코드에서 처럼 연산자가 피연산자의 값을 변경하는걸 부수효과라고 한다.

+10; // 10 (문자열)

여기서 숫자 타입이 아닌 피연산자에 + 연산자를 사용하면 숫자 타입으로 타입 변환된다.

삼항 조건 연산자

js에 존재하는 유일한 삼항 연산자이다. 부수효과는 없다.

var x = 2;

var result = x % 2 ? '홀수' : '짝수';

console.log(x); // 짝수

위 연산자를 사용하면 if else를 사용했을때보다 코드의 길이를 줄여줄 수 있고 가독성에도 좋다. 그리고 중요한 차이점은 표현식이 아닌 if else문과는 다르게 삼항 연산자는 표현식이기 때문에 값으로 사용할 수 있다.

반복문 실행 순서

무의식적으로 알고 있었던 부분인데 이번에 확실하게 for문의 작동 순서를 생각해볼 수 있다.

for (var i = 0; i < 2; i++) {
  console.log(i);
}

// 0
// 1

1. 처음엔 var i에 0이 할당된다.
2. i < 2 조건을 비교한다.
3. 참이면 i++로 가는게 아닌 블록문안으로 간다.
4. i = 0을 출력한다.
5. i++ 해준다.
6. i < 2 조건을 비교한다.
7. 참이면 블록문안으로 간다.
8. i = 1을 출력한다.
9. i++ 해준다.
10. i < 2 조건을 비교한다.
11. 거짓이므로 for문을 탈출한다.

break 문

이중 for문 같은 경우에는 안쪽 반복문에서 break해도 모든 for문을 탈출하지 못한다.

for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 3; j++) {
    if (i + j === 6) {
      break;
    }
  }
}

위 코드를 실행해도 내부에 있는 for문만 탈출한다. 모든 반복문을 탈출하고 싶을때는 label 문을 사용하면 된다.

outer: for (var i = 0; i < 3; i++) {
  for (var j = 0; j < 3; j++) {
    if (i + j === 6) {
      break outer;
    }
  }
}

외부로 탈출할 때 유용하지만 추천하지는 않는다. 프로그램의 흐름이 복잡해져서 가독성이 나빠지고 예상치 못한 오류를 발생시킬 가능성이 높아지기 때문이다.