Typescript：使用 forEach() 解析嵌套接口數據

Question

CountTargetsData是我用作稍后解析 JSON 數據的類型的接口。 如下所示，數據有很多嵌套。

interface CountTargetsData {
  data: {
    [state: string]: {
      [date: string]: {
        [index: string]: { [id: string]: { [targets: string]: number } },
      },
    },
  };
}

const parseCounters = useCallback(
  async (responseDeploymentData: CountTargetsData) => {
    //WANT TO PARSE ID AND TARGETS HERE
  }
);

鑒於所有的嵌套，我如何使用forEach()方法訪問每個CountTargetsData的id和targets ？

樣本數據：

    "stateA": {
        "2016-06-03": [
            {
                "1200": {
                    "count_targets": 1,
                    "count_targets_excluded": 0,
                    "count_targets_pending": 0,
                    "count_targets_in_progress": 0,
                    "count_targets_completed": 0,
                    "count_targets_failed": 1
                }
            }
        ],
        "2016-06-07": [
            {
                "1455": {
                    "count_targets": 1,
                    "count_targets_excluded": 0,
                    "count_targets_pending": 0,
                    "count_targets_in_progress": 0,
                    "count_targets_completed": 1,
                    "count_targets_failed": 0
                }
            }
        ]
         
    }
}

Answer 1

更新

您的類型與您提供的示例數據不匹配

它應該是：

interface CountTargetsData {
  data: {
    [state: string]: {
      [date: string]: ({
        [index: string]: {
          [id: string]: {
            [targets: string]: number
          }
        },
      })[],
    },
  };
}

 const data = { "stateA": { "2016-06-03": [{ "1200": { "count_targets": 1, "count_targets_excluded": 0, "count_targets_pending": 0, "count_targets_in_progress": 0, "count_targets_completed": 0, "count_targets_failed": 1 } }], "2016-06-07": [{ "1455": { "count_targets": 1, "count_targets_excluded": 0, "count_targets_pending": 0, "count_targets_in_progress": 0, "count_targets_completed": 1, "count_targets_failed": 0 } }] } } Object.entries(data).forEach(([state, value]) => { Object.entries(value).forEach(([date, value]) => { value.forEach(obj => { Object.entries(obj).forEach(([id, value]) => { Object.entries(value).forEach(([target, value]) => { console.log(state, date, id, target, value) }) }) }) }) })

舊答案

您不能直接使用.forEach ，因為嵌套數據存儲為對象而不是數組。

首先嘗試使用Object.entries / Object.values或使用for..of循環：

const parseCounters = useCallback(
    async (
      responseDeploymentData: CountTargetsData
    ) => {
      Object.values(responseDeploymentData.data).forEach(state => {
        Object.values(state).forEach(date => {
          // and so on
        })
      })
  }

const parseCounters = useCallback(
    async (
      responseDeploymentData: CountTargetsData
    ) => {
      for (const state of responseDeploymentData.data) {
        for (const date of state) {
          // and so on
        }
      }
  }

考慮使用遞歸或 DFS 算法