如何正确克隆JavaScript对象？ - Code

我有一个对象x。我想将其复制为对象y，这样对y的更改不会修改x。我意识到复制从内置JavaScript对象派生的对象会导致额外的、不需要的财产。这不是问题，因为我正在复制我自己的一个文字构造对象。

如何正确克隆JavaScript对象？

当前回答

在JavaScript中复制对象的方法

使用排列（…）语法使用Object.assign（）方法使用JSON.stringify（）和JSON.parse（）方法

const person = {
    firstName: 'John',
    lastName: 'Doe'
};

// using spread ...
let p1 = {
    ...person
};

// using  Object.assign() method
let p2 = Object.assign({}, person);

// using JSON
let p3 = JSON.parse(JSON.stringify(person));

2021-06-02 02:25:54

其他回答

var x = {'e': 2, 'd': 8, 'b': 5};

const y = {};
for(let key in x) {
    y[key] = x[key];
}
console.log(y); // =>>> {e: 2, d: 8, b: 5}

const z = {};
Object.keys(x).forEach(key => {
    z[key] = x[key];
});
console.log(z); // =>>> {e: 2, d: 8, b: 5}

const w = {};
for(let i = 0; i < Object.keys(x).length; i++) {
    w[Object.keys(x)[i]] = x[Object.keys(x)[i]];
}
console.log(w); // =>>> {e: 2, d: 8, b: 5}

const v = {};
for(let key of Object.keys(x)) {
    v[key] = x[key];
}
console.log(v); // =>>> {e: 2, d: 8, b: 5}

x['q'] = 100;   // Altering x will not affect the other objects

console.log(x); // =>>> {e: 2, d: 8, b: 5, q: 100}
console.log(y); // =>>> {e: 2, d: 8, b: 5}
console.log(z); // =>>> {e: 2, d: 8, b: 5}
console.log(w); // =>>> {e: 2, d: 8, b: 5}
console.log(v); // =>>> {e: 2, d: 8, b: 5}

2019-11-23 22:18:15

如果您正在使用TypeScript，需要支持较旧的web浏览器（因此无法使用Object.assign），并且没有使用内置有克隆方法的库，那么您可以在几行代码中使自己成为组合助手。它结合了对象，如果只有一个，就克隆它。

/** Creates a new object that combines the properties of the specified objects. */
function combine(...objs: {}[]) {
    const combined = {};
    objs.forEach(o => Object.keys(o).forEach(p => combined[p] = o[p]));
    return combined;
}

2018-02-23 21:22:14

我不知道这在哪些情况下不起作用，但它给了我一个数组的副本。我觉得它很可爱：）希望它有帮助

copiedArr = origArr.filter(function(x){return true})

2017-10-17 05:46:34

我找到了一种用函数克隆对象的方法（打断多行以便于理解）：

const clone = Object.assign(
    Object.create(
        Object.getPrototypeOf(originalObject)
    ),
    dataObject
);

2022-11-15 10:53:10

我在复制对象时遇到问题。这是因为，当您执行以下操作时，您只对对象进行了“引用”，而当稍后更新源对象值时，克隆的复制对象也会更改值，因为它只是一个“引用”。因此，您可以看到源对象上次更改的多个值。

let x = { a: 1 };
let y = x; // y is a reference to x, so if x changes y also changes and v/v

因此，要解决这个问题，请执行以下操作：

let y = JSON.parse(JSON.stringify(x)); //see Note below

防止引用的另一种方法是执行以下操作：

let x = { a: 1 };
let y = Object.assign({}, x); // Object.assign(target, ...sources)

y.a = 2;
console.log(x); // { a: 1 }
console.log(y); // { a: 2 }

注：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/assign#warning_for_deep_clone

2022-07-12 10:22:40

aliyun