reducecallback(一个在数组中每一项上调用的函数,接受四个参数:)previousValue(上一次调用回调函数时的返回值,或者初始值)currentValue(当前正在处理的数组元素)currentIndex(当前正在处理的数组元素下标)array(调用reduce()方法的数组)initialValue(可选的初始值。作为第一次调用回调函数时传给previousValue的值)概念一搜一大把,我们聊点我遇到的和理解的,见代码callback//reduce作为累加器 let arr = [1, 2, 3, 4, 5] let sum = arr.reduce((init, item, i, self) => { console.log(init---${init}, item---${item}, i---${i}, self---${self}) return init + item }) console.log(sum) //15分别看一下回调参数 见下图init默认为数组第一项,一次累加数组项,最后返回一项。item循环数组每一项i数组下标self当前调用reduce数组本身initialValue可选初始值,作为回调函数第一个参数的默认值,也是每次回调的返回值,见代码 let obj = { ‘/home’: { meta: { title: ‘首页’ }, component: ‘@/page/home’ }, ‘/question’: { meta: { title: ‘问题’ }, component: ‘@/page/question’ } } // 转化为数组 let map = [{ path: ‘/home’, meta: { title: ‘首页’ }, component: ‘@/page/home’ }, { path: ‘/question’, meta: { title: ‘问题’ }, component: ‘@/page/question’ }] let map1 = Object.keys(obj).reduce((arr, item) => { return (arr.push({ path: item, …obj[item] }), arr) }, []) console.log(map1)转化后效果这个栗子来自vue配置路由时遇到的,当时也是优化了好几个版本。接下来详细解释一下Object.keys(obj) //把obj转化为内容为key的数组reduce((arr,item)=>{})//上边已经解释过参数了,回调后边的参数[]:返回值默认值是一个空数组关于 return (arr.push({ path: item, …obj[item] }), arr)其实可以写成 arr.push({ path: item, …obj[item] }) return arr 具体请查看:javascript逗号操作符别急还有一个用法新鲜刚发现的。 //需求:判断数组每一项的end和下一项的start是否是递增的,返回ture or false let arr = [{ start: 1, end: 3 }, { start: 1, end: 3 }, { start: 4, end: 5 }] function isTure(arr) { let status = true arr.reduce((pro, next) => { if (pro.end >= next.start) { status = false return false } return next }) return status } console.log(isTure(arr))这里我们巧用了 reduce的返回值,每次返回当前项,这样两个参数始终为1,2 | 2,3|3,4依次类推明天map和filter