数组对象常用操作

通用

  /*
   对象数组合并相同key的data
     参数：1.待操作数组，2.参考key，3.待合并key
  */
let  arr = [
        {active: true,
        batchNumber: "010",
        houseId: 11,
        houseName: "总仓库123",
        isReduce: 1,
        lockStatus: 0,
        lockValue: 0,
        oriValue: 10,
        pinNumber: "1",
        stockId: 1992000,
        total: 1,
        value: 10},
        {active: true,
        batchNumber: "010",
        houseId: 11,
        houseName: "总仓库123",
        isReduce: 1,
        lockStatus: 0,
        lockValue: 0,
        oriValue: 10,
        pinNumber: "1",
        stockId: 1992000,
        total: 1,
        value: 10}
]
  mergeKeyArr(arr, key1, key2) {
    let tempArr = [];
    let Data = [];
    for (let i = 0; i < arr.length; i++) {
      if (tempArr.indexOf(arr[i].batchNumber) === -1) {
        Data.push({
          batchNumber: arr[i].batchNumber,
          dataInfo: [arr[i]]
        });
        tempArr.push(arr[i].batchNumber);
      } else {
        for (let j = 0; j < Data.length; j++) {
          if (Data[j].batchNumber == arr[i].batchNumber) {
            Data[j].dataInfo.push(arr[i]);
            break;
          }
        }
      }
    } 
    return Data
  }
mergeKeyArr(arr,'batchNumber')

 

//some、every------>
const list = [
  { name: '头部导航', backward: false },
  { name: '轮播', backward: true },
  { name: '页脚', backward: false },
];
const someBackward = list.some(item => item.backward);
// someBackward: true
const everyNewest = list.every(item => !item.backward);
// everyNewest: false

//filter、map------>
const list = [
{ name: '头部导航', type: 'nav', id: 1 },,
{ name: '轮播', type: 'content', id: 2 },
{ name: '页脚', type: 'nav', id: 3 },
];
const resultList = list.filter(item => {
  console.log(item);
  return item.type === 'nav';
});
// resultList: [
//   { name: '头部导航', type: 'nav', id: 1 },
//   { name: '页脚', type: 'nav', id: 3 },
// ]
const newList = list.map(item => {
  console.log(item);
  return item.id;
});
// newList: [1, empty, 2, 3]

// list: [
//   { name: '头部导航', type: 'nav', id: 1 },
//   empty,
//   { name: '轮播', type: 'content', id: 2 },
//   { name: '页脚', type: 'nav', id: 3 },
// ]


//  for、forEach、for ...of ------>
const list = [1, 2, 3, 4, 5, 6, 7, 8,, 10, 11];

for (let i = 0, len = list.length; i < len; i++) {
  if (list[i] === 5) {
    break; // 1 2 3 4
    // continue; // 1 2 3 4 6 7 8 undefined 10 11
  }
  console.log(list[i]);
}

for (const item of list) {
  if (item === 5) {
    break; // 1 2 3 4
    // continue; // 1 2 3 4 6 7 8 undefined 10 11
  }
  console.log(item);
}

list.forEach((item, index, arr) => {
  if (item === 5) return;
  console.log(index); // 0 1 2 3 5 6 7 9 10
  console.log(item); // 1 2 3 4 6 7 8  10 11
});
//小结----------->
三者都是基本的由左到右遍历数组
forEach 无法跳出循环；for 和 for ..of 可以使用 break 或者 continue 跳过或中断。
for ...of 直接访问的是实际元素。for 遍历数组索引，forEach 回调函数参数更丰富，元素、索引、原数组都可以获取。
for ...of 与 for 如果数组中存在空元素，同样会执行。
//some、every------->
const list = [
  { name: '头部导航', backward: false },
  { name: '轮播', backward: true },
  { name: '页脚', backward: false },
];
const someBackward = list.some(item => item.backward);
// someBackward: true
const everyNewest = list.every(item => !item.backward);
// everyNewest: false


//filter、map------->
const list = [
{ name: '头部导航', type: 'nav', id: 1 },,
{ name: '轮播', type: 'content', id: 2 },
{ name: '页脚', type: 'nav', id: 3 },
];
const resultList = list.filter(item => {
  console.log(item);
  return item.type === 'nav';
});
// resultList: [
//   { name: '头部导航', type: 'nav', id: 1 },
//   { name: '页脚', type: 'nav', id: 3 },
// ]

const newList = list.map(item => {
  console.log(item);
  return item.id;
});
// newList: [1, empty, 2, 3]

// list: [
//   { name: '头部导航', type: 'nav', id: 1 },
//   empty,
//   { name: '轮播', type: 'content', id: 2 },
//   { name: '页脚', type: 'nav', id: 3 },
// ]

性能：for 循环的速度最快，for of 循环最慢

let person = {name:"张三",age:25,address:"深圳",getName:function(){}}
Object.keys(person) // ["name", "age", "address","getName"]

var obj = { 10: 'a',1: 'b',2: 'c'};
console.log(Object.values(obj));
// ['b', 'c', 'a']

01 

/*通过reduce 去重*/
function Uniq(arr = []) {
    return arr.reduce((t, v) => t.includes(v) ? t : [...t, v], []);
}
const arr = [2, 1, 0, 3, 2, 1, 2];
Uniq(arr); // [2, 1, 0, 3]

/*or*/

let arr = [1, 2, 3, 2, 3, 4]
let arrFilter = [...new Set(arr)]
console.log(arrFilter)

/*or*/

var arr = [1, 2, 2, 3, 4, 5, 5, 6, 7, 7];
var arr2 = arr.filter(function(x, index,self) {
return self.indexOf(x)===index;
}); 
console.log(arr2); //[1, 2, 3, 4, 5, 6 ,7]

 

02 

/* 数组成员特性分组 */
function Group(arr = [], key) {
    return key ? arr.reduce((t, v) => (!t[v[key]] && (t[v[key]] = []), t[v[key]].push(v), t), {}) : {};
}
const arr = [
    { area: "GZ", name: "YZW", age: 27 },
    { area: "GZ", name: "TYJ", age: 25 },
    { area: "SZ", name: "AAA", age: 23 },
    { area: "FS", name: "BBB", age: 21 },
    { area: "SZ", name: "CCC", age: 19 }
]; // 以地区area作为分组依据
Group(arr, "area"); // { GZ: Array(2), SZ: Array(2), FS: Array(1) }

 03

 // obj 数组去重
  arrayDe (objArray, key) {
        return objArray.filter((el, index, arr) => index === arr.findIndex(_el => _el[key] === el[key]))
    }
commodityList = [{name:1,id:1},{name:1,id:1},{name:2,id:2},{name:3,id:3}]
let arr= arrayDe(commodityList,'id')
/*arr =  {[name:1,id:1],[name:2,id:2],[name:5,id:4]}*/
/*原理 findIndex找不到符合的就返回-1 找到就返回index直接退出不再执行 即永远只会执行第一个重复的数据 filter执行重复值的时候findIndex只会执行第一个重复值 即index不== filter只会返回true的数据*/

04 

//过滤空值
let match = {
            adText:1,
            search:2,
            seckill:''
        }
        for (let key in match) {
            if (match[key] == '') {
                delete match[key]
            }
        }

05

//对象数组的去重，并统计每一项重复次数
const list  = [
  { name: 'left', width: 20 },
  { name: 'right', width: 10 },
  { name: 'center', width: 70 },
  { name: 'right', width: 10 },
  { name: 'left', width: 20 },
  { name: 'right', width: 10 },
];
const repeatTime = {};
const result = list.reduce((array, item) => {
  if (repeatTime[item.name]) {
    repeatTime[item.name]++;
    return array;
  }
  repeatTime[item.name] = 1;
  return [...array, item];
}, []);
// repeatTime: { left: 2, right: 3, center: 1 }
// result: [
//   { name: 'left', width: 20 },
//   { name: 'right', width: 10 },
//   { name: 'center', width: 70 },
// ]