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