如何將嵌套的JSON數據結構減少為映射JavaScript

Question

我已經用循環實現了下面問題的解決方案，但我確信有更好的方法。 考慮這個數據結構：

let arr = [
    {
        "id": "000701",
        "status": "No Source Info",
        "sources": []
    },
    {
        "id": "200101",
        "status": "Good",
        "sources": [
            {
                "center": "H2",
                "uri": "237.0.1.133",
                "program": 1,
                "status": "Good",
                "state": {
                    "authState": "authorized",
                    "lockState": "locked"
                }
            }
        ]
    },
    {
        "id": "005306",
        "status": "Good",
        "sources": [
            {
                "center": "H1",
                "uri": "237.0.6.5",
                "program": 3,
                "status": "Good",
                "state": {
                    "authState": "authorized",
                    "lockState": "locked"
                }
            },
            {
                "center": "H1",
                "uri": "237.0.6.25",
                "program": 3,
                "status": "Good",
                "state": {
                    "authState": "authorized",
                    "lockState": "locked"
                }
            }
        ]
    }
]

我想學習一種最有效的方法，將它減少到一個映射，只使用來自sources數組的嵌套uri和state值的鍵值對。 最終結果應如下所示：

let stateMap = {
    "237.0.1.133": { "authState": "authorized", "lockState": "locked" },
    "237.0.6.5": { "authState": "authorized", "lockState": "locked" },
    "237.0.6.25": { "authState": "authorized", "lockState": "locked" } 
}

我有一個部分解決方案，返回每個source數組的映射，但我很難將它全部集成到一個結構中。

let allStates = arr.reduce((acc, object) => {
    if (object.sources.length) {
        let sourceMap = object.sources.reduce((map, obj) => {
            map[obj.uri] = obj.state
            return map
        }, {})
        acc[acc.length] = sourceMap
        return acc
    }
    // delete all unused keys and somehow flatten the objects?
}, {})

遞歸是一個選項在這里或什么是更好的方法？

Answer 1

下面的代碼首先對嵌套的sources數組執行flatMap操作，然后將所有內容減少到所需的結果對象：

const result = arr.reduce((a, {sources}) => [...a, ...sources], [])
                  .reduce((a, {uri, state}) => ({...a, [uri]: state}), {});

完整代碼段：

 const arr = [{ "id": "000701", "status": "No Source Info", "sources": [] }, { "id": "200101", "status": "Good", "sources": [{ "center": "H2", "uri": "237.0.1.133", "program": 1, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } }] }, { "id": "005306", "status": "Good", "sources": [{ "center": "H1", "uri": "237.0.6.5", "program": 3, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } }, { "center": "H1", "uri": "237.0.6.25", "program": 3, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } } ] } ]; const result = arr.reduce((a, {sources}) => [...a, ...sources], []) .reduce((a, {uri, state}) => ({...a, [uri]: state}), {}); console.log(result) 

Answer 2

您可以減少外部數組並迭代sources並更新對象作為結果集。

 var data = [{ id: "000701", status: "No Source Info", sources: [] }, { id: "200101", status: "Good", sources: [{ center: "H2", uri: "237.0.1.133", program: 1, status: "Good", state: { authState: "authorized", lockState: "locked" } }] }, { id: "005306", status: "Good", sources: [{ center: "H1", uri: "237.0.6.5", program: 3, status: "Good", state: { authState: "authorized", lockState: "locked" } }, { center: "H1", uri: "237.0.6.25", program: 3, status: "Good", state: { authState: "authorized", lockState: "locked" } }] }], stateMap = data.reduce( (o, { sources }) => (sources.forEach(({ uri, state }) => o[uri] = state), o), Object.create(null) ); console.log(stateMap); 

 .as-console-wrapper { max-height: 100% !important; top: 0; } 

遞歸是一個選項在這里或什么是更好的方法？

不，因為您只有一個嵌套級別。

Answer 3

您可以使用嵌套的reduce來從列表中的項目獲取uri映射，其他用於獲取源映射的值。

const mappedArray = arr.reduce((acc, item) => ({
  ...acc,
  ...item.sources.reduce((accSource, itemSource) => ({
    ...accSource,
    [itemSource.uri]: itemSource.state,
  }), {})
}), {})

 let arr = [ { "id": "000701", "status": "No Source Info", "sources": [] }, { "id": "200101", "status": "Good", "sources": [ { "center": "H2", "uri": "237.0.1.133", "program": 1, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } } ] }, { "id": "005306", "status": "Good", "sources": [ { "center": "H1", "uri": "237.0.6.5", "program": 3, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } }, { "center": "H1", "uri": "237.0.6.25", "program": 3, "status": "Good", "state": { "authState": "authorized", "lockState": "locked" } } ] } ] const mappedArray = arr.reduce((acc, item) => ({ ...acc, ...item.sources.reduce((accSource, itemSource) => ({ ...accSource, [itemSource.uri]: itemSource.state, }), {}) }), {}) console.log(mappedArray)