最近項目中後臺給返回的數據很複雜,須要各類遍歷,組合,其中Object.keys(obj)和經過封裝的groupBy這兩個方法帶給了我極大的便利數組
/* 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']
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'} ] }
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 將報錯。this
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; }, {}); }