Shulou(Shulou.com)06/03 Report--

This article will explain in detail how to achieve array de-duplication in es6. The editor thinks it is very practical, so I share it for you as a reference. I hope you can get something after reading this article.

Es6 array deduplication methods: 1, the use of Set objects and array from methods, syntax "Array.from (new Set (arr))"; 2, the use of Set and extension operators, syntax "[... new Set (arr)]"; 3, the use of Map objects and array filter methods.

The operating environment of this tutorial: windows7 system, ECMAScript version 6, Dell G3 computer.

The first is the Array.from method using Set objects and arrays

Const newArr = Array.from (new Set (arr))

Code example:

Print the results after running

To put it simply, the second method is simpler than the first. Let's also give a brief explanation.

Set is a new data structure provided by ES6, which is similar to an array, but does not have duplicate values.

The Array.from method is used to turn two types of objects into real arrays: array-like objects (array-like object) and iterable objects (including ES6's new data structures Set and Map).

So set combined with Array.from can also achieve the effect of array deduplication. It should be noted, however, that mainstream browsers like Chrome,Firfox,Opera,Safari, including Microsoft's Edge, are supported, but only the IE series does not.

Second: using the Set+ extension operator.

The third way can be said to be simpler.

Const newArr = [... new Set (arr)]

Code example:

These are three ways to achieve array deduplication by using the new features of ES6. The common advantage of these three methods is that the code is simple, and it can also achieve the effect of deduplication for undefined and NaN.

The third: filter method using Map objects and arrays

Function unique (arr) {const res = new Map (); return arr.filter ((a) = >! res.has (a) & & res.set (a, 1))}

Code example:

Through printing, we found that it really achieved the effect we wanted. So let's explain it briefly.

Map object is a new data structure provided by ES6, in which the way of has is to return a Boolean value indicating whether a value exists in the current Mp object, and the way of set is to set key/value to the Map object.

The 2filter () method creates a new array, and the elements in the new array are checked for all eligible elements in the specified array.

Therefore, the Map object combined with the filter method can achieve the effect of array deduplication ~

This is the end of this article on "how to achieve array de-duplication in es6". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it out for more people to see.

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.