x++ 和 ++x 的区别 程序员的懒惰与务实 前缀 vs. 后缀 什么时候该用哪个?需要记住的事情

2025-06-10

x++ 和 ++x 之间的区别

程序员的懒惰与务实

前缀与后缀

我什么时候应该使用其中一个?

要记住的事情

程序员的懒惰与务实

面对现实吧。程序员的职责就是在屏幕上输入一些神奇的代码,最终让它变成能用的东西。由于一整天的工作主要都是阅读和打字,因此为了提高效率和可读性,语法必须缩短,这很自然……或者是为了省下一些按键,因为打字太累了。

这就是我们有增量/减量运算符的原因。

// Suppose we have a variable that stores a number
let someNum = 0;

// Practicality Level 1
someNum = someNum + 1;

// Practicality Level 2
someNum += 1;

// Practicality Level 9000+
someNum++;

// Wait... or should I use...?
++someNum;

Enter fullscreen mode Exit fullscreen mode

啊,现在我们来谈谈手头的问题:和之间什么区别someNum++++someNum

前缀与后缀

  • 前缀: ++someNum
  • 后缀: someNum++

乍一看,这似乎是一种语法偏好;类似于生成器,你可以通过编写function* generator() {}或 来定义一个生成器function *generator() {}。与直觉相反,它们在工作方式上存在细微的差别,特别是在返回结果上。

免责声明:为了简洁起见,本文的其余部分将仅使用增量运算符。从这里开始,增量运算符适用的规则也适用于减量运算符。

这两个运算符仍然按照其语法含义执行操作:递增。无论是前缀还是后缀,变量都会递增 1。两者的区别在于它们的返回值。

  • 前缀increment返回变量增加的值。
  • 另一方面,更常用的后缀增量返回变量在增量之前的值。
// Prefix increment
let prefix = 1;
console.log(++prefix); // 2
console.log(prefix); // 2

// Postfix increment
let postfix = 1;
console.log(postfix++); // 1
console.log(postfix); // 2
Enter fullscreen mode Exit fullscreen mode

为了记住这条规则,我思考了两者的语法。当输入前缀 increment 时,意思是++x。 的位置++在这里很重要。 Saying 的意思是++x递增 ( ) ,然后返回 的值,因此有。后缀 increment 则相反。 Saying 的意思是返回 的值,然后再递增 ( ),因此有++x++xx++x++x++

我什么时候应该使用其中一个?

这完全取决于你,程序员。说到底,我们真正想用增量运算符实现的功能就是将变量加 1。如果你仍然担心它们之间的差异,那么在某些情况下,你可以使用其中一种运算符来编写更简单的代码。例如,考虑以下情况。

buttonID 为 的按钮counter统计其被按下的次数。它会根据按钮被按下的次数来更改ID 为 的按钮的innerHTML。常见的方法是附加一个点击监听器,该监听器会递增某个全局变量。spandisplayPressCount

// Global variable that counts how many times the button has been pressed
let numberOfPresses = 0;

// Stores necessary HTML elements
const button = document.getElementById('counter');
const span = document.getElementById('displayPressCount');

// Event handler
function clickHandler() {
  // Increment counter
  numberOfPresses++;
  span.innerHTML = numberOfPresses;
}

// Attach click listener to button
button.addEventListener('click', clickHandler);
Enter fullscreen mode Exit fullscreen mode

现在,让我们把焦点转移到clickHandler。注意到增量运算符在函数中占用了一行新的代码吗?回想一下前缀 increment 的返回值可以帮助我们缩短函数。

// Event handler
function clickHandler() {
  // Increment counter
  span.innerHTML = ++numberOfPresses;
}
Enter fullscreen mode Exit fullscreen mode

瞧!代码缩短了!如果我们想更疯狂一点,甚至可以使用箭头函数。整个脚本现在看起来像这样。

// Global variable that counts how many times the button has been pressed
let numberOfPresses = 0;

// Stores necessary HTML elements
const button = document.getElementById('counter');
const span = document.getElementById('displayPressCount');

// Attach click listener to button
button.addEventListener('click',
  () => (span.innerHTML = ++numberOfPresses)
);
Enter fullscreen mode Exit fullscreen mode

要记住的事情

前缀和后缀递增函数都会将数字的值加 1。两者之间的唯一区别在于返回值。前者++先递增 ( ),然后返回 的值x,因此++x。后者先返回 的值x,然后递增 ( ++),因此x++

现在就去向世界传播您新获得的知识吧!

鏂囩珷鏉ユ簮锛�https://dev.to/somedood/the-difference- Between-x-and-x-44dl
PREV
“查看页面源代码”的未来 现代网络的现实 我的 Web 开发之旅 查看页面源代码 威胁因素 现代网络的困境
NEXT
使用闭包和工厂函数模拟 JavaScript 中的“私有”变量 什么是私有变量? 闭包 工厂函数 使用闭包来访问私有变量 编程范式的奇特组合