为什么解构与Javascript（ES6）中的经典赋值不同？

Posted 2021-05-05

正如你在这里看到的那样，我们将“fibonacci”设置为“可迭代”对象，然后使用for ...循环它：

let fibonacci = {
              [Symbol.iterator]() { 
                let pre = 0, cur = 1;
                return {
                  next() {
                    [pre, cur] = [cur, pre + cur];
                    return { done: false, value: cur }
                  }
                }
              }
            }

            for (var n of fibonacci) {
              // truncate the sequence at 1000
              if (n > 1000)
                break;
              console.log(n);
            }

正如预期的循环，控制台日志写1,2,3,5,8，..

但

如果我写pre = cur; cur = pre + cur;而不是[pre, cur] = [cur, pre + cur];

console.log会写2,4,8,16，..

为什么？不是解构只是一种在一行中设置多个值的方法吗？我们如何解释分配的差异？

答案

pre = cur; cur = pre + cur; 

随着pre的分配，你失去了pre的旧值，下一个任务是错误的。

pre  cur  comment           values
---  ---  ----------------  -------
  0    1  start values         *
  1    1  pre = cur
  1    2  cur = pre + cur      *
  2    2  pre = cur
  2    4  cur = pre + cur      *

[pre, cur] = [cur, pre + cur];

destructuring assignment保留值直到整个数组的赋值。