vue数组去重数组对象去重

最新推荐文章于 2025-04-13 21:28:28 发布

狼太保

最新推荐文章于 2025-04-13 21:28:28 发布

阅读量1.3w

点赞数 8

文章标签： vue.js javascript

本文链接：https://blog.youkuaiyun.com/z1010017573/article/details/110918943

版权

本文介绍了在Vue.js和JavaScript中如何实现数组去重，包括使用Es6的Set、filter、双for循环结合slice，以及针对数组中对象去重的方法，如通过对象属性、双重循环与布尔值判断，还有利用reduce方法进行去重。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

常见普通数组去重

利用Es6 Set去重

unique(arr){
      return Array.from(new Set(arr))
    },

利用filter

unique(arr){
      return arr.filter((item,index,arr)=>{
        return arr.indexOf(item,0) === index;
      });
    },

利用双for循环，然后solice去重

unique(arr){
      for(var i=0;i<arr.length;i++){
        for(var j=i+1;j<arr.length;j++){
          if(arr[i] == arr[j]){
            arr.splice(j,1);
            j--;
          }
        }
      }
      return arr;
    },

数组里面对象去重

利用对象访问属性的方法，判断对象中是否存在key

var arr = [{
      key: '1',
      value: '1'
    }, {
      key: '2',
      value: '2'
    }, {
      key: '3',
      value: '3'
    }, {
      key: '4',
      value: '4'
    }, {
      key: '1',
      value: '1'
    }, {
      key: '1',
      value: '1'
    }];
var result = [];
    var obj = {};
    for (var i = 0; i < arr.length; i++) {
      if (!obj[arr[i].key]) {
        result.push(arr[i]);
        obj[arr[i].key] = true;
      }
    }
    console.log(result);

利用两层for循环和布尔值的方法进行去重

var result = [];
    for (var i = 0; i < arr.length; i++) {
      var flag = true;
      for (var j = 0; j < result.length; j++) {
        if (arr[i].key === result[j].key) {
          flag = false;
        }
      }
      if (flag) {
        result.push(arr[i]);
      }
    }
    console.log(result);

利用reduce方法遍历数组,reduce第一个参数是遍历需要执行的函数，第二个参数是item的初始值

var obj = {};
    arr = arr.reduce(function (item, next) {
      obj[next.key] ? '' : obj[next.key] = true && item.push(next);
      return item;
    }, []);
    console.log(arr);