如果具有相同的鍵值，則將鍵值添加到物件陣列

我正在嘗試根據另一個陣列中的相應值向一個陣列中的所有物件添加一個具有特定值的屬性。

const array1 = [
  {
    id: 1,
    date: '2022.05.01',
    name: 'john'
  }, {
    id: 2,
    date: '2022.05.01',
    name: 'sam'
  }, {
    id: 3,
    date: '2022.05.03',
    name: 'john'
  }, {
    id: 4,
    date: '2022.05.06',
    name: 'jack'
  },
 ]
    

此陣列包含需要進行的必要修改：

const array2 = [
  {
    name: 'john',
    isCanceled: true,
  }, {
    name: 'jack',
    isCanceled: false,
  }, {
    name: 'sam',
    isCanceled: false,
  },
 ]

如果物件中的名稱array1is johnthenisCanceled應該設定為true，但如果它是jack或者sam它應該設定為false這樣：

const resultArray = [
  {
    id: 1,
    date: '2022.05.01',
    name: 'john',
    isCanceled: true,
  }, {
    id: 2,
    date: '2022.05.01',
    name: 'sam'
    isCanceled: false,
  }, {
    id: 3,
    date: '2022.05.03',
    name: 'john'
    isCanceled: true,
  }, {
    id: 4,
    date: '2022.05.06',
    name: 'jack'
    isCanceled: false,
  },
 ];

uj5u.com熱心網友回復：

您可以更簡單地做到這一點，首先將您array2轉換為一個物件，然后在類似的內部使用查找map：

const array1 = [{id:1,date:"2022.05.01",name:"john"},{id:2,date:"2022.05.01",name:"sam"},{id:3,date:"2022.05.03",name:"john"},{id:4,date:"2022.05.06",name:"jack"},];

const array2 = [{name:"john",isCanceled:true},{name:"jack",isCanceled:false},{name:"sam",isCanceled:false}];

const arrCancel = array2.reduce((a, { name, isCanceled }) => {
  a[name] = isCanceled;
  return a;
}, {});

const resultArr = array1.map(e => {
  e.isCanceled = arrCancel[e.name];
  return e;
});

console.log(resultArr);

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

uj5u.com熱心網友回復：

構建一個status包含狀態的查找物件，并映射您的陣列以包含查找物件中的匹配值：

const status = Object.fromEntries(
  array2.map(({name, isCanceled}) => [name, isCanceled])
);

const resultArray = array1.map(({id, date, name}) => ({
  id,
  date,
  name,
  isCanceled: status[name]
}));

或者，如果您只想修改array1而不是創建新陣列，則可以將第二步替換為：

array1.forEach(v => v.isCanceled = status[v.name]);

完整片段：

const array1 = [{
  id: 1,
  date: '2022.05.01',
  name: 'john'
}, {
  id: 2,
  date: '2022.05.01',
  name: 'sam'
}, {
  id: 3,
  date: '2022.05.03',
  name: 'john'
}, {
  id: 4,
  date: '2022.05.06',
  name: 'jack'
}, ];

const array2 = [{
  name: 'john',
  isCanceled: true,
}, {
  name: 'jack',
  isCanceled: false,
}, {
  name: 'sam',
  isCanceled: false,
}, ];

const status = Object.fromEntries(
  array2.map(({name, isCanceled}) => [name, isCanceled])
);

const resultArray = array1.map(({id, date, name}) => ({
  id,
  date,
  name,
  isCanceled: status[name]
}));

console.log(resultArray);

您是否想知道為什么我更喜歡構建查找物件而不是find()在操作內部map()使用：就復雜性而言，查找表的復雜度為O(1)，而find()方法為O(n)。

uj5u.com熱心網友回復：

你可以做一些事情：

const result = array1.map(person => {
  const lookPerson = array2.find(person2 => person2.name === person.name);
  return (lookPerson) ? { 
    ...person,
    isCanceled: lookPerson.isCanceled
  } : person;
});

• 結合 array.map 來變換 array1

• 使用 array.find 在 array1 和 array2 之間獲取相似人的第一次迭代

• 合并物件

  { 
    ...person,
    isCanceled: lookPerson.isCanceled
  }
  

const array1 = [{
  id: 1,
  date: '2022.05.01',
  name: 'john'
}, {
  id: 2,
  date: '2022.05.01',
  name: 'sam'
}, {
  id: 3,
  date: '2022.05.03',
  name: 'john'
}, {
  id: 4,
  date: '2022.05.06',
  name: 'jack'
}, ];

const array2 = [{
  name: 'john',
  isCanceled: true,
}, {
  name: 'jack',
  isCanceled: false,
}, {
  name: 'sam',
  isCanceled: false,
}, ];


const result = array1.map(person => {
  const lookPerson = array2.find(person2 => person2.name === person.name);
  return (lookPerson) ? { 
    ...person,
    isCanceled: lookPerson.isCanceled
  } : person;
});
console.log(result);

uj5u.com熱心網友回復：

你可以做：

const array1 = [{id: 1,date: '2022.05.01',name: 'john'}, {id: 2,date: '2022.05.01',name: 'sam'}, {id: 3,date: '2022.05.03',name: 'john'}, {id: 4,date: '2022.05.06',name: 'jack'}]
const array2 = [{name: 'john',isCanceled: true,}, {name: 'jack',isCanceled: false,}, {name: 'sam',isCanceled: false,}]

const array2Hash = array2.reduce((a, { name: n, isCanceled: ic}) => (a[n] = ic, a), {})

const result = array1.map(u => ({
  ...u,
  isCanceled: array2Hash[u.name]
}))

console.log(result)

uj5u.com熱心網友回復：

resultArray 是基于以下的array1加法的映射：isCanceledarray2

resultArray = array1.map( a => Object.assign(
  {},
  a,
  {isCanceled: array2.find(b => a.name == b.name)?.isCanceled||false}) )

標籤：javascript 数组 目的

上一篇：Pythonsetter不適用于實體化？

下一篇：在JS中分配陣列中的元素時出錯