如何依赖对象解构赋值工作在JavaScript?

Question

这显然是一个有效的解构赋值，尽管qux取决于bar:

const { foo, bar, qux = () => bar } = myObject;

这是如何工作的，因为文档(https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment)没有介绍像上面的例子这样的依赖赋值是如何工作的。

Answer 1

qux: () => 'qux'表示声明const qux，其值将从myObject中提取为属性qux。

但是，如果myObject没有这样的属性，则声明const就像刚刚写了const qux = () => bar一样。因此，qux的默认值为箭头函数。

请注意，要使用默认值，qux属性必须不存在或在myObject中设置为未定义。如果myObject中的qux为null或任何其他值，则不使用默认值。

还需要注意的是，这将起作用:

const { foo, qux = () => bar, bar, x=qux() } = {};

但是这会抛出ReferenceError: Cannot access 'bar' before initialization:

const { foo, qux = () => bar, x=qux(), bar } = {};

这是因为当您执行qux = () => bar时，它还没有尝试访问未声明的变量。但是，调用qux()确实试图访问bar变量，因此顺序很重要。