為每個對象創建唯一ID

Question

概述：有一組product group對象，每個產品組都有一系列items 。 具有唯一ID但是items數組的產品組對象沒有分配任何唯一ID。 請在下面找到JSON對象。

const productList = [{
  productGroup : 'PG1',
  index: 1,
  items: [{
    item1: 'item1 value',
    item2: 'item2 value'
  },{
    item1: 'item1 value',
    item2: 'item2 value'
  },{
    item1: 'item1 value',
    item2: 'item2 value'
  }]
}, {
  productGroup : 'PG2',
  index: 2,
  items: [{
    item1: 'item1 value',
    item2: 'item2 value'
  },{
    item1: 'item1 value',
    item2: 'item2 value'
  }]
}];

要求：根據產品組為items數組的每個item對象分配一些唯一ID。

我到目前為止嘗試過： 工作解決方案：產品組的concat索引與每個列表項的索引

 const productList = [{ productGroup : 'PG1', index: 1, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }, { productGroup : 'PG2', index: 2, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }]; const itemList = productList.map(obj => { obj.items.map((itemObj, index) => { itemObj.productGroup = obj.productGroup; itemObj.pgIndex = obj.index; itemObj.itemIndex = obj.index + '' + index; }); return obj.items; }); var mergedListItems = itemList.reduce((arr, arrNext) => arr.concat(arrNext)); console.log('mergedListItems', mergedListItems); 

這種做法好嗎？ 如果不是，那么請你幫我找到最好的方法來做到這一點。

Answer 1

你可能.reduce到輸出數組立即，而不是遍歷項目多次：

 const productList = [{ productGroup : 'PG1', index: 1, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }, { productGroup : 'PG2', index: 2, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }]; const mergedListItems = productList.reduce((a, { productGroup, index, items }) => { items.forEach((itemObj, itemIndex) => { a.push({ ...itemObj, productGroup, pgIndex: index, itemIndex: `${index}${itemIndex}` }); }); return a; }, []); console.log(mergedListItems); 

另請注意，您的潛在問題

itemObj.itemIndex = obj.index + '' + index;

邏輯 - 如果任一index大於10，該怎么辦？ 然后，您可能會看到一個itemIndex為的項目，例如111 。 這是什么意思，它是指原始對象的索引是11，還是項目索引11？ 如果可能，請考慮在它們之間放置下划線或某些分隔符

itemObj.itemIndex = obj.index + '_' + index;

或者，使用像我的代碼中的模板文字

itemIndex: `${index}_${itemIndex}`

Answer 2

在您使用的代碼中

itemObj.itemIndex = obj.index + '' + index;

對於像obj.index=12 index=3和obj.index=1 index=23這樣的情況，這可能不是唯一的。 但如果你改變''到'-'它將是獨一無二的。

嘗試向每個item對象添加字段'id'，如下所示： id= productGroup.index + '-' + i （其中i是數組中的項索引）

productList.forEach(pr=>pr.items.forEach((x,i)=> x.id = pr.index+'-'+i ));

 const productList = [{ productGroup : 'PG1', index: 1, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }, { productGroup : 'PG2', index: 2, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }]; productList.forEach(pr=>pr.items.forEach((x,i)=> x.id = pr.index+'-'+i )); console.log(productList); 

您還可以創建獨立於productGroup.index的uniqe id

let i=0;
productList.forEach(pr=>pr.items.forEach(x=> x.id = i++ ));

 const productList = [{ productGroup : 'PG1', index: 1, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }, { productGroup : 'PG2', index: 2, items: [{ item1: 'item1 value', item2: 'item2 value' },{ item1: 'item1 value', item2: 'item2 value' }] }]; let i=0; productList.forEach(pr=>pr.items.forEach(x=> x.id = i++ )); console.log(productList); 

Answer 3

這里有一種使用reduce（）和實驗flatMap（）的方法 。 我還會將產品名稱附加到新identifier ：

 const productList = [{ productGroup : 'PG1', index: 1, items: [ {item1: 'item1 value', item2: 'item2 value'}, {item1: 'item1 value', item2: 'item2 value'}, {item1: 'item1 value', item2: 'item2 value'} ] }, { productGroup : 'PG2', index: 2, items: [ {item1: 'item1 value', item2: 'item2 value'}, {item1: 'item1 value', item2: 'item2 value'} ] }]; let newList = productList.reduce((res, curr) => { let objs = curr.items.flatMap((x, idx) => Object.assign({ productGroup: curr.productGroup, pgIndex: curr.index, itemIndex: [curr.productGroup, curr.index, idx].join("_") }, x)); return res.concat(objs); }, []); console.log(newList); 

Answer 4

我在下面寫的代碼將為您完成工作，並且是一個足夠簡單的可視化解決方案。 解決方案需要使用嵌套for循環，因為我們也循環遍歷內部項數組。 我在下面的代碼中添加了一些注釋來解釋發生了什么。

      const productList = [{
      productGroup : 'PG1',
      index: 1,
      items: [{
        item1: 'item1 value',
        item2: 'item2 value'
      },{
        item1: 'item1 value',
        item2: 'item2 value'
      },{
        item1: 'item1 value',
        item2: 'item2 value'
      }]
    }, {
      productGroup : 'PG2',
      index: 2,
      items: [{
        item1: 'item1 value',
        item2: 'item2 value'
      },{
        item1: 'item1 value',
        item2: 'item2 value'
      }]
    }];

    var count;
    for(var char in productList){
        count = 1; // Will reset to 1 when we go to a new product group
        for(var i = 0; i < productList[char].items.length; i++){
            // Adding in the unique key to the items.
            productList[char].items[i].uniqueKey = productList[char].productGroup + "_" + count;
            count++; 
        }   
    }

我希望這會有所幫助：P如果您有任何疑問，請告訴我。