filter方法用于对数组元素进行筛选,其返回一个新数组,新数组中的元素为原数组中所有符合筛选条件的元素,但不改变原数组的元素;
语法:
const newArr = arr.filter(function(element,index) { return 筛选条件 })
如下:
const arr = [23,41,56,21,89,28,34]
const newArr = arr.filter(function(element,index) {
// 筛选出30-70之间的数据
return element>=30 && element <=70
})
console.log(newArr) //[41,56,34]
写成箭头函数:
const arr = [23,41,56,21,89,28,34]
const newArr = arr.filter(element => element>=30 && element<=70)
console.log(newArr) //[41,56,34]
map方法用于对数组中所有元素进行处理,其返回一个新数组,新数组中的元素为原数组处理之后的数组元素,不改变原数组的值;
语法:
const newArr = arr.map(function(currentValue,index,arr),thisValue) //currentValue为数组当前元素值,arr为当前元素属于的数组对象(可选),thisValue执行回调时使用;
如下:
const arr = [23,41,56,21,89,28,34]
const newArr = arr.map(function(element,index) {
// 将数组中所有数据加30
return element+30
})
console.log(newArr) //[53,71,86,51,119,58,64]
写成箭头函数:
const arr = [23,41,56,21,89,28,34]
const newArr = arr.map(element => element + 30)
console.log(newArr) //[53,71,86,51,119,58,64]
forEach方法常用于对数组进行查找或遍历,不改变原数组的值;
语法:
arr.forEach( function( element, index, array), thisArg ) //element为当前正在处理的元素
如下:
const arr = [23,41,56,21,89,28,34]
arr.forEach((item) => item > 40 ? console.log(item):'') //输出 41,56,89
reduce方法返回累计处理的结果,常用于求和等处理;
语法:
arr.reduce(function(上一次的值,当前值) { ... },初始值)
如下:
const arr = [23,41,56]
//对arr数组求和
// 1.没有初始值
const sum = arr.reduce((prev,current) => prev+current)
console.log(sum) //120
// 2.有初始值
const sum1 = arr.reduce((prev,current) => prev+current,20)
console.log(sum1) //140
返回数组中第一个满足条件的值,否则返回undefined;
语法:
arr.find(function (element,index) {...} ) // 查找满足条件的元素的过程也是在遍历
如下:
const arr = [
{
name:'huihui',
age:18
},
{
name:'guigui',
age:20
},
{
name:'bubu',
age:23
}
]
const obj = arr.find((element,index) => element.name === 'huihui')
console.log(obj) //{name:'huihui',age:18}
与find方法类似,但findIndex方法返回的是第一个满足条件的元素的索引值;
如下:
const arr = [
{
name:'huihui',
age:18
},
{
name:'guigui',
age:20
},
{
name:'bubu',
age:23
}
]
const i = arr.findIndex((element,index) => element.name === 'huihui')
console.log(i) //0
用于检测数组中的元素是否满足某一条件,当所有数组元素满足特定条件时返回true,否则返回false;
如下:
const arr = [23,41,56]
//arr数组中的元素是否都大于10
console.log(arr.every(element => element > 10)) //true 所有都满足条件
console.log(arr.every(element => element > 50)) //false 只有56满足条件
用于检测数组中的元素是否满足某一条件,当存在一个或多个数组元素满足特定条件时返回true,否则返回false;
如下:
const arr = [23,41,56]
//arr数组中的元素是否都大于10
console.log(arr.some(element => element > 50)) //true 只有56满足条件