JavaScript reduce方法返回异常值的问题求助

异常原因分析 #

1. reduce未设置初始值导致类型错误 #

调用reduce()时如果不传入第二个参数（初始累加值），JavaScript会默认把数组的第一个元素作为累加器的初始值。你的数组第一个元素是一个对象{Id: "1", Medio: "Datafono", ...}，所以第一次迭代时dif是这个对象而非数字0。

对象与数字相加会触发隐式类型转换：对象先被转为字符串"[object Object]"，再和数字的字符串形式拼接，比如"[object Object]" + 6000.00会得到"[object Object]6000"，后续继续拼接其他数字的字符串形式，就出现了你看到的[object Object]16500000这类结果。

2. 小数点消失的原因 #

当带有.00的数字（如6000.00、0.00）被转为字符串时，末尾的.00会被自动省略，直接变成"6000"、"0"，因此拼接后看不到小数点。

解决方法 #

在reduce()的第二个参数位置传入初始值0，确保累加器从数字类型开始计算：

determinarBalance: function (balance) {
    var cobranzasModel = this.getView().getModel("CobranzasSet"),
        data = this.getView().getModel("CobranzasSet").getData();

    let difML = data.Totales.reduce(function (dif, c) {
        return dif + c.diferenciaML
    }, 0) // 添加初始值0
    let difGr = data.Totales.reduce(function (dif, c) {
        return dif + c.diferenciaGr
    }, 0) // 添加初始值0

    console.log(difML); // 输出171000.00
    console.log(difGr); // 输出0.00

    return (balance);
},

内容的提问来源于stack exchange，提问作者Tincho