JS数组篇

1. 数组常用方法

[].push  //添加
[].forEach  //循环
[].splice()  //删除（三个参数依次为：下标、删除数量、新添加的元素）
[].indexOf  //查找（存在时，返回该元素的下标，否则返回 -1；查找对象或属性时无效）
[].includes //查找 （存在时，返回true，否则返回false ；查找对象或属性时无效）
[].lastIndexOf //查找（从数组的末尾进行查找）
[].concat //合并两个数组
[].map //对数组内每个元素进行处理，并返回处理之后的值（时间处理）
[].filter  //对数组内每个元素进行判断，并返回符合条件的值（去重）
[].some  //对数组内每个元素进行判断，当有元素符合条件时，返回true，否则false
[].every  //对数组内每个元素进行判断，当所有元素都符合条件时，返回true，否则false
[].shift //删除数组的第一个元素
[].pop  //删除数组内的最后一个元素
[].unshift  //把一个元素添加到数组的头部
[].sort(function(a,b){ return a -b }) //正序排序
[].reverse() //将一个数组颠倒顺序
[].join() //选择指定的分隔符（toString()默认为 , ）
[].reduce(function( total, current) { return total + current; }) //计算数组某元素之和
[].slice(start, end) //从一个数组内选取内容
[].fill(item, start, end) //将一个值替换到数组的指定位置

2. 去重

  var arr = ["1", "2", "4", "2", "1"];
  var r = arr.filter((element, index, self) => 
      self.indexOf(element) === index
  );
  console.log(r); //[1, 2, 4]

const removeDuplicates = (arr) => [...new Set(arr)];

3. 排序

 var value = [12, 18, 19, 5, 4, 12, 3];
 value.sort((a, b) => a - b); //正序
 console.log(value);//[3, 4, 5, 12, 12, 18, 19]

 var value = [12, 18, 19, 5, 4, 12, 3];
 value.sort((a, b) => b - a);//倒序
 console.log(value);//[19, 18, 12, 12, 5, 4, 3]

4. 打乱数组

const shuffleArray = (arr) => arr.sort(() => 0.5 - Math.random());

5. 数组深拷贝

1. 利用展开运算符

let arr1 = [1, 2, 3],
  arr2 = [...arr1];

说明：针对一级数据是深拷贝，多级数据是浅拷贝

2. 利用json格式化

let arr1 = [1, 2, 3],
  arr2 = JSON.parse(JSON.stringify(arr1)); 

说明：如果需要拷贝的数据里面包含null、undefined、NaN或者某个function、Map、Set时，拷贝得到的结果有些会进行原始值的转换，部分数据会与之前不一致

3. 利用concat方法（该方法一般用于连接2个数组，返回的是一个新数组）

let arr1 = [1, 2, 3],
  arr2 = arr1.concat(); 

说明：针对一级数据是深拷贝，多级数据是浅拷贝

4. 利用 push.apply（通过改变父级对象的this指向来返回新数组）

let arr1 = [1, 2, 3],
   arr2 = [];
 
arr2.push.apply(arr2, arr1);

说明：针对一级数据是深拷贝，多级数据是浅拷贝

5. 利用 Array.from

let arr1 = [1, 2, 3],
  arr2 = Array.from(arr1);

说明：针对一级数据是深拷贝，多级数据是浅拷贝

6. 利用 [].slice.call

let arr1 = [1, 2, 3],
  arr2 = [].slice.call(arr1);

7. 利用structuredClone

let arr1 = [1, 2, 3],
  arr2  = structuredClone(arr1)

说明：对旧的浏览器会存在兼容性问题

6. 检查数组是否为空

const isNotEmpty = arr => Array.isArray(arr) && arr.length > 0;

7. 去除数组内的无效值
对一个数组进行处理，返回所有非假元素值。例如false, null,0, “”, undefined, 和 NaN 都是被认为是“假值”。

const compact = arr => arr.filter(Boolean)

8. 数组差集
返回A数组中，B数组没有的部分

const difference = (a, b) => {
  const s = new Set(b)
  let arr = a.filter(x => !s.has(x))
  return arr
}

9. 检查两个数组是否相同

const isArrayEqual = (a, b, result = false) => {
  if (a.length !== b.length) return (result = false)
  const s = new Set(b)
  if (a.find(x => !s.has(x))) return (result = false)
  return result
}

10. 数组的极值
最大值

const max = arr => Math.max(...arr.filter(v => Boolean(v) || v === 0));

最小值

const min = arr => Math.min(...arr.filter(v => Boolean(v) || v === 0))

11. 求数组某对象之和

let total = dataList.reduce((sum, cur) => sum + cur.Amount, 0);

12. 保留数组第一项 和 保留数组最后一项

datalist.splice(1, datalist.length);

datalist.splice(0, datalist.length - 1);

13. 对一个数组的元素进行非空验证

//对每个元素进行非空验证
let isEmpty = this.data.every((row) =>
   Object.values(row).every((item) => item)
);

//对除字段describe外的其它元素进行非空验证
let isEmpty = checkData.every((row) => {
  delete row.describe;
  return Object.values(row).every((item) => item);
});

14. 数组扁平化

arr.flat(Infinity); // 不论多少层级，数组均会被扁平化
arr.flat([depth]); // 参数depth不填时默认值为1