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对其进行编辑。

/** 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);

以纯方式修改JS对象

4 个答案: