likes
comments
collection
share

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

作者站长头像
站长
· 阅读数 48

集合操作方法的介绍

JavaScript的Set对象自从ES6引入以来,主要用于确保列表中没有重复的元素。然而,随着即将推出的7种内置Set方法,我们可能会发现自己更频繁地使用它们。

注意:这些新功能并不是所有浏览器都支持。

union()

新的 Set union() 方法为我们提供了两个集合中所有的唯一项。

const creation = new Set(['coding','writing','painting']);

const joy = new Set(['crying','laughing','coding']);

console.log(creation.union(joy));
// Set {'coding','crying','writing','laughing','painting'}

由于它是不可变的并且返回一个对象副本,你可以无限地调用

const odd = new Set([21,23,25]);

const even = new Set([20,22,24]);

const prime = new Set([23,29]);

console.log(odd.union(even).union(prime));
// Set(7) {21,23,25,20, 22,24,29}  

intersection()

两个集合都存在的元素是什么?

const mobile = new Set(['javascript','java','swift','dart']);

const backend = new Set(['php','python','javascript','java']);
const frontend = new Set(['javascript','dart']);

console.log(mobile.intersection(backend));
// Set {javascript,java}

console.log(mobile.intersection(backend).intersection(frontend));
// Set {javascript}

difference()

difference()方法执行 A-B 操作,返回集合A中不在集合B中的所有元素:

const joy = new Set(['crying','laughing','coding']);

const pain = new Set(['crying','screaming','coding']);

console.log(joy.difference(pain));
// Set {'laughing'}

symmetricDifference()

这个方法双向获取集合差异,即(A-B)U(B-A)。返回只在集合A或集合B中的元素:

const joy = new Set(['crying','laughing','coding']);

const pain = new Set(['crying','screaming','coding']);

console.log(joy.symmetricDifference(pain));
// Set {'laughing','screaming'}

isSubsetOf()

检查一个集合的所有元素是否都在另一个集合中。

const colors = new Set(['indigo','teal','cyan','violet']);

const purpleish = new Set(['indigo','violet']);

const secondary = new Set(['orange','green','violet']);

console.log(purpleish.isSubsetOf(colors)); // true

console.log(secondary.isSubsetOf(colors)); // false

console.log(colors.isSubsetOf(colors)); // true

isSupersetOf()

检查一个集合是否包含另一个集合中的所有元素

const colors = new Set(['salmon','cyan','yellow','aqua']);

const blueish = new Set(['cyan','aqua']);

const primary = new Set(['red','yellow','blue']);

console.log(colors.isSupersetOf(blueish)); // true

console.log(colors.isSupersetOf(primary)); // false

console.log(colors.isSupersetOf(colors)); // true

isDisjointFrom()

这两个集合是否没有任何共同的元素

const ai = new Set(['python','c++']);

const mobile = new Set(['java','is','dart','kotlin']);

const frontend = new Set(['js','dart']);

console.log(ai.isDisjointFrom(mobile)); // true

console.log(mobile.isDisjointFrom(frontend)); // false

如何立即使用它们

通过使用 core-js polyfills:

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

否则,你会从TypeScript 和 Node.js收到错误提示 ---它们尚未成为官方JavaScript标准的一部分。

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

总结

这就是我们的7种新的Set方法 ---再也不需要像 _.intersction() (Lodash!)这样的第三方库了。

你还在用for循环遍历集合?试试JavaScript新增的7种方法吧!

翻译自 medium.com/coding-beau…

转载自:https://juejin.cn/post/7351614051363192895
评论
请登录