js数组去重

106 阅读1分钟

双层循环去重

var arr = [1, 2, 3, 1, 2, 3, "1", "2"];
function unique(arr) {
  var res = [];
  for (var i = 0; i < arr.length; i++) {
    for (var j = 0; j < res.length; j++) {
      if (arr[i] === res[j]) {
        break;
      }
    }
    //如果没有跳出过循环,说明arr[i]是唯一的
    if (j === res.length) {
      res.push(arr[i]);
    }
  }
  return res;
}
console.log(unique(arr));

好繁琐的写法,甚至不易理解,先遍历传入的数组arr,再遍历接收的新数组res,如果遍历的arr数组中有值和res中的值相同,就跳出遍历,如果没有跳出遍历,则把这个值加入进去res中

indexOf去重

var arr = [1, 2, 3, 1, 2, 3, "1", "2"];
function unique(arr) {
  var res = [];
  for (var i = 0; i < arr.length; i++) {
    if (res.indexOf(arr[i]) === -1) {
      res.push(arr[i]);
    }
  }
  return res;
}
console.log(unique(arr));

感觉好理解多了,通过indexOf判断新数组res有这个值,有就加,没有就过

先排序在去重

var arr = [1, 2, 1, 3, 2, 3, "1", "2"];
function unique(arr) {
  var res = [];
  var sortArr = arr.concat().sort();

  for (var i = 0; i < sortArr.length; i++) {
    if (i !== 0 && sortArr[i] !== sortArr[i - 1]) {
      res.push(sortArr[i]);
    }
  }
  return res;
}
console.log(unique(arr));

有点就是减少了遍历,代码也稍微好理解一点,除开数组第一个元素,之后的元素每个都与前一个元素比较一下

使用filter去重

var arr = [1, 2, 1, 3, 2, 3, "1", "2"];
function unique(arr) {
  var res = arr.filter(function (item, index, arr) {
    return arr.indexOf(item) === index;
  });
  return res;
}
console.log(unique(arr));

filter去重的原理在于filter会对数组进行遍历,浅拷贝通过了函数验证的元素组成新的数组,indexOf则会返回元素所在位置的第一个index,没有返回为-1

ES6的Set,Map去重

var arr = [1, 2, 1, 3, 2, 3, "1", "2"];
function unique(array) {
  return Array.from(new Set(array));
}
console.log(unique(arr));

最简单好用的去重方法了,ES6的Set语法不允许有重复值,所以使用将数组转化为Set对象然后转回数组就可以实现去重了

var arr = [1, 2, 1, 3, 2, 3, "1", "2"];
function unique(arr) {
  const seen = new Map();
  return arr.filter((a) => !seen.has(a) && seen.set(a, 1));
}
console.log(unique(arr));

Map语法可以生成一个Map对象。键值对形式,把数组的所有数值换算成

includes去重

var arr = [1, 2, 3, 1, 2, 3, "1", "2"];
function unique(arr) {
  var res = [];
  for (var i = 0; i < arr.length; i++) {
    if (!res.includes(arr[i])) {
      res.push(arr[i]);
    }
  }
  return res;
}
console.log(unique(arr));

includes和indexOf用法类似,判断新数组中是否存在遍历的字段,不存在push进入新数组内