为什么解构的工作方式与 Javascript (ES6) 中的经典赋值不同？

Question

正如你在这里看到的，我们将 "fibonacci" 设置为一个 "iterable" 对象，我们用 for .. of:

循环它

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);
            }

正如预期的那样，在 for of 循环中，控制台日志写入 1,2,3,5,8,..

但是

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

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

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

Answer 1

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 保留值直到整个数组赋值。