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. angular懒加载

    生成module和routing.module文件 {//路径 path: 'InfectionFillInComponent', loadChildren: './component/his/inf ...

  2. 【面向对象设计原则】之单一职责原则(SRP)

    单一职责原则是面向对象原则五大原则中最简单,也是最重要的一个原则, 他的字面定义如下: 单一职责原则(Single Responsibility Principle, SRP): 一个类只负责一个功能 ...

  3. ArcFace虹软与Dlib人脸识别对比

    我司最近要做和人脸识别相关的产品,原来使用的是其他的在线平台,识别率和识别速度很满意,但是随着量起来的话,成本也是越来越不能接受(目前该功能我们是免费给用户使用的),而且一旦我们的设备掉线了就无法使用 ...

  4. Redis进阶学习笔记

    Redis是什么这里不用再说了吧?下面是官方的解释 Redis is an open source (BSD licensed), in-memory data structure store, us ...

  5. 数据库H2学习

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

  6. 删除网络中的本地连接*x等

    1.运行-regedit 打开注册表 定位到 HKEY_LOCAL_MACHINE SYSTEM CurrentControlSet Control Network {4D36E972-E325-11 ...

  7. 推荐六款炫酷的HTML5效果插件

    1. HTML5 3D图片阴影翻转动画 效果很酷 分享一款很酷的HTML5 3D动画特效,这款3D特效可以为你的图片增加阴影的效果,而且可以让图片在鼠标滑过的时候出现3D翻转的动画效果.这和HTML5 ...

  8. 聚类——GMM

    聚类——认识GMM算法 作者:凯鲁嘎吉 - 博客园 http://www.cnblogs.com/kailugaji/ 一.GMM概述 二.GMM算法步骤 三.具体推导参考文献 1. 李航. 统计学习 ...

  9. 【English】20190321

    Keep in mind记住[kip ɪn maɪnd]  maintenance维护[ˈmentənəns] Also Keep in mind that table maintenance use ...

  10. 重建二叉树[by Python]

    题目: 输入某二叉树的前序遍历和中序遍历的结果,请重建出该二叉树.假设输入的前序遍历和中序遍历的结果中都不含重复的数字.例如输入前序遍历序列{1,2,4,7,3,5,6,8}和中序遍历序列{4,7,2 ...