如何使用數組解構重構此函數？

Question

大家好，

我已經構建了這個函數來將 Api 的獲取數據轉換為對象數組，但是 linter 要求我使用數組解構。

你能幫幫我嗎？ 我只是一個初學者，所以請善待！

 export const organiceData = async () => { const data = await getData(); const toArr = Object.entries(data); let newBook; const arr = []; toArr.forEach((book) => { newBook = book; newBook[1][0].id = book[0]; arr.push(newBook[1][0]); }); return arr; };

Answer 1

忽略該特定警告消息。 但是你仍然應該在你的代碼中修復一些東西：

• 使用map而不是forEach + push
• 擺脫無用的newBook別名-分配不是創建副本，當然也不是對象的深層副本
• book實際上不是 book 對象，它是一個表示鍵值對的元組（雙元素數組）。 book 對象是值 - 或者更確切地說，它似乎包含在值的第一個元素中，該元素本身就是一個數組。

export async function organiceData() {
  const data = await getData();
  return Object.entries(data).map(pair => {
    pair[1][0].id = pair[0];
    return pair[1][0];
  });
}

現在我們也可以使用解構來代替pair變量，就像const key = pair[0], value = pair[1]; ：

export async function organiceData() {
  const data = await getData();
  return Object.entries(data).map(([key, value]) => {
    value[0].id = key;
    return value[0];
  });
}

如果要在對象上添加id屬性之前創建對象的副本，以不改變它，您可以在對象文字中使用擴展語法。 我們還可以進一步對值使用解構（如const book = value[0]; ）：

export async function organiceData() {
  const data = await getData();
  return Object.entries(data).map(([key, [book]]) => {
    return {...book, id: key};
  });
}