数组中元素累加 reduce
例:
<!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>
数组中元素累加 reduce的更多相关文章
- javascript中获取字符串或数组中元素的索引
有些时候,我们需要知道一个字符串中字符的位置,或者一个数组中元素的位置,这是就需要对该变量进行迭代操作. 对于数组,有两个方法indexOf和findIndex() , 需要注意的是,findInde ...
- js删除数组中元素 delete 和splice的区别
例如我有一个数组: var array = ["aa","dd","cc","aa"] ,我想删除这个数组的“dd”元素 ...
- 如何解决jersey框架中以json格式返回数组,当数组中元素一个时json格式不对
原文地址:http://www.cnblogs.com/swpk/p/3566536.html?utm_source=tuicool jersey 是oracle 出的一个较好的REST框架.使用此框 ...
- js删除数组中元素的方法
一.清空数组 var ary = [1,2,3,4]; ary.splice(0,ary.length);//清空数组 console.log(ary); // 输出 [],空数组,即被清空了 二.删 ...
- 使用Arraylist将数组中元素随机均等乱序分为N个子数组
使用Arraylist将数组中元素随机均等乱序分为N个子数组 觉得有用的话,欢迎一起讨论相互学习~Follow Me 为了将数组中的元素 随机地 ,均等地, 不重复地 ,划分到N个子数组中 使用Arr ...
- 根据Bool值挑选数组中元素
根据Bool值挑选数组中元素 觉得有用的话,欢迎一起讨论相互学习~Follow Me 使用Boolean类型的数组挑选一维数组中的值 使用一维Boolean数组选取数组中的特定元素,对应位置为True ...
- JavaScript Array reverse 方法:颠倒数组中元素的顺序
在JavaScript中,Array对象的reverse()方法将颠倒(反转)数组中元素的顺序.arr.reverse()在原数组上实现这一功能,即,reverse()会改变原数组. 例1:将数组元素 ...
- 黑马基础阶段测试题:定义一个int类型的数组,数组中元素为{5,7,3,9,4}。求出数组中的最小值,并判断最小值是否为偶数,如果是偶数则输出“最小值为偶数”,如果不是偶数则输出“最小值为奇数”。打印如下:
package com.swift; import java.util.Arrays; public class ArrayTest { public static void main(String[ ...
- JS中split使用方法和数组中元素的删除
JS中split使用方法和数组中元素的删除 JS中split使用方法 <script language="javascript"> function spli(){ d ...
随机推荐
- 002_pip安装失败
一.安装cmdb的驱动遇到了如下问题 [root@localhost 003_pyenv]# pip2.7 install cmdb_sdk==0.3.1 -i http://cmdb.elenet. ...
- Python 包内的导入问题(绝对导入和相对导入)
基本概念 Python 中的包,即包含 __init__.py 文件的文件夹. 对于 Python 的包内导入,即包内模块导入包内模块,存在绝对导入和相对导入问题. 普通 Python 模块的搜索路径 ...
- 记一次layui弹框关闭问题
我在博客园记录过layui关于弹框关闭问题,文章为layui关闭弹出层,这次出现了特殊情况,之前是通过layer.closeAll()解决了这个问题,但是这次解决不了.而换成parent.layer. ...
- Could not get a resource from the pool 错误解决
错误关键信息:Could not get a resource from the pool 通常原因是因为远程服务器上的redis没有配置好. 解决方案如下:(1)将redis.conf中的bind: ...
- echart自定义浮窗 增加点击事件
一:情景 做一个柱状图,需要在柱状图显示lable,并且浮窗上每个条目可以被点击或者跳转. 我使用的做图插件是echarts,但是echart的浮窗是图片,而且不可以被点击,不能识别html,而且这个 ...
- 20175329 2018-2019-3《Java程序设计》第三周学习总结
学号 20175329 2018-2019-3<Java程序设计>第三周学习总结 教材学习内容总结 第四章 第四章主要介绍JAVA中的类与对象的划分,其中有很多复杂的概念以及知识点需要花很 ...
- 【redis】1.redis-windows安装+配置介绍
1.下载windows版本redis 官方下载地址:http://redis.io/download,不过官方没有64位的Windows下的可执行程序,目前有个开源的托管在github上, 地址:ht ...
- 【译】参考手册-React组件
react version: 15.4.2 React.Component 组件能够让你将UI拆分为多个独立自治并可重用的部分.在 React 中提供了 React.Component. 概述 Rea ...
- Gradle构建工具从入门到精通(IDEA)
1.Gradle安装 官网下载压缩包,然后解压,配置本地环境变量.主要有下面两个: GRADLE_HOME 是解压后的目录, GRADLE_USER_HOME 的作用是让其他程序检测到本地.gradl ...
- NuGet的本地服务器安装与Package的发布(呕吐)
主要的步骤是按照下面的例子来做的: NuGet学习笔记(1)——初识NuGet及快速安装使用 NuGet学习笔记(2)——使用图形化界面打包自己的类库 NuGet学习笔记(3)——搭建属于自己的NuG ...