如何使用 JavaScript 映射和物件擴充功能向物件數組添加附加屬性？

用附加屬性豐富物件數組：為每個元素添加「Active」

在現實程式設計場景中，您可能會遇到擴展現有物件數組的需要具有附加屬性。例如，考慮表示使用者資料的物件數組，每個物件都包含“id”和“name”。要追蹤它們的活動狀態，您需要為每個物件新增「Active」屬性。

使用 Array.prototype.map() 來增強物件

解決此問題的一種優雅方法是利用Array.prototype.map() 方法。此方法透過對原始數組的每個元素應用轉換函數來建立一個新數組。在我們的例子中，我們定義了一個函數，它接受一個物件並傳回一個新對象，並將附加的「Active」屬性設為「false」。

<code class="javascript">const updatedResults = Results.map(obj => ({
  ...obj, // Copy existing properties
  Active: 'false' // Add new "Active" property
}));</code>

透過應用 map() 方法，您可以獲得一個新數組“updatedResults”，其中每個物件都有所需的“Active”屬性。原始的“Results”數組保持不變。

理解物件擴充語法

函數中的「...」語法稱為物件擴充語法。它將所有可枚舉屬性從一個物件複製到另一個物件中。在本例中，我們使用它來保留現有屬性（「id」和「name」），同時新增新的「Active」屬性。

輸出驗證

執行上述程式碼後，您可以檢查「updatedResults」陣列以確認每個物件現在的「Active」屬性設定為「false」：

<code class="javascript">console.log(updatedResults);
// Output:
// [
//   { id: 1, name: 'Rick', Active: 'false' },
//   { id: 2, name: 'david', Active: 'false' }
// ]</code>

結論

透過利用Array.prototype.map( ）和物件擴充語法，您可以輕鬆地使用附加屬性增強物件陣列。此技術廣泛適用於需要動態擴展和操作資料結構的各種程式設計場景。

以上是如何使用 JavaScript 映射和物件擴充功能向物件數組添加附加屬性？的詳細內容。更多資訊請關注PHP中文網其他相關文章！