从循环中的值创建一个新数组，然后对新数组中的所有值求和答案

【问题标题】：Create a new array from values in a loop, then sum all values from new array从循环中的值创建一个新数组，然后对新数组中的所有值求和
【发布时间】：2019-05-21 16:21:56
【问题描述】：

我有一个包含多行的表单，用户可以在其中输入数字并计算输出。

我目前可以计算每一行的输出 - 小计。但希望能够计算所有小计 - 总计。

我能够将每个小计记录到控制台，但无法弄清楚如何对这些值求和。阅读了一些类似的问题后，我认为我需要创建一个值数组并对这些值求和。

这可以使用我当前使用的循环吗？

这是我目前拥有的：

const rows = document.querySelectorAll('.row');
const calculate = document.querySelector('.calculate');
const output = document.querySelector('.output');

// Calculate

function calculateSubTotal() {

  rows.forEach(function(row, index){
    const input1Val = Number(row.querySelector('.input-1').value);
    const input2Val = Number(row.querySelector('.input-2').value);

    const subTotal = input1Val + input2Val;

    console.log(subTotal);
  });

}

calculate.addEventListener('click', calculateSubTotal);

这是一支笔：https://codepen.io/abbasarezoo/pen/WBXjWO?editors=1111

【问题讨论】：

标签： javascript arrays loops foreach sum

【解决方案1】：

在forEach外部声明一个变量，在forEach内部增加一个变量

function calculateSubTotal() {
  let total = 0;
  rows.forEach(function(row, index){
    const input1Val = Number(row.querySelector('.input-1').value);
    const input2Val = Number(row.querySelector('.input-2').value);

    const subTotal = input1Val + input2Val;

    console.log(subTotal);
    total += subTotal 
  });

}

使用reduce() 和map() 的代码的简化版本将是

function calculateSubTotal() {
  let total = 0;
  let subTotals = rows.map(x => +x.querySelector('.input-1').value + +x.querySelector('.input-2').value)
  let total = subTotals.reduce((ac,a) => ac + a,0)
}

【讨论】：