微信公众号:路人zhang
网站救助计划

1.为阅读体验,本站无任何广告,也无任何盈利方法,站长一直在用爱发电,现濒临倒闭,希望有能力的同学能帮忙分担服务器成本


2.捐助10元及以上同学,可添加站长微信lurenzhang888,备注捐助网站倒闭后可联系站长领取本站pdf内容


3.若网站能存活下来,后续将会持续更新内容

当前位置: 前端 > javascript高频面试题 > 19.数组常用的遍历方法?

首先,回顾下数组的常用遍历方法:

map:返回新数组,数组元素为原始数组元素调用函数处理后的值,不会改变原始数组,且可进行链式调用

let arr = [1,2,3,4,5]
let result1 = arr.map(item => {return item+1}).map(item => {return item+1}) // [3,4,5,6,7]

filter:用于过滤数组,会返回一个新数组,返回数据为满足条件的元素,不会改变原始数组,且可进行链式调用

let arr = [1,2,3,4,5]
let result2 = arr.filter(item => {return item > 3}).filter(item => {return item < 5}) // [4]

every:该方法会对数组中的每一项进行遍历,只有所有元素都符合条件时,才返回true,否则就返回false

let arr = [1,2,3,4,5]
let result3 = arr.every(item => {return item > 3}) // false

some:该方法会对数组中的每一项进行遍历,只要有一个元素符合条件时,就返回true,否则就返回false。

let arr = [1,2,3,4,5]
let result4 = arr.some(item => {return item > 3}) // true

find: 当数组中的元素在测试条件时返回 true 时, find() 返回符合条件的元素,之后的值不会再调用执行函数,如果没有符合条件元素返回 undefined

let arr = [1,2,3,4,5]
let result5 = arr.find(item => {return item > 3}) // 4

reduce:对数组中的每个元素执行提供的reduce函数(升序执行),将其结果汇总为单个返回值。如果果没有提供initialValue,reduce 会跳过第一个索引,从索引1的地方开始执行 回调方法。如果提供initialValue,则从索引0开始。

let arr = [1,2,3,4,5]
let result6 = arr.reduce((prev, cur, index, arr) => { return prev + cur}) // 15
let result7 = arr.reduce((prev, cur, index, arr) => { return prev + cur}, 1) // 16

实现一个reduce

Array.prototype.selfReduce = function(cb, initValue) {
  // 判断是否是数组调用
  if (!Array.isArray(this)){ 
  	throw new TypeError('not a array')
  }
  // 数组为空,并且没有初始值,报错
  if(this.length === 0 && !initValue){
  	throw new TypeError('Reduce of empty array with 	no initial value')
  }
  let arr = this
  let res = null
  // 判断有没有初始值,有就初始化赋值
  if (initValue) {
    res = initValue
  } else{
  	res = arr[0] // 否则就取数组第一个值
  }
  for(let i = initValue?0:1;i<arr.length;i++){
  	res = cb(res, arr[i], i, arr) // 覆盖上次的计算结果
  }
  return res
};
let arr = [1,2,3,4,5]
let result6 = arr.selfReduce((prev, cur, index, arr) => { return prev + cur}) // 15
let result7 = arr.selfReduce((prev, cur, index, arr) => { return prev + cur}, 1) // 16

本站链接:https://www.mianshi.online如需勘误或投稿,请联系微信:lurenzhang888


点击面试手册,获取本站面试手册PDF完整版