Question

我使用电子和React，我有一些看起来像这样的代码：

constructor(props) {
  super(props);
  const { arr } = this.props;
  ipcRenderer.on('event', () => {
    console.log(this.props.arr); // will log updated values
    console.log(arr); // always logs initial value 
  });
}

有谁知道为什么会这样？我无法在其他任何地方重现这一点。我尝试用窗口事件处理程序和闭包来做类似的事情，看看它们是否以相同的方式运行，但它们并没有。我错过了一些非常明显的东西吗？

const obj = { arr: [1, 2, 3] };
const { arr } = obj;
obj.arr.push(4);
arr.push(5);

console.log(obj.arr); // => [1, 2, 3, 4, 5]
console.log(arr); // => [1, 2, 3, 4, 5]

Answer 1

我错过了一些非常明显的东西吗？

据推测， new 数组已分配给this.props.arr。简单的重复：

const obj = { arr: [1, 2, 3] };
const { arr } = obj;
obj.arr = [1];

console.log(obj.arr); // => [1]
console.log(arr); // => [1, 2, 3]

解构并不神奇。这两个是等价的：

const { arr } = this.props;
const arr = this.props.arr;

arr包含<{>分配时this.props.arr所拥有的值，而this.props.arr会在您访问时为您提供值它。

对象解构分配在构造函数中表现得很奇怪

1 个答案: