JavaScript中a+++a与a+a++为何有不同结果?

297 阅读1分钟

我们先来康康运行结果:

// 片段1
let a = 1
console.log( a+++a )

代码片段1运行的结果是 3

let a = 1
console.log( a+a++ )

代码片段2运行的结果是 2

我们来仔细研究一下,预期中:

  • a+++a ,自增/减运算符的优先级是大于加/减的,所以它就相当于 (a++)+a ,讲道理后置自增运算符应该是先使用当前值进行运算,待运算完毕后再进行+1的操作,所以 (a++)+a 结果应该是1+1=2,计算之后a++=2
  • a+a++ 相当于 a+(a++) ,结果应该是1+1=2,计算之后a++=2

咦?为什么呢?运行的结果和预期不一致?

这就需要考虑到 编译器在“捣鬼” 了:

  • 首先a+++a 中,编译器 push(a++) ,紧接着 a就会自增为2,所以等到push(a) 的时候,a已经是2了……进而导致最后结果是3而不是2,原来自增的操作在编译器层面就已经完成了呢!
      +
    /   \
   /     \
  a++     a

编译器的处理过程:
1. push(a++), 即push(1),之后 a自增变成2
2. push(a),即push(2)
3. result = pop()+pop(), 出栈两个操作数(1,2)相加,得到3
  • 然后 a+a++ 中,因为要 按顺序先push(a) ,所以 自增的操作不会影响相加时a的值,自然会得到预期的结果啦!
      +
    /   \
   /     \
 a        a++

编译器的处理过程:
1. push(a), a入栈(1)
2. push(a++),即push(1),之后 a自增变成2
3. result = pop()+pop(), 出栈两个操作数(1,1)相加,得到2

你get了吗?