Question

如果前面没有var个关键字，对象解构为什么会抛出错误？

{a, b} = {a: 1, b: 2};

抛出SyntaxError: expected expression, got '='

以下三个示例可以正常运行

var {a, b} = {a: 1, b: 2};
var [c, d] = [1, 2];
    [e, f] = [1, 2];

奖金问题：为什么我们不需要var数组解构？

我遇到了像

这样的问题

function () {
  var {a, b} = objectReturningFunction();

  // Now a and b are local variables in the function, right?
  // So why can't I assign values to them?

  {a, b} = objectReturningFunction();
}

Answer 1

问题源于{...}运算符在JavaScript中具有多重含义。

当声明的开头显示{时，它始终代表block，无法分配给它。如果它稍后在 Statement 中显示为 Expression ，那么它将代表一个Object。

var有助于区分，因为它不能跟 Statement 一样，grouping parenthesis也是如此：

( {a, b} = objectReturningFunction() );

来自他们的文档：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Assignment_without_declaration

注意：在没有声明的情况下使用对象文字解构赋值时，需要在赋值语句周围使用括号（...）。

{a，b} = {a：1，b：2}不是有效的独立语法，因为左侧的{a，b}被视为块而不是对象文字。< / p>
然而，（{a，b} = {a：1，b：2}）是有效的，因为var {a，b} = {a：1，b：2}

你的（...）表达式需要以分号开头，或者可以用它来执行前一行的函数。

Answer 2

如果您编写的JavaScript不带分号，则“无声明的赋值”语法应以分号开头，以使其能够正常工作

let a, b

;({a, b} = objectReturningFunction()) // <-- note the preceding ;

只是想突出显示它，因为它吸引了我，并希望可以节省其他人一些时间，弄清楚为什么它不起作用和/或使用代码格式化程序等产生奇怪的结果。

实际上，它实际上就在公认的答案中（引用文档的最后一行），但是很容易错过，尤其是在没有看到示例的情况下！

Answer 3

这是另一种方式：

let {} = {a, b} = objectReturningFunction()

优点：

不需要括号
不需要分号
额外的任务是保证无人操作（假设没有奇怪的事情发生）

缺点：

看起来有些奇怪，尽管在我看来，!(){...}() IIFE并不奇怪。
关于它为什么存在可能会感到困惑。肯定会在第一次见面时就把人拒之门外，所以我建议不要一次性使用它。

没有变量的对象解构

3 个答案: