标签:function 元素 reduce 累加 num 数组 total
例:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> </head> <body> <p> [65,14,22,5] </p> <button onclick="myFunction()">求和</button> <div id="demo"> </div> <script> var numbers=[65,14,22,5]; function getSum(total,num){ return total+num; } function myFunction(item){ document.getElementById('demo').innerHTML=numbers.reduce(getSum); } </script> </body> </html>
reduce()方法接收一个函数作为累加器,数组中的每个值(从左到右)开始缩减,最终计算为一个值。
reduce()方法可以作为一个高阶函数,用于函数的compose。
注意:reduce()方法对于空数组是不会执行回调函数的。
语法:
array.reduce( function( total , currentValue , currentIndex , arr) , initialValue)
参数:
function( total, currentValue, currentIndex, arr) 必需。用于执行每个数组元素的函数。
函数参数:
total:必需。初始值,或者计算结束后的返回值。
currentValue:必需。当前元素
currentIndex:可选。当前元素的索引
arr:可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值。
例:
四舍五入后计算数组元素的总和:
<!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Page Title</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="text/css" media="screen" href="main.css" /> <script src="main.js"></script> </head> <body> <p> [15.5,2.3,1.1,4.7] </p> <button onclick="myFunction()">点我</button> <p>数组元素之和:<span id="demo"></span></p> <script> var numbers=[15.5,2.3,1.1,4.7]; function getSum(total,num){ return total+Math.round(num); } function myFunction(item){ document.getElementById("demo").innerHTML=numbers.reduce(getSum,0); } </script> </body> </html>
标签:function,元素,reduce,累加,num,数组,total 来源: https://www.cnblogs.com/em2464/p/10361036.html
本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享; 2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关; 3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关; 4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除; 5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。