以纯方式修改JS对象

Question

我有一个转换JS对象的函数。 它从现有属性派生一个新属性，然后删除原始属性。 本质上是这样的：

 /** Derives "capName" property from "name" property, then deletes "name" */ function transform(person) { person["capName"] = person["name"].toUpperCase(); delete person["name"]; return person; } var myPerson = { name: "Joe", age: 20 }; var newPerson = transform(myPerson); console.log(myPerson, newPerson); 

该函数返回所需的newPerson对象，但也会修改原始的myPerson对象。 我宁愿以纯粹的方式执行此操作，而不会修改原始的myPerson对象。

注意 ：我确实需要与ES5兼容，但是我也希望看到ES6解决方案。

Answer 1

只需使用Object.assign创建具有新引用的新对象

 function transform(person) { var obj = Object.assign({}, person); obj["capName"] = obj["name"].toUpperCase(); delete obj["name"]; return obj; } var myPerson = { name: "Joe", age: 20 }; var newPerson = transform(myPerson); console.log('newPerson:', newPerson); console.log('myPerson:', myPerson); 

Answer 2

解构非常容易：

 const transform = ({ name, ...rest }) => ({ capName: name.toUpperCase(), ...rest });

我真的需要与ES5兼容

使用BabelJS ，它使您的生活更加轻松自在 。

Answer 3

为了实现ES5兼容性，可以使用JSON.parse(JSON.stringify(person)) 。 请注意，附加到person的方法在途中会丢失，因为它们无法正确进行JSON.stringify ed。

 /** Derives "capName" property from "name" property, then deletes "name" */ function transform(person) { var obj = JSON.parse(JSON.stringify(person)); obj["capName"] = obj["name"].toUpperCase(); delete obj["name"]; return obj; } var myPerson = { name: "Joe", age: 20 }; var newPerson = transform(myPerson); console.log(myPerson, newPerson); 

如果要保留方法，只需遍历对象键即可：

 /** Derives "capName" property from "name" property, then deletes "name" */ function transform(person) { var obj = {}; for (var key in person) { obj[key] = person[key]; } obj["capName"] = obj["name"].toUpperCase(); delete obj["name"]; return obj; } var myPerson = { name: "Joe", age: 20 }; var newPerson = transform(myPerson); console.log(myPerson, newPerson); 

请注意，所提供的方法均未进行深度克隆。 为此，我建议您使用lodash的_.clone(obj, { deep: true });

Answer 4

您可以生成没有不需要的属性和新属性的新对象。

 function transform(person) { return Object .keys(person) .reduce(function (r, k) { if (k === 'name') { r.capName = person.name.toUpperCase(); } else { r[k] = person[k]; } return r; }, {}); } var myPerson = { name: "Joe", age: 20 }, newPerson = transform(myPerson); console.log(myPerson); console.log(newPerson);