很久没有写博客了。日常的面向搜索引擎编程感觉自己都快废掉了。昨天公司开始执行为期1个半月的996了工作制度了,但是前端这边的活不是很多。那就从最基础的巩固一下自己吧。能想到的js方法能写多少写多少吧,不为了别人看就当给自己做个复习。屁话不多说第一个js方法reduce(),估计大多数跟我一样的一看到这个东西感觉熟悉的陌生,一脸懵逼。
1、官方的介绍是:此方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。理解起来真的是费死劲了,其实有一个方法跟他类似就是sort()方法,同样可以接受一个函数作为参数。区别就在于一个是用于排序,而这个是用来获得一个唯一的结果。
function sum(a,b){
return a+b
}
let arr=[23,55,6,8]
let result=arr.reduce(sum)
result 92
此方法在执行过程中会去调用数组中的每一项,
我们先看下reduce接受的函数的参数有哪些
(1)、必需。初始值, 或者计算结束后的返回值。
(2)、必需。当前元素
(3)、可选。当前元素的索引
(4)、可选。当前元素所属的数组对象。
2、这个方法可以用到那些场景呢:
(1)就是类似上面栗子中的累加
(2)帮我们扁平化一个数组
let arr=[[2,3],[4,5]].reduce(function(a,b){return a.concat(b)})
arr [2,3,4,5]
(3)一个高级的用法,都知道js对象的key值都是字符串的,ES6提供了Map结构。它类似于对象,也是键值对集合,但是”键”的范围不限于字符串,对象也可以当作键。我们如果想把js对象转变成map结构,这个方法也是可行的。如下所示
var map = [{
title: '学校名',
key: 'school_name'
},
{
title: '省',
key: 'province'
},
{
title: '市',
key: 'city'
},
{
title: '区',
key: 'area'
},
{
title: '班级数',
key: 'class_num'
}].reduce((ret, item) => (ret[item.title] = item.key) && ret, {})
var data = [{
"区":"海淀",
"学校名":"清华",
"市":"北京",
"班级数":"2",
"省":"无"
},{
"区":"海淀",
"学校名":"清华",
"市":"北京",
"班级数":"2",
"省":"无"
}]
var result = data.map(item => Object.keys(item).reduce((obj, e) => (obj[map[e]] = item[e]) && obj, {}))
result : [{area: "海淀", school_name: "清华", city: "北京", class_num: "2", province: "无"},{area: "海淀", school_name: "清华", city: "北京", class_num: "2", province: "无"}]