整理常用的数组方法,filter,some,map,forEach,reduce,find,every

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  }
]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值