近来项目中背景给返回的数据很庞杂,须要种种遍历,组合,个中Object.keys(obj)和经由过程封装的groupBy这两个要领带给了我极大的方便
Object.keys(obj)
/* Array 对象 */
let arr = ["a", "b", "c"];
console.log(Object.keys(arr));
// ['0', '1', '2']
/* Object 对象 */
let obj = { foo: "bar", baz: 42 },
console.log(Object.keys(obj));
// ["foo","baz"]
/* 类数组 对象 */
let obj = { 0 : "a", 1 : "b", 2 : "c"};
console.log(Object.keys(obj));
// ['0', '1', '2']
groupBy要领以及用到的reduce详解
Array.prototype.groupBy = function(prop) {
return this.reduce(function(groups, item) {
var val = item[prop];
groups[val] = groups[val] || [];
groups[val].push(item);
return groups;
}, {});
}
var myList = [
{time: '12:00', location: 'mall' },
{time: '9:00', location: 'store' },
{time: '9:00', location: 'mall' },
{time: '12:00', location: 'store' },
{time: '12:00', location: 'market' },
];
var byTime = myList.groupBy('time');
byTime = {
'9:00': [
{time: '9:00', location: 'store' },
{time: '9:00', location: 'mall' },
],
'12:00': [
{time: '12:00', location: 'mall' },
{time: '12:00', location: 'store' },
{time: '12:00', location: 'market'}
]
}
reduce
var total = [0, 1, 2, 3].reduce(function(sum, value) {
return sum + value;
}, 0);
// total is 6
var flattened = [[0, 1], [2, 3], [4, 5]].reduce(function(a, b) {
return a.concat(b);
}, []);
// flattened is [0, 1, 2, 3, 4, 5]
参数
callback
实行数组中每一个值的函数,包括四个参数:
accumulator
累加器累加回调的返回值; 它是上一次挪用回调时返回的积累值,或initialValue(以下所示)。
currentValue
数组中正在处置惩罚的元素。
currentIndex
数组中正在处置惩罚的当前元素的索引。假如供应了initialValue,则索引号为0,否则为索引为1。
array
挪用reduce的数组
initialValue
[可选] 用作第一个挪用 callback的第一个参数的值。假如没有供应初始值,则将运用数组中的第一个元素。 在没有初始值的空数组上挪用 reduce 将报错。
Array.prototype.groupBy = function(prop) {
return this.reduce(function(groups, item) {
var val = item[prop]; // 掏出time 比方 9:00
groups[val] = groups[val] || []; // 每一次掏出groups中的9:00对象,假如存在(掩盖一次),假如是12:00对象则赋值新数组
groups[val].push(item);
return groups;
}, {});
}