常用处理数组的方法
一、Es5
1.Arr.map()
数组中的每个元素会执行一次回调函数，结果作为一个新的数组返回，不改变原数组
let arr = [1, 2, 3, 4, 5]
let newArr = arr.map(x => {return x*2 // 将数组的每一项乘以2
})
console.log(newArr) // [2, 4, 6, 8, 10] 返回新数组
2.Arr.forEach()
数组中的每个元素会执行一次回调函数，没有返回值，原数组会改变
let arr = [1, {num: 2}, '4', true, null]arr.forEach(x => { x && x.num && (x.num = 3)// x = 'aa'})console.log('==========(arr)========>>>', arr)// [1, {num: 3}, '4', true, null] 数组的值如果是引用类型就可以改变，比如num的值就改变了，基础类型不会改变// [1, {num: 2}, '4', true, null]
3.Arr.filter()
此方法是将所有元素通过传入的函数进行判断，将满足条件的元素作为一个新的数组返回
let arr = [1, 2, 3, 4, 5]
let newArr = arr.filter(value => {return value >= 3 // 判断元素是否大于等于3
} )
console.log(newArr) // [3, 4, 5] 返回满足判断条件的所有值
4.Arr.every()
此方法是将所有元素通过传入的函数进行判断，返回一个布尔值，如果所有元素都满足判断条件，
则返回true，有一个不满足就返回false
let arr = [1, 2, 3, 4, 5]
arr.every( value => value < 4 ) // 判断结果返回false
arr.every( value => value < 6 ) // 判断结果返回true
5.Arr.some()
此方法是将所有元素通过传入的函数进行判断，返回一个布尔值，只要有一个元素满足判断条件，
就返回true，都不满足就返回才false
let arr = [1, 2, 3, 4, 5]
arr.every( value => value < 4 ) // 判断结果返回true
arr.every( value => value <0 ) // 判断结果返回false二、Es6
1.new Set(Arr)
数组对象去重、数组去重
1）数组去重
let arr = [12,43,23,43,68,12]
let newArr = new Set(arr) // {12, 43, 23, 68} 输出结果是对象
let newArr1 = [...new Set(arr)] // [12, 43, 23, 68] 将对象展开放进数组里面，输出结果是个数组
2）数组对象去重
let arr = [{key: '01',value: '西施'}, {key: '02',value: '王昭君'}, {key: '03',value: '杨玉环'}, {key: '04',value: '貂蝉'}, {key: '01',value: '西施'}
]// 方法一：利用对象访问属性的方法，判断对象中是否存在key
let newArr = []
let obj = {}
arr.map((item,i)=>{/* 通过key来过滤 */if(!obj[arr[i].key]){ // 当obj对象没有obj[arr[i].key] 这一项时执行newArr.push(arr[i]) // 每循环一次，将当前项添加到新的数组obj[arr[i].key] = true // 取每一项的key的值作为键，添加到obj，并赋值为true}
})
console.log('obj:',obj) // {01: true, 02: true, 03: true, 04: true}
console.log('newArr',newArr) //去重成功 newArr(4)[{…}, {…}, {…}, {…}] // 其它方法：[添加链接描述](https://www.cnblogs.com/cyfeng/p/12175986.html)
2.Arr.concat() …
数组拼接
1）concat（）方法
let arr1 = [1, 2, 3]
let arr2 = [4, 5]
let arr = arr1.concat(arr2) // [1, 2, 3, 4, 5]
2） ... 方法
let arr1 = [1, 2, 3]
let arr2 = [4, 5]
let arr = [...arr1, ...arr2] // [1, 2, 3, 4, 5]
3.Arr. findIndex()
找第一个符合条件的元素的下标，找到就返回元素的位置，找不到就返回-1。
let arr = [1, 2, 3, 4]
let newArr = arr.findIndex(item => item>4) // 没有大于4的元素，输出 -1
let newArr = arr.findIndex(item => item>2) // 第一大于2的元素是3，输出下标 2
4.Arr.find()
find()函数用来查找目标元素，找到就返回该元素，找不到返回undefined。
let arr = [1, 2, 3,4]
let newArr = arr.find(item => item>4) // 没有大于4的元素，输出 undefined
let newArr = arr.find(item => item>2) // 第一大于2的元素是3，输出该元素 3
参数拓展
find()，findIndex((item, index, arr) => {})
item：每次循环的当前元素。
index：每次循环的当前元素的索引。
arr：被查找的数组。
三、其它
1.Arr.push()
此方法是在数组的后面添加一个或多个元素，数组长度改变
let arr = [1, 2, 3, 4, 5]
arr.push(7,8) // [1, 2, 3, 4, 5, 7, 8]
2.Arr.pop()
此方法是在数组的后面删除一个或多个元素，数组长度改变
let arr = [1, 2, 3, 4, 5]
arr.pop() // [1, 2, 3, 4]
3.Arr.unshift()
此方法是在数组的前面添加一个或多个元素，数组长度改变
let arr = [1, 2, 3, 4, 5]
arr.unshift(6, 7) // [6, 7, 1, 2, 3, 4, 5]
4.Arr.shift()
此方法是在数组的前面删除一个或多个元素，数组长度改变
let arr = [1, 2, 3, 4, 5]
arr.shift() // [2, 3, 4, 5]
5.Arr.reduce()
此方法是所有元素调用传入的函数，返回值为最后函数处理的结果，传入的值必须是函数类型
let arr = [1, 2, 3, 4, 5]
let sum1 = arr.reduce((a, b) => a + b) // sum1 = 15 相当于累加的效果
let sum2 = arr.reduce((a, b) => a*b) // sum2 = 120 相当于累乘的效果// 与之相对应的还有一个 Array.reduceRight() 方法，区别是这个是从右向左操作的6.Arr.isArray()
判断是不是数组，返回的是布尔值
7.Arr.splice(开始位置， 删除的个数，要替换成的元素)
数组增删改，返回修改后的原数组
let arr = [1, 2, 3, 4, 5];// 注释：在数组的2位置，删除0个元素，同时新增一个'hahh'元素
let arr1 = arr.splice(2, 0, 'haha') // [1, 2, 'haha', 3, 4, 5] // 注释：从数组的2位置起，删除三个元素
let arr2 = arr.splice(2, 3) //[1, 2] // 注释：在数组的2位置，删除一个元素，同时新增一个'haha'元素
let arr1 = arr.splice(2, 1, 'haha') // [1, 2, 'haha', 4, 5]8.substring(str)、str.slice()
字符串截取、拼接
1）substring(str)
let phone="20200909111501"
let phone1 = `${phone.substring(0,4)}-${phone.substring(4,6)}-${phone.substring(6,8)} ${phone.substring(8,10)}:${phone.substring(10,12)}:${phone.substring(12,14)}`// 打印输出结果 2020-09-09 11:15:01
2）str.slice()
let str = '你个老六。'
let str1 = str.slice(0, 3) // 你个老
let str2 = str.slice(3, 4) // 六
let str3 = str.slice(3) // 六。
let str4 = str.slice(3, str.length) // 六。
9.str.split()
字符串转数组
// 注释：split方法用 | 将字符串切割成数组
let str = 'jpg|bmp|gif|ico|png'
console.log(str.split('|')) // ["jpg", "bmp", "gif", "ico", "png"]
10.Arr.toString() Arr.join()
数组转字符串
注意：字符串和数组的索引都是从0开始
let arr = [1, 2, 3, 4, 5]// 注释：直接通过toString()方法将数组拼成字符串
let str = arr.toString() // 12345// 注释：不传参数，类似于toString()方法
let str1 = arr.join('') // 12345// 注释：用逗号将数组拼成字符串(默认用逗号拼接)
let str2 = arr.join(',') // 1,2,3,4,5// 注释：用#号将数组拼成字符串
let str3 = arr.join('#') // 1#2#3#4#511.Arr.replace()
字符串替换
// 将首个"元"替换为"分"
'280元元'.replace(/元/, "分") // 输出 ：'280分元'
// 将全部"元"替换为"分"
'280元元'.replace(/元/g, "分") // 输出： '280分分'
12. indexOf()
寻找是否有某个值。找到返回第一次出现的索引， 找不到-1
['1','2','3','4'].indexOf('0') // 输出 -1
['1','2','3','4'].indexOf('3') // 输出 2
[1, '9'].indexOf('1') // 输出 -1
注意: indexOf()方法既比较数值又比较数值类型
13.jQuery 的 each() 方法（遍历数组和对象）
能遍历数组，也能遍历对象
function aa () {// var arr1 = {one:[1, 4, 3], two:[4, 6, 6], there:[7, 20, 9]}var arr1 = [[1, 4, 3], [4, 6, 6], [7, 20, 9]]$.each(arr1,(index,item)=>{console.log('index:',index)console.log('item:',item)})}aa()
![[转]科普 | 什么是宽表？](https://img-blog.csdnimg.cn/img_convert/f6b9c05961c2d7facf9e405dfd4e847b.png)
