遍歷兩個數組並返回對象數組

Question

我有兩個數組，一個帶有名稱，另一個帶有與名稱相關的ID。

arr1 = ["Bob Jones", "Steven Simon", "Green Tea"];
arr2 = [10, 8, 13];

arr2的ID與arr1的名稱相對應。 例如，鮑勃·瓊斯（Bob Jones）的ID為10。我想做的是返回一個對象數組，如下所示：

[
  {
    Id: 10,
    Name: Bob Jones
  },
  {
    Id: 8,
    Name: Steven Simon
  },
  {
    Id: 13,
    Name: Green Tea
  }
]

我試圖按照下面的代碼使用Object.defineproperties 。

const myOjbect = {};

Object.defineProperties(myObject, {
  name: {
    value: arr1[0],
    enumerable: true,
    writable: false,
  },
  id: {
    value: arr2[0],
    enumerable: true,
    writable: true,
  },
})

這為數組中的第一項提供了預期的結果，但我還需要將數組中的后續項包括在對象中（而不僅僅是第一項）。

Answer 1

不需要Object.defineProperty / defineProperties ，您只需在map回調中使用初始化器（又稱“文字”）語法創建對象：

const result = arr1.map((Name, index) => ({Id: arr2[index], Name}));

之所以可行，是因為map使用條目的值（在本例中為名稱）及其索引（以及您在其上調用map的對象）調用回調函數，因此我們直接使用名稱並獲取來自arr2等效位置的ID。

在JavaScript中，這些屬性名稱使用小寫字母會更加慣用：

const result = arr1.map((name, index) => ({id: arr2[index], name}));

現場示例：

 const arr1 = ["Bob Jones", "Steven Simon", "Green Tea"]; const arr2 = [10, 8, 13]; const result = arr1.map((name, index) => ({id: arr2[index], name})); console.log(result); 

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

如果您需要限制自己使用ES5級功能，而不是我上面使用的ES2015 +功能：

var result = arr1.map(function(name, index) {
    return {id: arr2[index], name: name};
});

現場示例：

 var arr1 = ["Bob Jones", "Steven Simon", "Green Tea"]; var arr2 = [10, 8, 13]; var result = arr1.map(function(name, index) { return {id: arr2[index], name: name}; }); console.log(result); 

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

Answer 2

嘗試使用forEach循環

 var arr1 = ['Bob Jones', 'Steven Simon', 'Green Tea']; var arr2 = [10, 8, 13]; var a=[]; arr1.forEach((e,i)=>a.push({id:arr2[i], name:e})) console.log(a) 

Answer 3

您可以使用具有所需鍵和其值的對象，並通過將對象映射為其新屬性來減少該對象。 這適用於密鑰的任意計數。 數組必須具有相同的長度。

 var Id = [10, 8, 13], Name = ["Bob Jones", "Steven Simon", "Green Tea"], result = Object.entries({ Id, Name }).reduce((r, [k, a]) => a.map((v, i) => Object.assign(r[i] || {}, { [k]: v })), [] ); console.log(result); 

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