如何将这些数据合并到一个对象中？

Question

这是一个棘手的问题。

所以，假设我有两个通过 REST 调用获取的 JS 对象，通过两个回调。

所以，我们有：

call1() - POST 方法 - 将 JSON 解析为 JS 对象，路由：{{url}}/data

call1.json：

 "data": [
            { 
                "id": "1",
                "volume:" "2000"
            }, 
            { 
                "id": "2",
                "volume:" "3000"
            }, 
            { 
                "id": "3",
                "volume:" "4000"
            }, 
            { 
                "id": "4",
                "volume:" "5000"
            }
       ];

call2(req.body.id) - GET 方法 - 将 JSON 解析为 JS 对象，路由：{{url}}/data/:id

例如，如果我将 req.body.id 传递为 = 1 从第一个响应中获得，它将打开该 id 的数据。所以：

return call2(2) 将从这个 JSON 中返回数据：call2.json:

"data": [
            { 
                "id": "1",
                "add_data": "important string",
                "add_data_2": "important string two"
            }, 
       ];

底线是，在进行{{url}}/data 路由调用时-call() 我需要提供来自{{url}}/data/:id 路由的所有数据，并将它们绑定到正确的id。因此，例如，我想要实现的场景是这样的：

在call() 内部：获取call1.json: 数据，在第一个对象中执行与ids 一样多的call2(req.body.id) 调用，然后在第一个对象中组合add_data 和add_data_two 值。例如，最终的对象应该是这样的。

console.log(response)

"data": [
                { 
                    "id": "1",
                    "volume:" "2000",
                    "add_data": "important string",
                    "add_data_2": "important string two"
                }, 
                { 
                    "id": "2",
                    "volume:" "3000",
                    "add_data": "important string",
                    "add_data_2": "important string two"
                }, 
                { 
                    "id": "3",
                    "volume:" "4000",
                    "add_data": "important string",
                    "add_data_2": "important string two"
                }, 
                { 
                    "id": "4",
                    "volume:" "5000",
                    "add_data": "important string",
                    "add_data_2": "important string two"
                }
           ];

这是我迄今为止尝试过的：

async get_data(req) {
        try {
            const objFirst = await call1(); //gets data
            let objTwo = '';

            for (let i = 0; i < objFirst.data.length; i++) {
                objTwo = await call2({id: objFirst.data[i].id}) //gets data
            }
            return objFirst;
        } catch(err) {
            console.log("Error: ", err)
        }
    }

但它不起作用。如何获取所有数据，并制作与 ids 一样多的 call2(id) 并将它们组合到一个对象中？基本上，我需要 repeat 这个回调 -> call2(id) 我们在 call1() 中收到的 ids。

谢谢，如果看起来一团糟，请见谅。

Answer 1

您可以为此使用 map 函数和扩展运算符。像下面的东西。 Call2 函数只是模拟端点将返回的内容，但您明白了。

var data = [
    {
        id: 1,
        add_data: "1111"
    },
    {
        id: 2,
        add_data: "2222"
    }
];

var data2 = [
    {
        id: 1,
        volume: "bla"
    },
    {
        id: 2,
        volume: "bla"
    }
];

function call2(id) {
    return data2.filter(x => x.id == id)[0];
}

var result = data.map(x => {
    var response = call2(x.id);
    return {
        ...x,
        ...response       
    }
})

console.dir(result[0]);

您的解决方案的速度（通过数组循环并执行 http 调用以获取更多数据确实很慢）。如果您有很多这些功能需要组合来自不同数据源的数据，并且根据您的项目大小，我会考虑 RXJS 或 GraphQL（如果您真的需要性能）。 RXJS 具有强大的合并、合并、映射等数据的功能。

RXJS

GraphQL