Javascript修改物件陣列和concat值-有解無憂

我有一個這樣的物件陣列：

const data = [
  { id: '1', label: 'Last Name', value: 'Smith' },
  { id: '1', label: 'Last Name', value: 'Blogs' },
  { id: '2', label: 'First Name', value: 'John' },
  { id: '2', label: 'First Name', value: 'Joe' }
];

我試圖得到這樣的輸出：

const output = [
  {key: 'Employee', value: 'John Smith'},
  {key: 'Employee', value: 'Joe Blogs'}
];

我正在考慮使用reduce，但我一直堅持如何正確獲得一個條件，即如果id為2，則添加到output.value，如果id為1，則將output.value連接到已經存在的值。

id 1 和 id 2 都是動態的并且可以增長。ID 1 永遠是姓氏，id 2 永遠是名字。

uj5u.com熱心網友回復：

.reduce()將每個分組或成為物件陣列['value']。['label']['First Name']['label']['Last Name']group
Next.map()遍歷output['First Name']，然后將output['First Name']和output['Last Name']的當前值連接起來并添加到由Object.assign()

const data = [
  { id: '1', label: 'Last Name', value: 'Smith' },
  { id: '1', label: 'Last Name', value: 'Blogs' },
  { id: '2', label: 'First Name', value: 'John' },
  { id: '2', label: 'First Name', value: 'Joe' }
];

function fullName(objArray) {
  let output = objArray.reduce((group, current) => {
    if (!group[current['label']]) {
      group[current['label']] = [];
    }
    group[current['label']].push(current.value);
    return group
  }, {});
  
  console.log(`.reduce() returns: (scroll down for final result)`);
  console.log(output);
  console.log(`fullName(data) returns:`);
  
  return output['First Name'].map((first, index) =>
    Object.assign({}, {
      key: 'Employee',
      value: first   ' '   output['Last Name'][index]
    })
  );
}

console.log(fullName(data));

uj5u.com熱心網友回復：

您需要首先對相關專案進行分組。現在您可以使用Map物件，但通常大多數人會簡單地使用一個空物件 ( {})，部分原因是它一直都是這樣做的，因此其他程式員可以輕松閱讀您的代碼，部分原因是語法更易于使用。

所以基本的想法是這樣的：

let group = {};

arrayData.forEach(item => {
    let id = item.id;

    if (!group[id]) {
        // if item does not exist in the group yet
        // then create item
        group[id] = {}
    }

    group[id][item.some_key] = item.some_value;
})

然后在分組之后，您可以遍歷組并構造一個新陣列：

let result = [];

for (let i in group) {
    result.push({
        some_key_you_want: i.xxx   i.yyy
    })
}

現在你有了一個result包含你想要的資料的陣列。當然，我們可以用許多不同的方式來寫這個，但以上是這個想法的大致輪廓。

在您的情況下，我們可以這樣做：

let group = {}

data.forEach(item => {
    let id = item.id;
    if (!group[id]) group[id] = {};
    group[id][item.label] = item.value;
})

const result = Object.values(group).map(item => {
    return {
        key: 'Employee',
        value: item['First Name']   ' '   item['Last Name'],
    }
})

轉載請註明出處，本文鏈接：https://www.uj5u.com/qukuanlian/487494.html

標籤：javascript 数组目的减少

上一篇：如何將來自另一個類的物件存盤在另一個類的ArrayList中？

下一篇：使用資料類包將引數轉換為自定義物件