利用reduce和forEach方法对数组对象去重

责编:menVScode 2019-05-16 10:35 阅读(958)

方法一:

采用对象访问属性的方法,判断属性值是否存在,如果不存在就添加。

方法二:

采用数组中的reduce方法,遍历数组,也是通过对象访问属性的方法

var arr = [{
      key: '01',
      value: '乐乐'
   }, {
      key: '02',
      value: '博博'
   }, {
      key: '03',
      value: '淘淘'
   },{
      key: '04',
      value: '哈哈'
   },{
      key: '01',
      value: '乐乐'
   }];


   //  方法1:利用对象访问属性的方法,判断对象中是否存在key
   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); // [{key: "01", value: "乐乐"},{key: "02", value: "博博"},{key: "03", value: "淘淘"},{key: "04", value: "哈哈"}]



   //  方法2:利用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); // [{key: "01", value: "乐乐"},{key: "02", value: "博博"},{key: "03", value: "淘淘"},{key: "04", value: "哈哈"}]

方法三:

forEach遍历数组对象且去重

var obj1 = [{
    key: '01',
    value: '哈哈'
},{
    key: '02',
    value: '旺旺'
}, {
    key: '03',
    value: '娃娃'
},{
    key: '04',
    value: '皮皮'
},{
    key: '05',
    value: '波波'
}];

//  遍历数组对象
var str1 = "";

angular.forEach(obj1, function(data, index, obj1) {
    //data等价于obj1[index]
    str1 += obj1[index].value + ',';
});

str1 = str1.substring(0, str1.length - 1);

console.log(str1); //  哈哈,旺旺,娃娃,皮皮,波波

//index 数组参数都可以省略

var str2 = "";

angular.forEach(obj1, function(data) {

    str2 += data.key + ',';

})

str2 = str2.substring(0, str2.length - 1);

console.log(str2); //  01,02,03,04,05

//forEach() 遍历数组对象

var str3 = "";

obj1.forEach(function(data){

    str3 += data.value + ',';

})

str3 = str3.substring(0, str3.length - 1);

console.log(str3); //  哈哈,旺旺,娃娃,皮皮,波波

 

//  遍历数组对象   根据主键去重

var o = {};

var arr = [];

angular.forEach(obj1, function(data) {

    if(!o[data.key]){

        arr.push(data.key);

        o[data.key] = true;

    }

});

console.log(arr); //  ["01", "02", "03", "04"]

语法:

array:需要遍历的集合

data:遍历时当前的数据(数组中的每一项)

index:遍历时当前索引

这里要注意的是:function()里面的参数第一个是value ,第二个是下标(index),第三个是要便利的数组;

也可以不用写后面两个参数。

var array = [{a: 1}, {b: 2}];

angular.forEach(array , function(data, index, array){

    console.log(data == array[index]); //true

})

 

array.forEach(function(data, index, array){

    console.log(data == array[index]); //true

})
前端交流群: MVC前端网(menvscode.com)-qq交流群:551903636

邮箱快速注册

忘记密码