JS。如何為每個道具復制陣列物件

限制：

1. 我僅限于不使用 ES6 語法
2. 我需要一種在不知道物件的確切屬性的情況下執行此操作的方法。因此，無需手動添加id, 并且name在推送到desiredOutput陣列時，而是自動復制所有屬性。

我有： 一個包含多個唯一物件的陣列，props

var items = [
  {
    id: 1,
    name: "item name",
    props: [
      {
        propId: 1,
        propName: "name one"
      }, 
      {
        propId: 2,
        propName: "name two"
      },
      {
        propId: 3,
        propName: "name three"
      }
    ]
  }
];

期望的結果： 包含一個新的陣列一個陣列內的原始物件復制，每各 prop

var desiredOutput = [
    {
      id: 1,
      name: "item name",
      props: [
        {
          propId: 1,
          propName: "name one"
        }
      ]
    },
    {
      id: 1,
      name: "item name",
      props: [
        {
          propId: 2,
          propName: "name two"
        }
      ]
    },
    {
      id: 1,
      name: "item name",
      props: [
        {
          propId: 3,
          propName: "name three"
        }
      ]
    }
  ];

uj5u.com熱心網友回復：

邏輯

• 回圈遍歷 items 陣列中的每個項。
• 檢查密鑰名稱是否不是props。
• 將鍵值組合添加到除 key 之外的物件 props
• 回圈遍歷props每個物件中的節點。
• 將每個道具添加到props鍵并將其推送到最終陣列
• 你應該在這里執行深拷貝邏輯，因為你一直在更新 pushong 物件

var items = [{
  id: 1,
  name: "item name",
  props: [
    { propId: 1, propName: "name one" }, 
    { propId: 2, propName: "name two" },
    { propId: 3, propName: "name three" }
  ]
}];
var desiredOutput = [];
for (var index = 0; index < items.length; index  ) {
  var outputNode = {};
  var entries = Object.entries(items[index]);
  for(var innerIndex = 0; innerIndex < entries.length; innerIndex  ) {
    if(entries[innerIndex][0] !== 'props') {
      outputNode[entries[innerIndex][0]] = entries[innerIndex][1];
    }
  }
  for(var innerIndex = 0; innerIndex < items[index].props.length; innerIndex  ) {
    outputNode.props = [items[index].props[innerIndex]];
    // This is mandatory to perform deep copy
    desiredOutput.push(JSON.parse(JSON.stringify(outputNode)));
  }
}
console.log(desiredOutput);

uj5u.com熱心網友回復：

你可以使用這樣的東西：

function copyProps(itemsArr) {
  var copy = []; var i = 0;
  
  itemsArr.forEach(function(item) {
    item.props.forEach(function(prop) {
      copy[i] = Object.assign({}, item);
      copy[i].props = [Object.assign({}, prop)];
      i  ;
    });
  }); 
  
  return copy;
}

uj5u.com熱心網友回復：

只是獲得所需輸出的另一種方式。

var items = [{
  id: 1,
  name: "item name",
  props: [{
    propId: 1,
    propName: "name one"
  }, {
    propId: 2,
    propName: "name two"
  }, {
    propId: 3,
    propName: "name three"
  }]
}];

var desiredOutput = [];

function ExtractDataFromProp(jsObject, jsObjectPropKey) {
    if (Object.hasOwnProperty.call(jsObject, jsObjectPropKey)) {
        const propElementValue = jsObject[jsObjectPropKey];
        if (typeof propElementValue != "object") {
            const propString = `"${jsObjectPropKey}" : ${isNaN(propElementValue) ? ("\""   propElementValue   "\"") : propElementValue}`;
            return propString;
        }
        return null;
    }
}

items.forEach((item) => {
    var itemObjArray = [];
    var itemProps = [];

    for (const itemKey in item)
        itemObjArray.push(ExtractDataFromProp(item, itemKey));

    item.props.forEach((prop) => {
        for (const propKey in prop)
            itemProps.push(ExtractDataFromProp(prop, propKey));

        var finalObject = `{ ${itemObjArray.join(',').replace(/,\s*$/, "")}, "props": { ${itemProps.join(',').replace(/,\s*$/, "")} } }` //

        desiredOutput.push(JSON.parse(finalObject))

    });
});

console.dir(desiredOutput);

標籤：javascript

上一篇：Javascript中的自定義Hashable實作

下一篇：無法獲取用戶.joinedAt值