while문을 통해 전치 후치 연산자를 이해해보자

samkong·2022년 5월 9일
0

JavaScript

목록 보기
2/2
post-thumbnail

🥲 : 전치, 후치 연산자 계산순서에 궁금한게 있는데
a += ++a % b++ ? c * d : b / c;
해당 식에서 후치 연산자 사용된 b++이 언제 증가를 시켜줘야 되는건지 모르겠어요
b가 연산에 처음으로 사용되면 그 후 바로 ++을 하면 되는건가요?

😄 : 전치/후치 증감연산자는 '식'을 기준으로 전 후에 적용됩니다.
삼항연산자의 경우 "식1 ? 식2 : 식3;" 으로 구성되어 각 식별로 따로 적용됩니다.

📌 시퀀스 포인트 : 삼항 연산자의 조건식, statement의 세미콜론, 논리 연산자, 쉼표 연산자 등이 있구요

👉 예를 들어 i++ + 2라는 식이 있다면,
i++의 평가 값은 i이고, 2의 평가 값은 2이므로, 해당 식의 평가 값은 최종적으로 i + 2입니다.
그리고 i++ + 2; 혹은 i++ + 2 ? ... 혹은 i++ + 2 && ... 이런식으로 시퀀스 포인트를 만나면 그 전에 i 값이 1 증가하는거죠

나는 전치/후치 연산자의 연산 순서에 대해 항상 헷갈렸다.
while문을 통해 전치, 후치 연산자가 언제 증가가 되는지 알아보좌.

while 문이란?
while 반복문의 문법은 다음과 같습니다.

while (condition) {
  // 코드
  // '반복문 본문(body)'이라 불림
}

condition(조건)이 truthy 이면 반복문 본문의 코드가 실행됩니다.

비교 연산자와 후위/전위형 연산자를 함께 사용하는 경우

위와 같은 식에서,
전위형 증가 연산자를 사용한 경우엔 1부터 4까지 출력되지만,
후위형 증가 연산자를 사용한 경우엔 1부터 5까지 출력된다!

let i = 0;
while (++i < 5) alert( i );

우선 ++i는 i를 먼저 증가시키고 새로운 값을 반환하기 때문에
첫 번째 while 반복문에선 1부터 비교를 시작한다.
1과 5를 비교(1 < 5)하고 나서, alert 창엔 1이 출력된다.

1에 이어서 2, 3, 4…가 출력된다.
i 앞에 ++가 붙어있기 때문에 5는 항상 증가 이후의 값과 비교된다.

i = 4 이후에 i의 값이 5로 증가하면
while(5 < 5)안의 비교가 실패하기 때문에 반복문은 멈춘다.
따라서 5는 출력되지 않는다.

let i = 0;
while (i++ < 5) alert( i );

후위 증가 연산자를 적용하면 i++는 i를 증가시키긴 하지만 기존 값을 반환한다.
따라서 첫 번째 while 반복문에선 0과 5를 비교한다.
이 부분이 전위 증가 연산자와의 차이이다.

그런데 alert문은 조건문과 별개의 문이므로 alert창엔 1이 출력된다.
i는 이미 증가한 이후이기 때문이다!

1이 출력된 이후에 2, 3, 4…가 이어서 출력된다.

i = 4일 때
전위 증가 연산자(++i)를 사용하면 값이 먼저 증가하기 때문에 5와 5를 비교하게 되는데,
여기선 후위 증가 연산자(i++)를 사용하고 있으므로 i는 증가하지만 기존 값인 4가 비교에 사용된다.
따라서 while(4 < 5)가 되고, 해당 조건은 참이므로 하단 블록이 실행되어 alert 창에 5가 뜨게 된다.
다음 반복문은 while(5 < 5)이므로 마지막 출력되는 값은 5가 된다.

출처 : 모던 JavaScript 튜토리얼

profile
공유와 공감을 사랑하는 프론트엔드 개발자 김삼콩입니다

0개의 댓글