阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈

原文出處:https://dev.to/afewminutesofcode/how-to-convert-an-array-into-an-object-in-javascript-25a4

圖片來自undraw.co

原文發佈於 afewminutesofcode.com

要將陣列轉換為物件,我們將建立一個函數並為其提供 2 個屬性:一個陣列和一個鍵。

const convertArrayToObject = (array, key) => {};

然後,我們將減少陣列,並根據我們傳入的鍵為每個專案建立一個唯一的屬性。

我們還需要記住設定一個初始值,並傳入目前值(...下面的 obj)。

const convertArrayToObject = (array, key) => {
  const initialValue = {};
  return array.reduce((obj, item) => {
    return {
      ...obj,
      [item[key]]: item,
    };
  }, initialValue);
};

所以現在如果我們註銷我們的函數(傳入陣列和我們的鍵,在本例中是唯一標識符 id 屬性),我們將看到我們的陣列現在是一個物件。

console.log(
  convertArrayToObject(
    [
      { id: 111, name: 'John', age: 29 },
      { id: 112, name: 'Sarah', age: 25 },
      { id: 122, name: 'Kate', age: 22 },
      { id: 123, name: 'Tom', age: 21 },
      { id: 125, name: 'Emma', age: 24 },
    ],
    'id',
  ),
);

回報

{
  111:{ id: 111, name: 'John', age: 29 },
  112:{ id: 112, name: 'Sarah', age: 25 },
  122:{ id: 122, name: 'Kate', age: 22 },
  123:{ id: 123, name: 'Tom', age: 21 },
  125:{ id: 125, name: 'Emma', age: 24 }
}

現在,我們可以輕鬆地透過 id 找到陣列中的資料並根據需要使用它。

如果您正在尋找更多提示或希望在我的下一篇文章發佈時收到通知,請在此處在線關注我:

Instagram

臉書

afewminutesofcode.com

推特

Pinterest


共有 0 則留言


精選技術文章翻譯,幫助開發者持續吸收新知。

阿川私房教材:學程式,拿 offer!

63 個專案實戰,直接上手!
無需補習,按步驟打造你的面試作品。

立即解鎖你的轉職秘笈