首页 > 解决方案 > javascript 在 for 循环中将对象推送到数组会更改前面的组件

问题描述

我每次都尝试推送不同的对象,但它会在循环 for 循环时更改前面的组件。这是我的代码。

let responseArray = [];

const sendBatchRequest = async function (response) {
    try {
        console.log(`response: ${JSON.stringify(response)}`);
        if (responseArray.length < 9) {
            responseArray.push(response); // push 9 components
            console.log(`responseArray at if: ${JSON.stringify(responseArray)}`);
        } else {
            responseArray.push(response); // push last 10th component
            console.log(`responseArray at else: ${JSON.stringify(responseArray)}`);
            for (let i = 0; i < responseArray.length; i++) {
                console.log(`responseArray ${i} - ${JSON.stringify(responseArray[i])}`);
            }
            // do something...
            responseArray = []; // reset the array
        }
    } catch (err) {
        console.log(`sendBatchRequest err: ${err}`);
    }
}

const main = async function () {
    try {
        const result = {};
        for (let i = 0; i < 5; i++) {
            result.data = i;
            await sendBatchRequest(result);
        }
    } catch (err) {
        console.log(`main err: ${err}`);
    }
}

main();

我的结果看起来像这样。

response: {"data":0}
responseArray at if: [{"data":0}]
response: {"data":1}
responseArray at if: [{"data":1},{"data":1}]
response: {"data":2}
responseArray at if: [{"data":2},{"data":2},{"data":2}]
response: {"data":3}
responseArray at if: [{"data":3},{"data":3},{"data":3},{"data":3}]
response: {"data":4}
responseArray at if: [{"data":4},{"data":4},{"data":4},{"data":4},{"data":4}]

我不明白为什么在第二个循环中,responseArray[0]更改{"data":0}{"data":1}. 我想要我的responseArray样子[{"data":0},{"data":1"},...]Array.push(object)javascript发生了什么?我怎样才能得到我想要的结果?

标签: javascriptarraysobject

解决方案


您每次都将相同的对象引用(而不是副本)推送到数组中。因此 for 循环的每次迭代都会修改该对象

改变:

    const result = {};
    for (let i = 0; i < 5; i++) {
        result.data = i;
        await sendBatchRequest(result);
    }

    for (let i = 0; i < 5; i++) {
        // new object each iteration
        const result = {data : i};            
        await sendBatchRequest(result);
    }

推荐阅读