使用 ES6 在 JavaScript 中重构对象和数组

有了 ES6 / ES2015,您现在可以更轻松地从数组和对象中提取数据,并减少语法混乱。

雷达破坏

自动创建值与数组中的项目相匹配的变量:

1const names = ['Bob', 'Fred', 'Benedict'];
2
3const [cat, dog, alligator] = names;
4
5console.log(cat); // Bob
6console.log(dog); // Fred
7console.log(alligator); // Benedict

您还可以使用没有变量名称的号来跳过项目:

1const names = ['Bob', 'Fred', 'Benedict'];
2
3const [cat, , alligator] = names;
4
5console.log(cat); // Bob
6console.log(alligator); // Benedict

您可以摧毁数组的一部分,然后将其余部分放入新数组:

1const names = ['Bob', 'Fred', 'Benedict'];
2
3const [cat, ...rest] = names;
4
5console.log(cat); // Bob
6console.log(rest); // ["Fred", "Benedict"]

对象破坏

对象破结构略有不同,因为密钥不一定以特定的顺序,所以新变量需要与对象的密钥相匹配的名称:

1const names = {cat: 'Bob', dog: 'Fred', alligator: 'Benedict'};
2
3const {cat, dog, alligator} = names;
4
5console.log(cat); // Bob
6console.log(dog); // Fred
7console.log(alligator); // Benedict

然而,相匹配名称有一种方法,这里是如何给变量新的名称:

1const names = {cat: 'Bob', dog: 'Fred', alligator: 'Benedict'};
2
3const {cat: newCat, dog: newDog, alligator: newAlligator} = names;
4
5console.log(newCat); // Bob
6console.log(newDog); // Fred
7console.log(newAlligator); // Benedict
Published At
Categories with 技术
Tagged with
comments powered by Disqus