มันขึ้นอยู่กับสิ่งที่คุณต้องการจะโคลน นี่เป็นออบเจ็กต์ JSON อย่างแท้จริงหรือเป็นเพียงวัตถุใน JavaScript? หากคุณต้องการทำการโคลนใด ๆ มันอาจทำให้คุณมีปัญหา ปัญหาไหน? ฉันจะอธิบายไว้ด้านล่าง แต่ก่อนอื่นคือตัวอย่างโค้ดที่โคลนวัตถุตัวอักษรดั้งเดิมอาร์เรย์และโหนด DOM
function clone(item) {
if (!item) { return item; } // null, undefined values check
var types = [ Number, String, Boolean ],
result;
// normalizing primitives if someone did new String('aaa'), or new Number('444');
types.forEach(function(type) {
if (item instanceof type) {
result = type( item );
}
});
if (typeof result == "undefined") {
if (Object.prototype.toString.call( item ) === "[object Array]") {
result = [];
item.forEach(function(child, index, array) {
result[index] = clone( child );
});
} else if (typeof item == "object") {
// testing that this is DOM
if (item.nodeType && typeof item.cloneNode == "function") {
result = item.cloneNode( true );
} else if (!item.prototype) { // check that this is a literal
if (item instanceof Date) {
result = new Date(item);
} else {
// it is an object literal
result = {};
for (var i in item) {
result[i] = clone( item[i] );
}
}
} else {
// depending what you would like here,
// just keep the reference, or create new object
if (false && item.constructor) {
// would not advice to do that, reason? Read below
result = new item.constructor();
} else {
result = item;
}
}
} else {
result = item;
}
}
return result;
}
var copy = clone({
one : {
'one-one' : new String("hello"),
'one-two' : [
"one", "two", true, "four"
]
},
two : document.createElement("div"),
three : [
{
name : "three-one",
number : new Number("100"),
obj : new function() {
this.name = "Object test";
}
}
]
})
ตอนนี้เรามาพูดถึงปัญหาที่คุณอาจได้รับเมื่อเริ่มการโคลนวัตถุจริง ตอนนี้ฉันกำลังพูดถึงวัตถุที่คุณสร้างโดยทำสิ่งที่ชอบ
var User = function(){}
var newuser = new User();
แน่นอนว่าคุณสามารถโคลนพวกมันได้ไม่ใช่ปัญหาทุกออบเจ็กต์จะเปิดเผยคุณสมบัติตัวสร้างและคุณสามารถใช้มันเพื่อโคลนอ็อบเจกต์ได้ แต่มันจะไม่ได้ผลเสมอไป คุณสามารถทำได้ง่ายๆfor inกับวัตถุนี้ แต่มันไปในทิศทางเดียวกันนั่นคือปัญหา ฉันได้รวมฟังก์ชันการโคลนไว้ในโค้ดด้วย แต่ไม่รวมอยู่ในif( false )คำสั่ง
เหตุใดการโคลนนิ่งจึงเป็นความเจ็บปวด? ก่อนอื่นทุกออบเจ็กต์ / อินสแตนซ์อาจมีสถานะบางอย่าง คุณไม่มีทางแน่ใจได้เลยว่าอ็อบเจกต์ของคุณไม่มีตัวอย่างเช่นตัวแปรส่วนตัวและหากเป็นกรณีนี้การโคลนนิ่งอ็อบเจกต์คุณจะทำลายสถานะ
ลองนึกภาพว่าไม่มีรัฐก็ไม่เป็นไร แล้วเรายังมีปัญหาอีก การโคลนด้วยวิธี "ตัวสร้าง" จะทำให้เรามีอุปสรรคอีกอย่าง เป็นการพึ่งพาอาร์กิวเมนต์ คุณไม่มีทางแน่ใจได้เลยว่ามีคนสร้างวัตถุนี้ไม่ได้ทำบางอย่าง
new User({
bike : someBikeInstance
});
หากเป็นกรณีนี้แสดงว่าคุณโชคไม่ดี someBikeInstance อาจถูกสร้างขึ้นในบางบริบทและบริบทนั้นไม่รู้จักสำหรับวิธีการโคลน
แล้วจะทำอย่างไร? คุณยังคงสามารถfor inแก้ปัญหาและปฏิบัติต่อวัตถุดังกล่าวได้เช่นตามตัวอักษรของวัตถุทั่วไป แต่อาจเป็นความคิดที่จะไม่โคลนวัตถุดังกล่าวเลยและเพียงแค่ส่งต่อการอ้างอิงของวัตถุนี้?
อีกวิธีหนึ่งคือ - คุณสามารถกำหนดแบบแผนว่าอ็อบเจ็กต์ทั้งหมดที่ต้องโคลนควรใช้ส่วนนี้ด้วยตัวเองและจัดเตรียมเมธอด API ที่เหมาะสม (เช่น cloneObject) สิ่งที่cloneNodeกำลังทำเพื่อ DOM
คุณตัดสินใจ.