js Array.prototype.reduce()
例子:
const array1 = [, , , ];
const reducer = (accumulator, currentValue) => accumulator + currentValue; // 1 + 2 + 3 + 4
console.log(array1.reduce(reducer));
// expected output: 10 // 5 + 1 + 2 + 3 + 4
console.log(array1.reduce(reducer, ));
// expected output: 15
reducer 函数接收4个参数:
- Accumulator (acc) (累计器)
- Current Value (cur) (当前值)
- Current Index (idx) (当前索引)
- Source Array (src) (源数组)
您的 reducer 函数的返回值分配给累计器,该返回值在数组的每个迭代中被记住,并最后成为最终的单个结果值。
例子
数组里所有值的和
函数表示伐:
var sum = [, , , ].reduce(function (accumulator, currentValue) {
return accumulator + currentValue;
}, );console.log(sum)
你也可以写成箭头函数的形式:
var total = [ , , , ].reduce(
( acc, cur ) => acc + cur, );
console.log(total);
累加对象数组里的值
要累加对象数组中包含的值,必须提供初始值,以便各个item正确通过你的函数。
var initialValue = ;
var sum = [{x: }, {x:}, {x:}].reduce(function (accumulator, currentValue) {
return accumulator + currentValue.x;
},initialValue) console.log(sum) // logs 6
你也可以写成箭头函数的形式
var initialValue = ;
var sum = [{x: }, {x:}, {x:}].reduce(
(accumulator, currentValue) => accumulator + currentValue.x
,initialValue
); console.log(sum)
将二维数组转化为一维
var flattened = [[, ], [, ], [, ]].reduce(
function(a, b) {
return a.concat(b);
},
[]
);
// flattened is [0, 1, 2, 3, 4, 5]
你也可以写成箭头函数的形式
var flattened = [[, ], [, ], [, ]].reduce(
( acc, cur ) => acc.concat(cur),
[]
);
计算数组中每个元素出现的次数
var names = ['Alice', 'Bob', 'Tiff', 'Bruce', 'Alice']; var countedNames = names.reduce(function (allNames, name) {
if (name in allNames) {
allNames[name]++;
}
else {
allNames[name] = ;
}
return allNames;
}, {});
// countedNames is:
// { 'Alice': 2, 'Bob': 1, 'Tiff': 1, 'Bruce': 1 }
按属性对object分类
var people = [
{ name: 'Alice', age: },
{ name: 'Max', age: },
{ name: 'Jane', age: }
]; function groupBy(objectArray, property) {
return objectArray.reduce(function (acc, obj) {
var key = obj[property];
if (!acc[key]) {
acc[key] = [];
}
acc[key].push(obj);
return acc;
}, {});
} var groupedPeople = groupBy(people, 'age');
// groupedPeople is:
// {
// 20: [
// { name: 'Max', age: 20 },
// { name: 'Jane', age: 20 }
// ],
// 21: [{ name: 'Alice', age: 21 }]
// }
使用扩展运算符和initialValue绑定包含在对象数组中的数组
// friends - 对象数组
// where object field "books" - list of favorite books
var friends = [{
name: 'Anna',
books: ['Bible', 'Harry Potter'],
age:
}, {
name: 'Bob',
books: ['War and peace', 'Romeo and Juliet'],
age:
}, {
name: 'Alice',
books: ['The Lord of the Rings', 'The Shining'],
age:
}]; // allbooks - list which will contain all friends' books +
// additional list contained in initialValue
var allbooks = friends.reduce(function(prev, curr) {
return [...prev, ...curr.books];
}, ['Alphabet']); // allbooks = [
// 'Alphabet', 'Bible', 'Harry Potter', 'War and peace',
// 'Romeo and Juliet', 'The Lord of the Rings',
// 'The Shining'
// ]
数组去重
let arr = [,,,,,,,,,,,,];
let result = arr.sort().reduce((init, current)=>{
if(init.length=== || init[init.length-]!==current){
init.push(current);
}
return init;
}, []);
console.log(result); //[1,2,3,4,5]
按顺序运行Promise
/**
* Runs promises from array of functions that can return promises
* in chained manner
*
* @param {array} arr - promise arr
* @return {Object} promise object
*/
function runPromiseInSequence(arr, input) {
return arr.reduce(
(promiseChain, currentFunction) => promiseChain.then(currentFunction),
Promise.resolve(input)
);
} // promise function 1
function p1(a) {
return new Promise((resolve, reject) => {
resolve(a * );
});
} // promise function 2
function p2(a) {
return new Promise((resolve, reject) => {
resolve(a * );
});
} // function 3 - will be wrapped in a resolved promise by .then()
function f3(a) {
return a * ;
} // promise function 4
function p4(a) {
return new Promise((resolve, reject) => {
resolve(a * );
});
} const promiseArr = [p1, p2, f3, p4];
runPromiseInSequence(promiseArr, )
.then(console.log); //
功能型函数管道
// Building-blocks to use for composition
const double = x => x + x;
const triple = x => * x;
const quadruple = x => * x; // Function composition enabling pipe functionality
const pipe = (...functions) => input => functions.reduce(
(acc, fn) => fn(acc),
input
); // Composed functions for multiplication of specific values
const multiply6 = pipe(double, triple);
const multiply9 = pipe(triple, triple);
const multiply16 = pipe(quadruple, quadruple);
const multiply24 = pipe(double, triple, quadruple); // Usage
multiply6(); //
multiply9(); //
multiply16(); //
multiply24(); //
Polyfill
// Production steps of ECMA-262, Edition 5, 15.4.4.21
// Reference: http://es5.github.io/#x15.4.4.21
// https://tc39.github.io/ecma262/#sec-array.prototype.reduce
if (!Array.prototype.reduce) {
Object.defineProperty(Array.prototype, 'reduce', {
value: function(callback /*, initialValue*/) {
if (this === null) {
throw new TypeError( 'Array.prototype.reduce ' +
'called on null or undefined' );
}
if (typeof callback !== 'function') {
throw new TypeError( callback +
' is not a function');
} // 1. Let O be ? ToObject(this value).
var o = Object(this); // 2. Let len be ? ToLength(? Get(O, "length")).
var len = o.length >>> ; // Steps 3, 4, 5, 6, 7
var k = ;
var value; if (arguments.length >= ) {
value = arguments[];
} else {
while (k < len && !(k in o)) {
k++;
} // 3. If len is 0 and initialValue is not present,
// throw a TypeError exception.
if (k >= len) {
throw new TypeError( 'Reduce of empty array ' +
'with no initial value' );
}
value = o[k++];
} // 8. Repeat, while k < len
while (k < len) {
// a. Let Pk be ! ToString(k).
// b. Let kPresent be ? HasProperty(O, Pk).
// c. If kPresent is true, then
// i. Let kValue be ? Get(O, Pk).
// ii. Let accumulator be ? Call(
// callbackfn, undefined,
// « accumulator, kValue, k, O »).
if (k in o) {
value = callback(value, o[k], k, o);
} // d. Increase k by 1.
k++;
} // 9. Return accumulator.
return value;
}
});
}
js Array.prototype.reduce()的更多相关文章
- Array.prototype.reduce()
reduce() 方法接收一个函数作为累加器(accumulator),数组中的每个值(从左到右)开始缩减,最终为一个值. arr.reduce([callback, initialValue]) c ...
- Array.prototype.reduce 的理解与实现
Array.prototype.reduce 是 JavaScript 中比较实用的一个函数,但是很多人都没有使用过它,因为 reduce 能做的事情其实 forEach 或者 map 函数也能做,而 ...
- [JavaScript] Array.prototype.reduce in JavaScript by example
Let's take a closer look at using Javascript's built in Array reduce function. Reduce is deceptively ...
- js Array.prototype.slice.call(arguments,0) 理解
Array.prototype.slice.call(arguments,0) 经常会看到这段代码用来处理函数的参数 网上很多复制粘帖说:Array.prototype.slice.call(argu ...
- 【笔记】js Array.prototype.slice.call(arguments) 将函数的参数转换为数组方法的见解
我们知道函数里面的参数实际上是一个以数组形式储存的对象 但它并非一个数组 如果我们要将它转换为数组可以调用Array.prototype.slice() 这个方法 分析一下这个方法: Array.pr ...
- js Array.prototype.join.call(arguments,",") 理解
prototype 属性使您有能力向对象添加属性和方法. join() 方法:把数组的所有元素放入一个字符串.元素通过指定的分隔符进行分隔. call() 方法可以用来代替另一个对象调用一个方法. A ...
- 数组的方法之(Array.prototype.reduce() 方法)
reduce函数 reduce() 方法对累加器和数组中的每个元素(从左到右)应用一个函数,将其减少为单个值. 对数组中的所有元素调用指定的回调函数.该回调函数的返回值为累积结果,并且此返回值在下一次 ...
- JS - Array.prototype.sort(compare)
function compare(a, b) { return -1; // a 在 b 前面 return 1; // a 在 b 后面 return 0; // 并列排序,保持在源数组中的先后顺序 ...
- JS Array常用方法indexOf/filter/forEach/map/reduce详解
Array共有九个方法 Array.prototype.indexOf Array.prototype.lastIndexOf Array.prototype.every Array.protot ...
随机推荐
- java学习(一)--- 基础语法
学习内容来 自菜鸟教程 http://www.runoob.com/java/java-object-classes.html Java基础 Java:一个Java程序可以认为是一系列的对象组合, ...
- mysql InnoDB锁等待的查看及分析
说明:前面已经了解了InnoDB关于在出现锁等待的时候,会根据参数innodb_lock_wait_timeout的配置,判断是否需要进行timeout的操作,本文档介绍在出现锁等待时候的查看及分析处 ...
- NodePort 只能在node节点上访问,外部无法访问
创建了一个NodePort类型的jenkins service,node port 30000,node节点ip为192.168.56.101, 在node节点上通过浏览器能正常访问http://19 ...
- C++/C面试题
(1) 按位运算只适用于字符型和整数型变量以及它们的变体,对其他数据类型不适用: (2) 一般在打开网页时,需要在浏览器中输入网址,因此,需要通过网址找到访问资源的 IP 地址,从而可以把请求发送到对 ...
- Mybatis 使用了哪些设计模式?
https://mp.weixin.qq.com/s/ZTh4a-YST5RdIipHykWpPQ
- [人工智能] 安装python jupyter
1. 什么是python jupyter ? 简单的说,可以理解为一个IDE. http://jupyter.org/ 2. 安装python jupyter notebook http://ju ...
- mysql 时间戳的使用!
时间转时间戳方法: unix_timestamp() 记录时间戳的类型: bigint 时间戳转时间的方法:from_timestamp() 感谢水哥给的截图!
- npm install的时候出现unexpected end of file错误提示时的解决办法
运行npm cache clean --force 清空npm缓存即可决这个问题 参考:https://blog.csdn.net/jingtian678/article/details/811876 ...
- 减小ipa包大小
1.删除不用的文件和图片 2.打release模式 3.色调单一图片采用8-bit的,对32-bit的图片采用压缩 4.对音视频采用aac压缩
- 【Go语言】基本的语法
昨天花了几个小时的时间把Go的语法过了一遍,发现Go语言的语法核心和大部分编程语言的规则还是挺相近的,差别的就是不同的书写规范.还有就是前天安装VScode编译器那个插件把人弄得恶心了,总是安装不成功 ...