JavaScript中如何解决函数返回值累加全局变量值不变的问题

问题根源 #

JavaScript中原始类型（数字、字符串、布尔值等）是按值传递的，调用addObjValue(myArr, sum)时，仅把全局变量sum的值0拷贝给了函数形参total，后续函数内部对total的所有修改都只会作用在这个局部副本上，不会影响外部的全局sum变量。

解决方法 #

方法1：函数返回计算结果，手动赋值给全局sum（最推荐） #

无副作用，函数复用性更高，修改后代码如下：

let sum = 0;
const myArr = [{name: 'dj', value: '2'}, {name: 'kd', value: '3'}];

function addObjValue(arr, total) {
    arr.forEach(element => {
        const val = element.value;
        total += checkObjValue(val);
        console.log(total);
    })
    // 新增返回累加结果
    return total;
}

function checkObjValue(x) {
    switch(x) {
        case '2':
            return 1;
            break;
        case '3':
            return 5;
            break;
    }
}

// 调用时把返回值赋值给全局sum
sum = addObjValue(myArr, sum); 

方法2：直接在函数内部操作全局sum变量 #

不需要把sum作为参数传入，函数内部直接读取修改全局的sum：

let sum = 0;
const myArr = [{name: 'dj', value: '2'}, {name: 'kd', value: '3'}];

// 去掉total形参
function addObjValue(arr) {
    arr.forEach(element => {
        const val = element.value;
        // 直接修改全局sum
        sum += checkObjValue(val);
        console.log(sum);
    })
}

function checkObjValue(x) {
    switch(x) {
        case '2':
            return 1;
            break;
        case '3':
            return 5;
            break;
    }
}

addObjValue(myArr);

方法3：用引用类型包裹数值（仅作原理演示，不推荐） #

对象是按引用传递的，把sum存在对象中，传对象进入函数修改内部属性就会同步到外部：

// 把sum存在对象里
let sumObj = { value: 0 };
const myArr = [{name: 'dj', value: '2'}, {name: 'kd', value: '3'}];

function addObjValue(arr, totalObj) {
    arr.forEach(element => {
        const val = element.value;
        totalObj.value += checkObjValue(val);
        console.log(totalObj.value);
    })
}

function checkObjValue(x) {
    switch(x) {
        case '2':
            return 1;
            break;
        case '3':
            return 5;
            break;
    }
}

addObjValue(myArr, sumObj);

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