对象数组封装的去重方法，传入唯一值进行

关注

原创最新推荐文章于 2026-08-24 15:21:50 发布 332 阅读 AI 写同款· GEO 优化 ›

JavaScript - 二维对象数组去重（根据某一属性）有时候，我们可能需要数组去重，如果是一维数组，那么直接 ES6 语法即可，如果是二维对象数组则无效了（一维数组去重请访问这篇文章例如以下对象数组，可以看到有两个重复的对象，那么如何根据id（或其他属性）进行判断后去除呢？阅读详情

对于给定的数组，例如: oldArr: [{ id: 1, name: 'zs' },{ id: 2, name: 'ls' },{ id: 3, name: 'ww' },{ id: 4, name: 'zl' },{ id: 5, name: 'zs' }] 去掉相同name的一项呢，下面就简单封装一个方法

 <div id="app">
      <div class="validate">
        原来的数组：<span>{{oldArr}}</span> <br />
        去重后的数组：<span>{{newArr}}</span><br />
      </div>
    </div>
    <script src="vue.js"></script>
    <script>
      const vm = new Vue({
        el: '#app',
        data: {
          oldArr: [
            { id: 1, name: 'zs' },
            { id: 2, name: 'ls' },
            { id: 3, name: 'ww' },
            { id: 4, name: 'zl' },
            { id: 5, name: 'zs' }
          ]
        },
        computed: {
          newArr: function() {
            return this.removSDuplicate(this.oldArr, 'name');
          }
        },
        methods: {
          /**
          @param oldArr 需要去重的数组
          @param uniqueValue 对象中唯一的值
          @return 输入结果
          **/
          removSDuplicate(oldArr, uniqueValue) {
            let hash = {};
            let newArr = oldArr.reduce(function(prev, item, _this) {
              hash[item[uniqueValue]]
                ? ''
                : (hash[item[uniqueValue]] = true && prev.push(item));
              return prev;
            }, []);
            return newArr;
          }
        }
      });
    </script>

这样就可以了，你要的效果：