forEach()
参数 function(currentValue, index,arr)
forEach方法中的function回调有三个参数: arry.forEach((item,index,arry))
第一个参数是遍历的数组内容,
第二个参数是对应的数组索引,
第三个参数是数组本身
1. 可以改变数组自身,没有返回值;
2. 中途不能用常规操作跳出循环,可以用抛出异常(try/catch)的方式,但不推荐这样做;
遍历数组,求和
let arry = [1,2,,4,3,5]
let total =0
arry.forEach(item=>{
total+=item
})
console.log(total)
arry.forEeach(item=>{
item = item +1
})
console.log(arry) //[1,2,3,4,5] 没改变原数组
let arr1= [
{
name:'zhangsan',
age:11
},
{
name:'lisi',
age:13
},
{
name:'wagngwu',
age:10
},
]
arr1.forEach(item=>{
item.age = item.age +1
})
console.log(arr1) // arr1= [
{
name:'zhangsan',
age:12
},
{
name:'lisi',
age:14
},
{
name:'wagngwu',
age:11
},
] 改变了原数组
结论:当数组中元素是值类型,forEach绝对不会改变数组;当是引用类型,则可以改变数组
map
参数 function(currentValue, index,arr)
map也是和forEach 一样有三个参数
map 和forEach的区别
forEach 没有返回值(有的说法也叫返回值为undefined) 不能链式调用
map 有返回值 不会改变原来的数组 需要一个新建的数组来接收返回出来的值
map的基础点
1. 新建一个数组,需要有承载对象,也意味着原始数组在调用它后不会发生变化;
2. 该数组中的每个元素都调用一个提供的函数后返回结果。
let arr = [ 1,2,3,4,5]
let arr1.map(item=>{
return item +1 // 只有一句代码的时候 return{}可以省略 arr1.map(item=>item+1)
})
console.log(arr1) // [2,3,4,5,6]
filter
参数 function(currentValue, index,arr)
filter 为数组中的每个元素调用一次 callback 函数,并利用所有使得" callback 返回 true 或 等价于 true 的值 的元素"创建一个新数组。不改变原来数组
let arr = [1,2,3,4,6]
let arr1 = arr.filter(item=>item>3)
console.log(arr1) // [4,6]
数组去重
let arry = [1,2,3,2,3,2,4,5]
let arry1 = arry.filter((item,index,arry)=>{
return arry.indexOf(item)===index
})
console.log(arry1) //[1,2,3,4,5]
sort 排序
注意:会修改原数组
let arr = [2,3,1,6,5,4]
升序 console.log(arr.sort()) //[1,2,3,4,5,6] //只适用于number或者['3','4','1','2'] 这种一位数的字符串
降序 console.log(arr.sort(a,b)=>b-a)
let arry2 = ['3','54','101','12','6','5']
对于这种的排序不能直接用sort
arry2.sort((a,b)=>a-b)
some
参数 function(currentValue, index,arr)
some() 方法会依次执行数组的每个元素:
如果有一个元素满足条件,则表达式返回true , 剩余的元素不会再执行检测。
如果没有满足条件的元素,则返回false。
注意: some() 不会对空数组进行检测。
注意: some() 不会改变原始数组。
some()用于检查数组中是否有某些符合条件
只要有一个满足即返回true
let arry = [1,2,3,4,5]
let flag=arry.some(item=>{}
return item>6
)
console.log(flag) //false
every 和some类似
every() 方法使用指定函数检测数组中的所有元素:
如果数组中检测到有一个元素不满足,则整个表达式返回 false ,且剩余的元素不会再进行检测。
如果所有元素都满足条件,则返回 true。
let arry = [1,2,3,4,5]
let flag=arry.every(item=>{}
return item>0
)
console.log(flag) //true
find()
有兼容问题 IE 11 及更早版本也不支持 find()
find()就是用来在数组中找到我们所需要的元素,并且和some()一样,只要有一个满足即返回该元素,不会多余遍历,对性能很友善。如果没找到返回值是undefined
let arr1= [
{
name:'zhangsan',
age:11
},
{
name:'lisi',
age:13
},
{
name:'wagngwu',
age:10
},
]
let res =arr1.find(item=>{
item.name === 'zhangsan
})
console.log(res) // {name:'zhangsan',age:11}
findindex
有兼容问题ie12以下不支持
findIndex() 方法返回传入一个测试条件(函数)符合条件的数组第一个元素位置。
findIndex() 方法为数组中的每个元素都调用一次函数执行:
当数组中的元素在测试条件时返回 true 时, findIndex() 返回符合条件的元素的索引位置,之后的值不会再调用执行函数。
如果没有符合条件的元素返回 -1
注意: findIndex() 对于空数组,函数是不会执行的。
注意: findIndex() 并没有改变数组的原始值。
let arry = [1,2,3,4,5]
let res=arry.findindex(item=>item>2
)
console.log(res) //2
indexOf
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置
如果没找到返回-1
注意: indexOf() 方法对大小写敏感!
let arry = [1,2,3,4,5]
let res=arry.indexOf(item=>item>2
)
console.log(res) //2
reduce
arry.reduce( 它由一个回调函数与一个初始值组成,其中回调函数接受四个参数,我们先解释回调函数形参与initialValue的含义)
参数(function(accumulator, currentValue, currentIndex, array), initialValue)
1.initialValue 初始值
initialValue 表示reduce方法第一次执行时的初始值,是一个可选值。
2.accumulator 累加器;积聚者
accumulator 正如翻译的那样,它是 reduce 方法多次执行的累积结果,accumulator 的初始值分两种情况:
若有提供 initialValue 初始值,第一次循环时 accumulator 的值便为 initialValue,后续循环时 accumulator 为上次循环的返回值。
若未提供initialValue,第一次循环时 accumulator 的值为数组第一项arr[0],后续循环时为上次循环的返回值。
3.currentValue 当前值
这个应该不难理解,数组循环当前处理的值。currentValue 的初始值也受到initialValue的影响:
若有提供 initialValue 初始值,第一次循环currentValue 的值为数组第一项arr[0],后续变化随索引递增变化。
若未提供initialValue,第一次循环由于arr[0]成了accumulator 的值,所以currentValue 只能从arr[1]开始,后续变化随索引递增。
4.currentIndex
数组循环当前处理值的索引,currentValue 与 currentIndex是同步变化的。
reduce如果没有返回值就 为undefined
累加求和
const arr=[1,2,3,4,5] let res = arr.reduce((accumulator,crrentval)=>{ return accumulator+crrentval},0)
数组去重:
let arr = [1,2,3,4,6,1,2,3] let res = arr.reduce((accumnlator,current)=>{ return accumnlator.includes(current) ? accumnlator : accumnlator.concat(current)},[])
数组对象去重:
采用数组中的reduce方法,遍历数组,也是通过对象访问属性的方法
let arr1= [
{ name:'zhangsan', age:11 },
{ name:'lisi', age:13 },
{ name:'zhangsan', age:11 },
{ name:'zhangsan', age:11 },
{ name:'wagngwu', age:10 }
]
let obj = {}
let obj1 = arr1.reduce((acc,current)=>{
obj[current.name] ? '' : obj[current.name] = true && acc.push(current) return acc}
,[])
console.log(obj) //
[
{ name:'zhangsan', age:11 },
{ name:'lisi', age:13 },
{ name:'wagngwu', age:10 }
]