Summary of methods for deduplicating arrays using js

This time I will bring you a summary of the methods for deduplicating arrays with js. What are the precautions for deduplicating arrays with js? The following is a practical case, let’s take a look.

We have n ways to achieve array deduplication.

es5 implementation method

for循环+indexOf
function unique(arr) {
  var uniqueArr = [],
   len = arr.length
  for (var i = 0; i < len; i++) {
   if (uniqueArr.indexOf(arr[i]) == -1) {
    uniqueArr.push(arr[i])
   }
  }
  return uniqueArr
 }
 var arr = [1, 2, 3, 1, 5, "1"]
 var uniqueArr = unique(arr)
 console.log(arr)  //[1, 2, 3, 1, 5, "1"]
 console.log(uniqueArr)  //[ 1, 2, 3, 5, '1' ]

Deduplication after sorting

function unique(arr) {
  var uniqueArr = [],
   sortArr = arr.concat().sort(),
   len = sortArr.length,
   prev
  for (var i = 0; i < len; i++) {
   if (!i || prev !== sortArr[i]) {
    uniqueArr.push(sortArr[i])
   }
   prev = sortArr[i]
  }
  return uniqueArr
 }
 var arr = [1, 2, 3, 1, 5, "1"]
 var uniqueArr = unique(arr)
 console.log(arr)  //[ 1, 2, 3, 1, 5, '1' ]
 console.log(uniqueArr)  //[ 1, '1', 2, 3, 5 ]
利用对象
function unique(arr) {
  var uniqueArr = [],
   obj = {},
   len = arr.length
  for (var i = 0; i < len; i++) {
   obj[typeof arr[i] + arr[i]] = arr[i]
  }
  for (var i in obj) {
   uniqueArr.push(obj[i])
  }
  console.log(obj)  //{ number1: 1, number2: 2, number3: 3, number5: 5, string1: '1' }
  return uniqueArr
 }
 var arr = [1, 2, 3, 1, 5, "1"]
 var uniqueArr = unique(arr)
 console.log(arr)  // [1, 2, 3, 1, 5, "1"]
 console.log(uniqueArr)  //[ 1, 2, 3, 5, '1' ]

es6 implementation method

利用Set结构和Array.from
function unique(arr) {
  return Array.from(new Set(arr))
 }
 var arr = [1, 2, 3, 1, 5, "1"]
 var uniqueArr = unique(arr)
 console.log(arr)   //[ 1, 2, 3, 1, 5, '1' ]
 console.log(uniqueArr)  //[ 1, 2, 3, 5, '1' ]
利用Set结构和...
function unique(arr) {
  return [...new Set(arr)]
 }
 var arr = [1, 2, 3, 1, 5, "1"]
 var uniqueArr = unique(arr)
 console.log(arr)  //[ 1, 2, 3, 1, 5, '1' ]
 console.log(uniqueArr)   //[ 1, 2, 3, 5, '1' ]

Common methods for arrays

• slice() is used to extract a part of the target array and return a new array, leaving the original array unchanged.

• concat() is used to merge multiple arrays. It adds the members of the new array to the end of the members of the original array, and then returns a new array, leaving the original array unchanged.

• reverse() is used to reverse the array elements and return the changed array. Note that this method will change the original array.

• sort() sorts the array members. The default is to sort the array members in dictionary order. After sorting, the original array will be changed.

• push() is used to add one or more elements to the end of the array and returns the length of the array after adding the new elements. Note that this method will change the original array.

• pop() is used to remove the last element of the array and return that element. Note that this method will change the original array.

• unshift() is used to add an element at the first position of the array and returns the length of the array after adding the new element. Note that this method will change the original array.

• shift() is used to delete the first element of the array and return that element. Note that this method will change the original array.

• splice() is used to delete some members of the original array and add new array members at the deleted position. The return value is the deleted element. Note that this method will change the original array.

• map() passes all members of the array into the parameter function in turn, and then returns the results of each execution into a new array.

• forEach() is very similar to the map method, and also executes the parameter function on all members of the array in sequence. However, the forEach method does not return a value and is only used to manipulate data.

• filter() is used to filter array members, and the members that meet the conditions form a new array and return it.

• join() uses the specified parameter as the delimiter to concatenate all array members into a string and return it. If no parameters are provided, they default to commas.

• indexOf() Returns the position of the first occurrence of the given element in the array, or -1 if it does not appear.

• lastIndexOf() Returns the position of the last occurrence of the given element in the array, or -1 if it does not appear.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Using vue2.0 boostrap in the case

Resolving the conflict between double-click and click events

The above is the detailed content of Summary of methods for deduplicating arrays using js. For more information, please follow other related articles on the PHP Chinese website!