如何通過javascript中的鍵“內部連接”兩個陣列？

我有兩個包含物件的陣列，如下所示：

const array1 = 
[
{
    "id": 1,
    "mass": 149,
    "height": 180,
    "dob": "2003-09-04"
},
{
    "id": 2,
    "mass": 140,
    "height": 175,
    "dob": "2000-02-12",
},
{
    "id": 3,
    "mass": 143,
    "height": 170,
    "dob": "2001-11-04" 
}
]

const array2 = 
[
{
    "id": 1,
    "name": "James",
    "sport": "Football"
},
{
    "id": 2,
    "name": "Adam",
    "sport": "Tennis"
}
]

我想合并它們，使組合陣列僅包含id出現在 array1 和 array2 中的資料。

到目前為止，我使用的是 lodash _.merge，它回傳：

const merged = _.merge(array1, array2)

merged = [
{
"id": 1,
"mass": 149,
"height": 180,
"dob": "2003-09-04",
"name": "James",
"sport": "Football"
},
{
"id": 2,
"mass": 140,
"height": 175,
"dob": "2000-02-12",
"name": "Adam",
"sport": "Tennis"
},
{
"id": 3,
"mass": 143,
"height": 170,
"dob": "2001-11-04" ,
}
]

我只想merged包含id兩者中出現的資料，即：

[{
"id": 1,
"mass": 149,
"height": 180,
"dob": "2003-09-04",
"name": "James",
"sport": "Football"
},
{
"id": 2,
"mass": 140,
"height": 175,
"dob": "2000-02-12",
"name": "Adam",
"sport": "Tennis"
}]

我相信 SQL 之類的等效功能將是“內部聯接”

任何幫助將不勝感激！

uj5u.com熱心網友回復：

您需要將它們從一個映射到另一個。使用 reduce 的基本思想，我們通過 id 跟蹤專案。

const array1 = [{
    "id": 1,
    "mass": 149,
    "height": 180,
    "dob": '2003-09-04'
  },
  {
    "id": 2,
    "mass": 140,
    "height": 175,
    "dob": '2000-02-12',
  },
  {
    "id": 3,
    "mass": 143,
    "height": 170,
    "dob": '2001-11-04'
  }
]

const array2 = [{
    "id": 1,
    "name": "James",
    "sport": "Football"
  },
  {
    "id": 2,
    "name": "Adam",
    "sport": "Tennis"
  }
]


const result = Object.values([...array1, ...array2].reduce((acc, userData) => {
  // have you seen the id before? If yes, use it, if no use and empty object
  const data = acc[userData.id] || {};
  //merge the objects together and store the updated data by the id
  acc[userData.id] = { ...data, ...userData };
  return acc
}, {}));

console.log(result);

現在這將包括所有內容。如果您只想要兩者中的專案，則可以在兩個回圈中進行。

const array1 = [{
    "id": 1,
    "mass": 149,
    "height": 180,
    "dob": '2003-09-04'
  },
  {
    "id": 2,
    "mass": 140,
    "height": 175,
    "dob": '2000-02-12',
  },
  {
    "id": 3,
    "mass": 143,
    "height": 170,
    "dob": '2001-11-04'
  }
]

const array2 = [{
    "id": 1,
    "name": "James",
    "sport": "Football"
  },
  {
    "id": 2,
    "name": "Adam",
    "sport": "Tennis"
  }
]


// create a look up by the id
const array1MappedById = array1.reduce((acc, userData) => {
  acc[userData.id] = userData;
  return acc
}, {});

// Loop over the second array and make a new array with the merged data
const result = array2.reduce((arr, userData) => {
  const array1Data = array1MappedById[userData.id];
  // if the data exists in the map, then we should merge the data
  if (array1Data) {
    arr.push({...array1Data, ...userData});
  }
  return arr;
}, []);


console.log(result);

uj5u.com熱心網友回復：

Array.filter在執行相同的合并之前，您可以過濾您的第一個陣列以僅包含第二個陣列中存在的物件。

let merged = array1.filter(e => array2.some(f => f.id == e.id));

const array1 = 
[
{
    "id": 1,
    "mass": 149,
    "height": 180,
    "dob": 2003-09-04
},
{
    "id": 2,
    "mass": 140,
    "height": 175,
    "dob": 2000-02-12,
},
{
    "id": 3,
    "mass": 143,
    "height": 170,
    "dob": 2001-11-04 
}
]

const array2 = 
[
{
    "id": 1,
    "name": "James",
    "sport": "Football"
},
{
    "id": 2,
    "name": "Adam",
    "sport": "Tennis"
}
]

let merged = array1.filter(e => array2.some(f => f.id == e.id));
merged = _.merge(merged, array2);

console.log(merged);

<script src="https://cdn.jsdelivr.net/npm/[email protected]/lodash.min.js"></script>

uj5u.com熱心網友回復：

這將合并 id 相同的資料

const merged = array2.reduce((arr, current) => {
    let array1Data = {...array1}[current.id];
    if (array1Data) {
      arr.push({...array1Data, ...current});
    }
    return arr;
}, []);

console.log(merged);

標籤：

上一篇：C 編譯并運行良好，但在代碼中的某個點之后我無法生成任何型別的C 輸出

下一篇：在字串陣列javascript中添加單引號