JavaScript 中 i++ 和 ++i 的區別

Tahseen Tauseef 2023年10月12日
  1. JavaScript 中的遞增和遞減運算子
  2. JavaScript 中的字尾與字首增量運算子
JavaScript 中 i++ 和 ++i 的區別

本教程文章詳細解釋了遞增和遞減運算子。

JavaScript 中的遞增和遞減運算子

自增和自減運算子用於將變數的值增加或減少 1。這些自增和自減運算子可以寫成多種方式,每種方式都有其屬性,這意味著它們是不一樣的。我們通常在迴圈中看到這些運算子,並且對它們在迴圈中的使用非常熟悉。

以下是使用遞增和遞減運算子的兩種最常見的方法:

  • ++variable(字首)
  • variable++(字尾)
  • --variable(字首)
  • variable--(字尾)

這兩種遞增/遞減操作符的相同之處在於它們將變數的值更新為 1。但是,如果仔細觀察,它們有其不同之處。

在下面的示例中,我們將使用使用增量運算子的 Prefix 方法並瞭解其工作原理。

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。

在這裡,prefix 方法首先將變數增加 1,然後由警報獲取。但是,在字尾中,i 變數的值是在增量之前獲取的,因此第一個警報顯示與之前相同的值。

一旦第一個警報被執行,i 變數的值就會更新並被下一個警報訊息獲取。

編寫增量運算子的另一種方法是

> i = i + 1;

這個方法和 prefix 方法一樣,如果我們想改變增量的次數就會用到。讓我們看看下面的例子。

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

我們在此程式碼段中使用了多個增量運算子,並且每一行都將其輸出寫為註釋。字尾增量用於第一個和第二個警報,因此該變數的值在警報獲取它後增加。

類似地,警報將在第三和第四條警報訊息中遞增後的值顯示為字首遞增運算子。

在某些語言中,字尾和字首沒有區別,但在 JavaScript 中,如果你不關心直接結果,它們的作用相同。但是,如果你有一個需要即時結果的 JavaScript 程式,那麼字尾和字首之間的區別在於:

字尾(i++):首先返回變數 i 的值,然後增加變數

字首(i--):在對變數進行增量後返回變數 i 的值。

相關文章 - JavaScript Operator