Question

我正在努力了解它的工作原理，特别是这部分：

  Array.from(e.attributes, ({name, value}) => [name, value])

在这里，我们处理NamedNodeMap，这是Attr对象的集合，而Attr确实具有名为name和value的属性。因此，我们有一个匿名函数，该函数接受一个对象并返回一个数组。到目前为止，一切都很好。

我不太了解该函数的参数被定义为垃圾对象{name, value}的方式。

我能够隔离行为：

> o={ a: 1, b: 2, ldfk: 'mùl' }
> let objToArr = function({a,b}){ return [a,b] }

> objToArr(o)
[ 1, 2 ]
> 
> o = {'dfklj':3.14, 'c':'z', 'a':1, 'foo':'bar', 'b':2, 'z':26 }
{ dfklj: 3.14, c: 'z', a: 1, foo: 'bar', b: 2, z: 26 }
> objToArr(o)
[ 1, 2 ]
>

但是我仍然不明白为什么为什么。有人可以解释一下或向我推荐适当的文档吗？

Answer 1

您要寻找的是destructuring assignment，您只需要将键分配给一个对象常量即可。

var object = { name_: 'foo', value: 42 },
    { name_, value } = object;           // name is a property of window

console.log(name_);
console.log(value);

Answer 2

您不完全将对象文字定义为参数，而是destructuring对象。您可以将解构视为访问对象属性的另一种方法。

例如，如果您有一个对象a：

const a = {
  name: 'foo',
  value: 'bar'
}

您可以通过多种不同方式获取其属性：

通过方括号表示法：

const name = a["name"];
const value = a["value"];

通过点表示法

const name = a.name;
const value = a.value;

或通过destructuring assignment：

const {name, value} = a; // name & value are variables which you can use

const a = {
  name: "foo",
  value: "bar"
}

var name = a["name"];
var value = a["value"];
console.log(name, value);

var name = a.name;
var value = a.value;
console.log(name, value);

var {name, value} = a;
console.log(name, value);

因此，当您在函数参数中使用{name, value}时，实际上就是在告诉javascript从作为参数传递的对象中提取name和value属性。

Answer 3

我不太了解函数的参数被定义为垃圾对象{name，value}的方式。

这称为destructuring assignment JavaScript表达式，可以将数组中的值或对象中的属性解压缩为不同的变量。

定义仅适用于作为参数传递的对象的属性子集的函数

3 个答案: