JavaScript에서 i++와 ++i의 차이점

Tahseen Tauseef 2023년10월12일
  1. JavaScript의 증가 및 감소 연산자
  2. JavaScript의 접미사 대 접두사 증분 연산자
JavaScript에서 i++와 ++i의 차이점

이 튜토리얼 문서에서는 증가 및 감소 연산자에 대해 자세히 설명합니다.

JavaScript의 증가 및 감소 연산자

증가 및 감소 연산자는 변수 값을 1씩 늘리거나 줄이는 데 사용됩니다. 이러한 증가 및 감소 연산자는 여러 가지 방법으로 작성할 수 있으며 각 방법에는 속성이 있으므로 동일하지 않습니다. 우리는 일반적으로 이러한 연산자를 루프에서 볼 수 있으며 루프에서 사용하는 데 매우 익숙합니다.

다음은 증가 및 감소 연산자를 사용하는 가장 일반적인 두 가지 방법입니다.

  • ++variable(접두사)
  • variable++(접미사)
  • --variable(접두사)
  • variable--(접미사)

이 두 가지 증가/감소 연산자 방법은 변수 값을 1씩 업데이트한다는 점에서 동일합니다. 그러나 자세히 보면 차이점이 있습니다.

다음 예에서는 증가 연산자를 사용하는 접두사 방법을 사용하고 그 작동을 이해합니다.

var i = 5;
alert(++i);
alert(i);

위에서 언급한 코드에서 변수 i의 초기 값은 5이고 다음 줄에서는 경고 메시지를 사용하여 접두사 증가의 작동을 보여줍니다. 이제 경고는 증분 후에 i 값을 얻습니다. 따라서 경고는 i값을 6으로 생성합니다. 그리고 i에 대한 경고가 있는 다음 줄은 이전 경고와 동일한 값인 6을 반환합니다.

증가 연산자를 사용하는 후위 방법을 살펴보겠습니다.

var i = 5;
alert(i++);
alert(i);

이 코드 세그먼트에는 경고에 사용되는 후위 증가 연산자가 있습니다. i 변수의 초기 값은 5이고 증가 연산자는 6을 만듭니다.

그러나 경고에서 후위 증분 연산자를 사용하면 경고가 이전과 같이 i 값인 5를 가짐을 알 수 있습니다. 증가분은 여기에서 볼 수 없습니다.

그러나 경고가 i 값을 가져오는 데 사용되는 다음 줄에서는 새 값이 1씩 증가합니다. 따라서 새 값은 6이 됩니다.

여기에서 접두사 메서드는 먼저 변수를 1씩 증가시킨 다음 경고에 의해 가져옵니다. 그러나 접미사에서 i 변수의 값은 증분 전에 가져오기 때문에 첫 번째 경고는 이전과 동일한 값을 표시합니다.

그리고 첫 번째 경고가 실행되면 i 변수의 값이 업데이트되고 다음 경고 메시지에서 가져옵니다.

증가 연산자를 작성하는 또 다른 방법은 다음과 같습니다.

> i = i + 1;

이 방법은 접두사 방법과 동일하며 증분 수를 변경하려는 경우에 사용됩니다. 다음 예를 살펴보겠습니다.

var i = 5;
i = i + 1
alert(i);

이 예에서 변수 i는 1씩 증가합니다. 따라서 경고가 변수 i의 값을 가져오려고 할 때 변수는 새 증가된 값을 보내고 첫 번째 경고는 값 6의 출력을 가집니다. 이 방법은 접두사 방법과 동일하며 값을 가져오기 전에 증분 ​​작업이 수행됩니다.

JavaScript의 접미사 대 접두사 증분 연산자

다음은 증가 연산자를 사용하는 다양한 방법을 사용하는 복잡한 예입니다.

var i = 5;
var j = 10;
alert(i++);        // shows 5
alert(j++);        // shows 10
alert(++i);        // shows 7
alert(++j);        // shows 12
alert(i = i + 1);  // shows 8
alert(i);          // shows 8

이 코드 세그먼트에서 여러 증분 연산자를 사용했으며 각 줄에는 주석으로 작성된 출력이 있습니다. 접미사 증분은 첫 번째 및 두 번째 경고에 사용되므로 경고가 가져온 후 변수 값이 증가합니다.

마찬가지로 경고는 세 번째 및 네 번째 경고 메시지에서 증가 후 값을 접두사 증가 연산자로 표시합니다.

일부 언어에서는 접미사와 접두사가 차이가 없지만 JavasScript에서는 즉각적인 결과가 중요하지 않은 경우 동일한 목적을 수행합니다. 그러나 즉각적인 결과가 필요한 JavaScript 프로그램이 있는 경우 접미사와 접두사의 차이점은 다음과 같습니다.

접미사(i++): 변수 i의 값을 먼저 반환한 다음 변수를 증가시킵니다.

접두사(i--): 증가가 변수에 완료된 후 변수 i의 값을 반환합니다.

관련 문장 - JavaScript Operator