对象解构语法——ES6

Question

我已经讲过数组解构语法，这是很容易理解的。

当我们说var {p, q} = o;时，我们到底在做什么?

var {p, q}中的p和q与o即'p'和'q'的性质不同吗?如果是，

为什么var {a, b} = o;不工作?

> var o = {p: 42, q: true};
    undefined
> p
    ReferenceError: p is not defined
> q
    ReferenceError: q is not defined
> o['p']
    42
> o['q']
    true
> var {p, q} = o;
    undefined
> p
    42
> q
    true
> var {a, b} = o;
    undefined
> a
    undefined
> b
    undefined

*注意:我了解到，字典键在javascript中是字符串字面值。*

Answer 1

    var o = {p: 42, q: true};
     var {p, q} = o;

这里，var {p,q} = o只是var {p:p , q:q} = o

的简写

考虑这一点。

      var o = { key : "value" };
      var { key : local_var } = o ;
      local_var === o["key"] // true

如果省略了local_var，则写入var {key} = o;将用标识符"key"创建一个新的变量key。和做一样var key = o["key"]

在你的例子中这就像

      var p =  o["p"] ;  //42
       var q = o["q"];   //true
       var a = o["a"];  // undefined
       var b = o["b"];   //undefined

这可能不完全正确，但应该有助于您理解它。
它有点像其他语言提供的模式匹配，但它是不同的。

Answer 2

这是因为使用对象解构的语法，LHS表达式({a, b})中使用的名称被用作RHS表达式(o)中的键。因为a和b不是o的属性，所以失败(返回undefined)。

规范中的相关章节是在AssignmentProperty: IdentifierReference Initializer下的Runtime Semantics: DestructingAssignmentEvaluation(倒数第二)。你的a(和b…分开),。a的StringValue是'a'，它被用作从o(在本例中相当于o['a'])获取值的键。

如果你这样做就可以了:

var {p:a, q:b} = o;

使用AssignmentProperty: PropertyName: AssignmentElement(最后一项)，使用属性名(p)和分配元素(a)。