Saya tidak tahu kapan itu dimulai, tetapi kata baru muncul di lingkaran front-end: kloning kedalaman objek. Ini terlihat sangat tinggi, tetapi sebenarnya bukan hal baru. Anda mungkin telah menggunakannya dalam pengembangan proyek kami yang sebenarnya, tetapi karena kedalaman karakter Cina, beberapa hal awalnya sederhana menjadi misterius dengan sedikit dimodifikasi oleh beberapa kosa kata yang tampaknya profesional.
Pertama -tama, mengapa Anda perlu mengkloning objek? Tolong izinkan saya untuk menebak: Anda terkadang berpikir bahwa dokumen objek bawaan JS terlalu lama, maka Anda mungkin melakukan ini:
Salinan kode adalah sebagai berikut:
var d = dokumen;
d.by = function (id) {
return d.geteLementById (id);
};
D.by ('id'). INNERHTML = 'Hello Sentsin';
Kode di atas menyederhanakan document.getElementById, dan juga menambahkan metode oleh anggota ke objek dokumen asli. Anda dapat memverifikasi penilaian Anda melalui nilai status yang dikembalikan oleh Document.hasownproperty ('by'). Mari kita lihat contoh berikut.
Salinan kode adalah sebagai berikut:
var person = {name: 'xianxin', profesi: 'pengembangan front-end', tempat: 'hangzhou'};
var newperson = orang;
newperson.age = '24';
Console.log (orang);
// hasil: {name: 'xianxin', profesi: 'pengembangan front-end', tempat: 'hangzhou', usia: 24}
Dapat dilihat bahwa ketika suatu objek hanya diteruskan ke variabel baru, itu hanyalah alias untuk objek. Ini berarti bahwa nilai kunci objek asli akan berubah melalui operasi pada alias. Tetapi masalahnya adalah bahwa kadang -kadang kita ingin orang baru sepenuhnya independen dari orang dan tidak ada hubungan sinkronisasi antara satu sama lain, jadi kita perlu menghasilkan salinan, silakan lihat contohnya:
Salinan kode adalah sebagai berikut:
var cloneobj = function (obj) {
var str, newoBj = obj.constructor === array? []: {};
if (typeof obj! == 'objek') {
kembali;
} lain if (window.json) {
str = json.stringify (obj), // objek serial
newoBj = json.parse (str); //Memulihkan
} kalau tidak {
untuk (var i di obj) {
newoBj [i] = tipe Obj [i] === 'objek'?
cloneobj (obj [i]): obj [i];
}
}
mengembalikan newoBj;
};
//tes
var obj = {a: 0, b: 1, c: 2};
var arr = [0, 1, 2];
// Jalankan kloning dalam
var newoBj = cloneobj (obj);
var newarr = cloneobj (arr);
// Hapus Penghapusan Anggota dari Objek Baru yang Kloning
hapus newobj.a;
newarr.splice (0,1);
Console.log (OBJ, ARR, NewOBJ, NewARR);
// Hasil: {a: 0, b: 1, c: 2}, [0, 1, 2], {b: 1, c: 2}, [1, 2];
Ini adalah apa yang disebut kloning objek. Tetapi ada beberapa hal yang perlu dijelaskan. Objek JSON dan metode anggotanya Stringy dan Parse dalam kode termasuk dalam spesifikasi ecmascript5. Mereka bertanggung jawab untuk mengubah objek (termasuk objek array) menjadi string dan memulihkannya, sehingga mewujudkan penyalinan objek yang mendalam. Jadi untuk browser tingkat rendah (seperti IE), jika Anda menyalin array, Anda dapat menggunakan newoBj.concat (OBJ), dan objek biasa dapat dengan mudah menyebutkan dan menetapkan nilai.