Javascript对象插入数据而不破坏

Question

所以假设我有四个组件，三个孩子和一个父母。parentObject = {}childOneObject = {starTime, endTime}childTwoObject = {color, theme, junk}childThreeObject = {starsInSky, wheelsOnCar, shoesOnFeet}parentObject 应该由所有这些值组成以最终提交。在第一个组件结束时，用户将提交他们的数据，并将其添加到 parentObject。看起来像这样parentObject = childOneObject用户将继续执行第二步并提交与第一步相同的信息，但如果我写 parentObject = childTwoObject原始数据显然被破坏了。我想知道是否有一种方法可以将数据块插入到对象中，而不会破坏旧数据或不必逐行定位对象，例如parentObject.startTime = 5:00我不喜欢这样做，因为这对我来说很麻烦。

Answer 1

只需将它们全部分配在父级之上……

let parentObject = {}

let childOneObject = {startTime: 0, endTime: 1}

let childTwoObject = {color: 'red', theme: 'dark', junk: true}

let childThreeObject = {starsInSky: Number.MAX_VALUE, wheelsOnCar: 4, shoesOnFeet: 2}

Object.assign(parentObject, childOneObject, childTwoObject, childThreeObject)

console.log(parentObject)

Answer 2

您可以使用扩展运算符。该运算符将子对象与父对象合并

const parentObject = {};

parentObject = { ...parentObject, ...childOneObject };

parentObject = { ...parentObject, ...childTwoObject };

parentObject = { ...parentObject, ...childThreeObject };

你也可以一步完成

const parentObject = {};

parentObject = { ...parentObject, ...childOneObj, ...childTwoObj, ...childThreeObj };

Answer 3

在展开运算符的帮助下，这非常简单。

// Inital  

parentObject = {}

//Step 1:

childOneObject = {starTime, endTime}

parentObject = {...childOneObject};

// Step 2

childTwoObject = {color, theme, junk}

parentObject = {...parentObject, ...childTwoObject}

// Step 3

childThreeObject = {starsInSky, wheelsOnCar, shoesOnFeet}

parentObject = {...parentObject, ...childThreeObject}

Answer 4

const parentObject = {}

const childOneObject = {starTime: 0, endTime: 1}

const childTwoObject = {color:'red', theme:'dark', junk:false}

const childThreeObject = {starsInSky:2, wheelsOnCar:4, shoesOnFeet:2}

const assignKeyVals = (parent, child) => {

   Object.entries(child).forEach(([key,val]) => parent[key] = val)

}

assignKeyVals(parentObject, childOneObject)

assignKeyVals(parentObject, childTwoObject)

assignKeyVals(parentObject, childThreeObject)

console.log(parentObject)