拷貝對象分為淺拷貝和深拷貝，深拷貝只會復制地址，深拷貝才會復制內容，那么 JS 如何進行這兩種拷貝呢？
淺拷貝
Object.assign() 方法
Object.assign() - JavaScript | MDN
var object1 = {
a: [1],
b: 2,
c: 3
};
var object2 = Object.assign({}, object1);
console.log(object2.a); // [1]
object1.a[0] = 111;
console.log(object2.a); // [111]
深拷貝
$.extend() 方法
jQuery.extend() | jQuery API Documentation
var jsdom = require("jsdom").JSDOM;
var window = new jsdom(`<!DOCTYPE html>`).window;
var $ = require("jquery")(window);
var object1 = {
a: [1],
b: 2,
c: 3
};
var object2 = $.extend(true, {}, object1);
console.log(object2.a); // [1]
object1.a[0] = 111;
console.log(object2.a); // [1]
_.cloneDeep() 方法
cloneDeep | Lodash Documentation
var _ = require("lodash");
var object1 = {
a: [1],
b: 2,
c: 3
};
var object2 = _.cloneDeep(object1);
console.log(object2.a); // [1]
object1.a[0] = 111;
console.log(object2.a); // [1]
注意
lodash 拷貝數組，數組上的屬性會丟失
作者已經指出這不是 bug，而是這樣設計的：clone does not copy array properties · Issue #3521 · lodash/lodash
PS：使用 jquery 拷貝不會這樣。
var jsdom = require("jsdom").JSDOM;
var window = new jsdom(`<!DOCTYPE html>`).window;
var $ = require("jquery")(window);
var _ = require("lodash");
var object1 = {
a: [1],
b: 2,
c: 3
};
object1.a.p1 = 123;
var jq_obj = $.extend(true, {}, object1);
var lo_obj = _.cloneDeep(object1);
console.log(jq_obj.a); // [1, p1: 123]
console.log(lo_obj.a); // [1]