1.数组去重
let arrs = [1,2,2,3,3,6,5,5];
// ES6
[...new Set(arr)] // [1,2,3,6,5]
// 此方法也能去除数组中重复的项：[...new Set('ababbc')].join('') // abc
// 其他方法
function uniq(array){
let temp = [];
let l = array.length;
for(let i = 0; i < l; i++) {
for(let j = i + 1; j < l; j++){
if (array[i] === array[j]){
i++;
j = i;
}
}
temp.push(array[i]);
}
return temp;
}
console.log(uniq(arrs)); // [1,2,3,6,5]
2.数组合并
let arr1 = [1,2,3]
let arr2 = [4,5,6]
// ES6
[...arr1, ...arr2] // [1, 2, 3, 4, 5, 6]
// 方法2：concat方法（挂载Array原型链上）
let c = a.concat(b);
console.log(c); // [1, 2, 3, 4, 5, 6]
console.log(a); // [1, 2, 3] 不改变本身
// 备注：看似concat似乎是 数组对象的深拷贝，其实，concat 只是对数组的第一层进行深拷贝
// 方法3：apply方法
Array.prototype.push.apply(a, b);
console.log(a); // [1, 2, 3, 4, 5, 6] 改变原目标数组
console.log(b); // [4, 5, 6]
3.数组排序（sort）
let objArr = [
{name: 'test1', age: 20},
{name: 'test1', age: 22},
{name: 'test1', age: 21}
]
// 第一参数a， 第二参数b ---> a-b升序（从小到大）;b-a降序（从大到小），原理就是 两数计算，如果返回的是负数，就保留前者（我可能说的不对，欢迎纠正）
objArr.sort((a, b) => {
return a.age - b.age
})
// 结果会按照年龄从小到大的顺序排列
4.多维数组转一维数组（flat）
let arr = [1, [2], [[3], 4], 5];
// ES6 数组的flat()
arr.flat() // [1, 2, Array(1), 4, 5] 如果这样写的话只能展开二维数组，但是可以加参数Infinity，就是能展开多维数组
arr.flat(Infinity) // [1, 2, 3, 4, 5] 注意如果原数组有空位，flat()方法会跳过空位
// 其他方法
const deepFlatten = arr => [].concat(...arr.map(v => (Array.isArray(v) ? deepFlatten(v) : v)));
deepFlatten(arr); // [1,2,3,4,5]
// 执行效率验证（拓展）
// let start = new Date().getTime();
// console.log('reduceDimension: ', deepFlatten([1, [2], [[3], 4], 5]);
// console.log('耗时: ', new Date().getTime() - start); // *ms
// ES6 数组的flatMap() 方法大家可以自行查阅一下，拓展下自己的知识面
5.过滤数组（filter）
let json = [
{ id: 1, name: 'john', age: 24 },
{ id: 2, name: 'zkp', age: 21 },
{ id: 3, name: 'mike', age: 50 }
];
// ES6
json.filter( item => item.age > 22) // [{id: 1, name: 'john', age: 24}, { id: 3, name: 'mike', age: 50 }]
// ES5
6.判断数组中的项是否满足于某个条件（some，every）
let arr = [4, 2, 3]
// ES6 some方法（有符合）
arr.some( item => item > 1) // true
arr.some( item => item > 3) // true
// ES5 every（全符合）
arr.every(item => item > 1) // true
arr.every(item => item > 3) // false
// 注意：上面两个有不同哦，一个是有符合的判定，一个是全符合的判定
7.操作数组中的每一项，并使其按照一定的逻辑返回（map）
var potatos = [
{ id: '1001', weight: 50 },
{ id: '1002', weight: 80 },
{ id: '1003', weight: 120 },
{ id: '1004', weight: 40 }
]
// ES6写法
const fn = (arr, key) => arr.map(arr => arr[key])
fn(potatos, 'id') // ["1001", "1002", "1003", "1004"]
fn(potatos, 'weight') // [50, 80, 120, 40]
8.其他常用的ES6 Array方法
// forEach() 遍历数组
// pop() 删除数组中最后一个元素，并返回该元素的值。此方法更改数组的长度
// shift() 删除数组中第一个元素，并返回该元素的值。此方法更改数组的长度
// push() 将一个或多个元素添加到数组的末尾，并返回该数组的新长度
// unshift() 将一个或多个元素添加到数组的开头，并返回该数组的新长度(该方法修改原有数组)
// 🔥Array.prototype.filter() 创建一个新数组, 其包含通过所提供函数实现的测试的所有元素，不会改变原有值，如果没符合的返回[]
let arr = [1, 2, 3]
arr.filter( x => x > 1) // [2, 3]
// Array.prototype.join() 将一个数组（或一个类数组对象）的所有元素连接成一个字符串并返回这个字符串
['Fire', 'Air', 'Water'].join() // "Fire,Air,Water"
// Array.prototype.slice() 取出任意元素, | 参数一：从哪开始，参数二（可选）结束位置，不选的话 就节选到最后了
[1, 2, 3].slice(0, 1) // [1]
// Array.prototype.splice() 删除任意元素，操作任意元素 | 参数一：从哪开始 | 参数二：操作元素的个数 | 参数三：插入元素的值...（可以写多个参数三）
[1, 2, 3].splice(0, 1) // 删除 [2, 3]
// Array.prototype.includes() 用来判断一个数组是否包含一个指定的值，根据情况，如果包含则返回 true，否则返回false。
[1, 2, 3].includes(1) // true
// Array.prototype.reverse() 颠倒数组
[1, 2, 3].reverse() // [3, 2, 1]
9.获得数组最大最小值
// 使用 Math 中的 max/min 方法
let arr = [22,13,6,55,30];
// ES6
Math.max(...arr); // 55
Math.min(...arr); // 6
// ES5
Math.max.apply(null, arr); // 55
Math.min.apply(null, arr); // 6
10.获取数组交集
// ES6 写法
const similarity = (arr1, arr2) => arr1.filter(v => arr2.includes(v));
similarity([1, 2, 3], [1, 2, 4]); // [1,2]
// ES5 写法
// function similarity(arr1, arr2) {
// return arr2.filter(function(v) {
// return arr1.includes(v)
// })
// }
11.数组对象去重
let arr = [
{id: 1, name: 'Jhon1'},
{id: 2, name: 'sss'},
{id: 3, name: 'Jhon2'},
{id: 4, name: 'Jhon3'}
]
// ES6
const uniqueElementsBy = (arr, fn) =>arr.reduce((acc, v) => {if (!acc.some(x => fn(v, x))) acc.push(v);return acc;}, []);
// 下面的示例表示，去重依据是 id ，就是 id一样的，只留下一个
uniqueElementsBy(arr, (a, b) => a.id === b.id) // [{id: 1, name: 'Jhon1'}, {id: 2, name: 'sss'}]
12.数组乱序
function shuffle(arr) {
let array = arr
let index = array.length
while (index) {
index -= 1
let randomInedx = Math.floor(Math.random() * index)
let middleware = array[index]
array[index] = array[randomInedx]
array[randomInedx] = middleware
}
return array
}
let arr = [1,2,3,4,5]
shuffle(arr) // [3, 4, 2, 5, 1] 结果不定
13.检查数组中某元素出现的次数
function countOccurrences(arr, value) {
return arr.reduce((a, v) => v === value ? a + 1 : a + 0, 0);
}
let arr = [1,2,3,4,1,2,4]
countOccurrences(arr, 1) // 2
14.检查数组中的所有元素是否相等
const allEqual = arr => arr.every(val => val === arr[0]);
// 示例
allEqual([1, 2, 3, 4, 5, 6]); // false
allEqual([1, 1, 1, 1]); // true
15.数组对象，求某一列属性的总和
var potatos = [
{ id: '1001', weight: 50 },
{ id: '1002', weight: 80 },
{ id: '1003', weight: 120 },
{ id: '1004', weight: 40 }
]
// ES6写法
const fn = (arr, key) => arr.reduce((sum, p) => { return p[key] + sum },0)
fn(potatos, 'weight') // 290
fn(potatos, 'id') // "10041003100210010" 字符串相加就是这个结果，如果有各自的需求，可以自己加上
16.分割数组，并操作每一项数组（函数）
/**
* 数组分隔方法，并且可以传入一个处理函数，用来分隔之前处理数组的每一项
*
* @category Array
* @param {Array} array 需要处理的数组
* @param {number} [size = 1] 每个数组区块的长度
* @param {Function} [fn = item => item] 函数
* @returns {Array} 返回一个包含拆分区块的新数组（相当于一个二维数组）。
* @example
*
* chunk(['a', 'b', 'c', 'd'], 2)
* // => [['a', 'b'], ['c', 'd']]
*
* chunk(['a', 'b', 'c', 'd'], 3)
* // => [['a', 'b', 'c'], ['d']]
*
* chunk([1, 2, 3, 4], 3, item => item * 2)
* // => [[2, 4, 6], [8]]
*/
function chunk(array, size = 1, fn = item => item) {
array = array.map(fn)
size = Math.max(size, 0) // 这一句就很妙，当传入值小于0的时候，置为0，大于0的时候，不写，但不知道性能怎么样
const length = array == null ? 0 : array.length
if (!length || size < 1) {
return []
}
let index = 0
let resIndex = 0
const result = new Array(Math.ceil(length / size))
while (index < length) {
result[resIndex++] = array.slice(index, (index += size))
}
return result
}
