根据条件求和列制表符

Question

我正在尝试对具有特定条件的制表符中的列值求和并遵循此自定义计算功能

到目前为止我尝试过的是：

 $(document).ready(function() { function getSum(total, num) { return total + num; } var adultCalc = function(values, data, calcParams) { var tempvalue = []; data.forEach(function(data) { var count = data.age * data.qty; tempvalue.push(count); }); console.log('array', tempvalue); console.log('total', tempvalue.reduce(getSum)); /*return tempvalue;*/ } var tabledata = [{ id: 1, name: "Oli Bob", age: "12", qty: "1", dob: "" }, { id: 3, name: "Christine Lobowski", age: "42", qty: "1", dob: "22/05/1982" }, { id: 4, name: "Brendon Philips", age: "35", qty: "2", dob: "01/08/1980" }, { id: 5, name: "Margret Marmajuke", age: "16", qty: "0", dob: "31/01/1999" }, { id: 5, name: "Marmajuke", age: "17", qty: "0", dob: "31/01/1999" }, { id: 4, name: "Philips", age: "27", qty: "0", dob: "01/08/1980" } ]; var table = new Tabulator("#example-table", { height: 205, data: tabledata, layout: "fitColumns", columns: [{ title: "Name", field: "name", width: 150 }, { title: "Age", field: "age", bottomCalc: adultCalc }, { title: "Qty", field: "qty" }, { title: "Date Of Birth", field: "dob", sorter: "date", align: "center" } ] }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://unpkg.com/tabulator-tables@4.1.4/dist/css/tabulator.min.css" rel="stylesheet"> <script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.1.4/dist/js/tabulator.min.js"></script> <div id="example-table"></div> 

我的公式是： age * qty将其推入数组并总计。

我成功地获得了想要的值并将其推入数组，但是问题是我无法使用array reduce函数对数组求和。

我得到这个错误

TypeError：减少没有初始值的空数组

我的问题只是获得数组的总和。

有人可以告诉我我的代码有什么问题吗？

谢谢。

Answer 1

您需要提供初始值以减少

console.log('total', tempvalue.reduce(getSum,0));

第一次使用reduce时，您有一个空数组，这导致reduce产生错误。 您可以传递初始值，它应该可以按预期工作。

注意：如果未提供initialValue，则reduce（）将从索引1开始执行回调函数，并跳过第一个索引。 如果提供了initialValue，它将从索引0开始。

 $(document).ready(function() { function getSum(total, num) { return total + num; } var adultCalc = function(values, data, calcParams) { var tempvalue = []; data.forEach(function(data) { var count = data.age * data.qty; tempvalue.push(count); }); console.log('array', tempvalue); console.log('total', tempvalue.reduce(getSum,0)); /*return tempvalue;*/ } var tabledata = [{ id: 1, name: "Oli Bob", age: "12", qty: "1", dob: "" }, { id: 3, name: "Christine Lobowski", age: "42", qty: "1", dob: "22/05/1982" }, { id: 4, name: "Brendon Philips", age: "35", qty: "2", dob: "01/08/1980" }, { id: 5, name: "Margret Marmajuke", age: "16", qty: "0", dob: "31/01/1999" }, { id: 5, name: "Marmajuke", age: "17", qty: "0", dob: "31/01/1999" }, { id: 4, name: "Philips", age: "27", qty: "0", dob: "01/08/1980" } ]; var table = new Tabulator("#example-table", { height: 205, data: tabledata, layout: "fitColumns", columns: [{ title: "Name", field: "name", width: 150 }, { title: "Age", field: "age", bottomCalc: adultCalc }, { title: "Qty", field: "qty" }, { title: "Date Of Birth", field: "dob", sorter: "date", align: "center" } ] }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://unpkg.com/tabulator-tables@4.1.4/dist/css/tabulator.min.css" rel="stylesheet"> <script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.1.4/dist/js/tabulator.min.js"></script> <div id="example-table"></div> 

Answer 2

可以更轻松地完成。 并且不要忘记Array.reduce方法的第二个参数（初始值）。

 $(document).ready(function() { function getSum(total, num) { return total + num; } var adultCalc = function(values, data, calcParams) { return data.map(function(d) { return d.age * d.qty; }) .reduce(getSum, 0); } //or even in ES6 style const qtyCalc = (values, data, calcParams) => data.map(d => d.age * d.qty) .reduce((t, n) => t + n * 2, 0); var tabledata = [{ id: 1, name: "Oli Bob", age: "12", qty: "1", dob: "" }, { id: 3, name: "Christine Lobowski", age: "42", qty: "1", dob: "22/05/1982" }, { id: 4, name: "Brendon Philips", age: "35", qty: "2", dob: "01/08/1980" }, { id: 5, name: "Margret Marmajuke", age: "16", qty: "0", dob: "31/01/1999" }, { id: 5, name: "Marmajuke", age: "17", qty: "0", dob: "31/01/1999" }, { id: 4, name: "Philips", age: "27", qty: "0", dob: "01/08/1980" } ]; var table = new Tabulator("#example-table", { height: 205, data: tabledata, layout: "fitColumns", columns: [{ title: "Name", field: "name", width: 150 }, { title: "Age", field: "age", bottomCalc: adultCalc }, { title: "Qty", field: "qty", bottomCalc: qtyCalc }, { title: "Date Of Birth", field: "dob", sorter: "date", align: "center" } ] }); }); 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <link href="https://unpkg.com/tabulator-tables@4.1.4/dist/css/tabulator.min.css" rel="stylesheet"> <script type="text/javascript" src="https://unpkg.com/tabulator-tables@4.1.4/dist/js/tabulator.min.js"></script> <div id="example-table"></div>