Array reduce() 方法  ,无非就是 计算数组元素 相加后的总和 ,看网上给的Demo 全是  [1,2,3,4,6].reduce 这种基本用法,

本次我将使用 reduce 实现 数组对象中 具体属性 Price 累加   [{ name: 'apple',  price: 10 }, {  name: 'banana',   price: 9  } ];

方法  Chorme IE  Firefox   Safari Opera 
reduce() Yes 9.0 3.0 4 10.5
参数 描述
function(total,currentValue, index,arr) 必需。用于执行每个数组元素的函数。
函数参数:

参数 描述
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
initialValue 可选。传递给函数的初始值

普通 for 实现  和 reduce 实现对比

    let array = [
{
name: 'apple',
price: 10
}, {
name: 'banana',
price: 9
}
]; let sumprice = 0;
for (let index = 0; index < array.length; index++) {
const element = array[index];
sumprice += element.price;
}
console.log('for example sumprice',sumprice); /*
reduce 语法实现
total 必需。初始值, 或者计算结束后的返回值。
currentValue 必需。当前元素
currentIndex 可选。当前元素的索引
arr 可选。当前元素所属的数组对象。
*/
sumprice = array.reduce(function (total, currentValue, currentIndex, arr) {
return total + currentValue.price;
}, 0);
console.log('for reduce sumprice',sumprice);

JS Array.reduce 对象属性累加的更多相关文章

  1. js delete删除对象属性,delete删除不了变量及原型链中的变量

    js delete删除对象属性,delete删除不了变量及原型链中的变量 一.delete删除对象属性 function fun(){ this.name = 'gg'; } var obj = ne ...

  2. 【学习笔记】六:面向对象的程序设计——理解JS中的对象属性、创建对象、JS中的继承

    ES中没有类的概念,这也使其对象和其他语言中的对象有所不同,ES中定义对象为:“无序属性的集合,其属性包含基本值.对象或者函数”.现在常用的创建单个对象的方法为对象字面量形式.在常见多个对象时,使用工 ...

  3. 前端程序员的蜕变——JS的 event 对象属性、使用实例、兼容性处理(极大提高代码效率、减少代码量)

    下面讨论一下 js 中的 Event 对象,主要从以下三个方面详细的描述(点击标题可跳转到对应部分): 1.什么是event 2.怎么用event,用他该注意什么,几个简单实际应用 3.event在不 ...

  4. JS/jQuery 遍历对象属性

    Javascript For/In 循环: 循环遍历对象的属性 var person={fname:"John",lname:"Doe",age:25}; fo ...

  5. js Array数组对象常见方法总结

    Array对象一般用来存储数据. 其常用的方法包括: 1.concat()方法 concat() 方法用于合并两个或多个数组.它不会更改现有数组,而是返回一个新数组. 例如: var arr1=[1, ...

  6. js 内置对象属性及方法

    1.Date 属性(1): constructor      所建立对象的函数参考 prototype       能够为对象加入的属性和方法 方法(43): getDay()        返回一周 ...

  7. js 实现图片预加载 (js操作 Image对象属性complete ,事件onload 异步加载图片)

    通过js操纵DOM很多情况下都是为了实现和当前页html元素的异步载入,我谈谈对Image对象的一些认识.看个例子:<input type="button" name=&qu ...

  8. js array数组对象操作方法汇总

    --------------------------更新自2018.6.11 js 数组对象操作方法如下: 1. 创建数组 var array1 = [1,2] //方法一 var array2 = ...

  9. js带“.”的对象属性名怎么使用

    问题:这样的json对象(event) { "title": "title", "alert":"ding", &quo ...

随机推荐

  1. laravel项目thinksns-plus安装出现RuntimeException Symlink from * to * failed错误

    今天xshell安装thinksns-plus的laravel项目时出现了一个错误, [RuntimeException] Symlink from "/root/www.z5w.net/t ...

  2. echarts饼图配置模板

    var option = { title:{ text:'完成人构成分析--申报', //标题的样式 textSytle:{ //颜色 color : '#FF0000', //粗细 // fontW ...

  3. iOS----------使用cocoapods遇到的问题

    -bash: /usr/local/bin/pod: /System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/ruby: bad ...

  4. python 生成图形验证码

    文章链接:https://mp.weixin.qq.com/s/LYUBRNallHcjnhJb1R3ZBg 日常在网站使用过程中经常遇到图形验证,今天准备自己做个图形验证码,这算是个简单的功能,也适 ...

  5. JVM远程调试功能

    有时候想调试线上的程序 可以启用远程调试功能 在本地调试远程代码. 远程JVM启用调试模式 /usr/local/jdk/bin/java -server -Xms256m -Xmx256m -XX: ...

  6. MySQL 基础知识梳理学习(四)----GTID

    在日常运维中,GTID带来的最方便的作用就是搭建和维护主从复制.GTID的主从模式代替了MySQL早期版本中利用二进制日志文件的名称和日志位置的做法,使用GTID使操作和维护都变得更加简洁和可高. 1 ...

  7. 数据库H2学习

    本文转载自:https://www.cnblogs.com/xdp-gacl/p/4171024.html 一.H2数据库介绍 常用的开源数据库有:H2,Derby,HSQLDB,MySQL,Post ...

  8. c/c++ 网络编程 UDP up/down 网卡

    网络编程 UDP up/down 网卡 在程序里动态改变网卡的状态.注意:程序运行需要root权限. 程序运行的方法: sudo ./a.out 1,关闭网卡 #include <stdio.h ...

  9. 如何解决分配到Autoconfiguration IPV4 地址

    配置完服务器静态IP后,在CMD窗口中查看ip地址,发现是Autoconfiguration IPV4. 上网搜索了,是关于虚拟服务器的,但是我没有配置虚拟服务器,有点奇怪. 使用下面的教程,可以解决 ...

  10. web Deploy发布问题

    使用vs开发的时候,经常会发布项目.传统发布是登陆远程桌面.或ftp这些发布都有一定的麻烦.不能灵活的管理发布的文件.因此后来研究了web Deploy,研究之后发现是很不错的发布工具.这里把我使用w ...