JavaScript Deep Copy dikembangkan oleh pemula dan bahkan berpengalaman, dan mereka sering mengalami masalah dan tidak dapat memahami salinan JavaScript dalam dengan sangat baik.
Deepclone?
Kebalikan dari salinan yang dalam adalah salinan dangkal. Banyak pemula bingung ketika mereka bersentuhan dengan perasaan ini.
Mengapa menggunakan salinan yang dalam?
Dalam banyak kasus, kita perlu menetapkan nilai ke variabel dan menetapkan nilai ke alamat memori. Namun, saat menetapkan jenis nilai referensi, kami hanya berbagi area memori, yang menghasilkan mempertahankan konsistensi dengan nilai sebelumnya saat menetapkan.
Lihat contoh spesifik
// Tetapkan objek untuk menguji var test = {a: 'a', b: 'b'}; // Tetapkan tes ke test2 // pada saat ini, tes dan test2 berbagi objek memori yang sama, yang merupakan salinan dangkal var test2 = test; test2.a = 'a2'; test.a === 'a2' // BenarIlustrasi:
Ini adalah ide yang baik untuk memahami mengapa jenis nilai referensi data mempengaruhi satu sama lain.
menyelesaikan
Untuk mengimplementasikan fungsi salinan yang dalam, kita harus berbicara tentang jenis javascript numerik.
Tentukan tipe JavaScript
Ada tipe dasar berikut dalam JavaScript
Ketik Deskripsi
Jenis yang tidak terdefinisi hanya memiliki satu nilai yang tidak ditentukan, yang merupakan nilai ketika variabel tidak ditetapkan.
Jenis nullnull juga hanya memiliki satu nilai nol, itu adalah referensi objek kosong
Booleanboolean memiliki dua nilai: benar dan salah
String itu mewakili informasi teks
Angka itu mewakili informasi digital
Objek Ini adalah kumpulan serangkaian properti yang tidak tertib, termasuk fungsi fungsi dan array array
Tidak mungkin untuk menilai fungsi dan array menggunakan tipeof. Di sini kami menggunakan metode object.prototype.tostring.
[Secara default, setiap objek akan mewarisi dari objek ke metode tostring (). Jika metode ini tidak ditimpa (diblokir) dengan metode nama yang sama pada objek itu sendiri atau prototipe atas yang lebih dekat, metode ToString () dari objek akan dipanggil dan jenis string di sini mewakili tipe objek] [1]
tipe fungsi (obj) {var toString = object.prototype.toString; var peta = {'[objek boolean]': 'boolean', '[nomor objek]': 'angka', '[string objek]': 'string', '[fungsi objek]': 'fungsi', '[array objek]': 'array', '[tanggal objek]': 'tanggal', '[objek regexp]': ',', ',': '[objek tidak ada objek]': ',': ':' [Object Regexp] ':', ',': 'Date' [Object Regexp] ':', ',' Tanggal ',' Tanggal ',' 'null', '[objek objek]': 'objek'}; return map [tostring.call (obj)];}Menerapkan DeepClone
Untuk nilai numerik dari tipe nilai yang tidak direferensikan, nilai ditetapkan secara langsung, dan untuk jenis nilai yang direferensikan (objek) Anda perlu melintasi lagi dan menetapkan secara rekursif.
fungsi deepclone (data) {var t = type (data), o, i, ni; if (t === 'array') {o = []; } else if (t === 'objek') {o = {}; } else {return data; } if (t === 'array') {for (i = 0, ni = data.length; i <ni; i ++) {o.push (deepclone (data [i]))); } return o; } else if (t === 'objek') {untuk (i dalam data) {o [i] = DeepClone (data [i]); } return o; }}Ada benar di sini yang harus diperhatikan oleh semua orang. Untuk jenis fungsi, apakah blogger langsung menetapkan nilai atau berbagi nilai memori. Ini karena fungsi lebih lanjut tentang menyelesaikan fungsi tertentu, dengan nilai input dan nilai pengembalian, dan untuk layanan tingkat atas, mereka lebih tentang menyelesaikan fungsi bisnis, dan tidak perlu benar-benar menyalin fungsi secara mendalam.
Tapi bagaimana cara menyalin tipe fungsi?
Faktanya, blogger hanya berpikir untuk menggunakan yang baru untuk mengoperasikannya, tetapi fungsinya akan dieksekusi sekali, dan saya tidak berani membayangkan apa hasil eksekusi nantinya! o (□) o! Saya belum punya ide bagus, tolong beri saya bimbingan!
Pada titik ini, salinan yang dalam hampir selesai, tetapi beberapa orang berpikir bahwa mengapa salinan dangkal tidak diimplementasikan?
Salinan yang dangkal?
Untuk salinan yang dangkal, dapat dipahami hanya mengoperasikan satu area memori umum! Akan ada bahaya di sini! (..*)
Jika Anda mengoperasikan data bersama ini secara langsung tanpa mengendalikannya, pengecualian data akan sering terjadi dan diubah oleh bagian lain. Oleh karena itu, Anda tidak boleh mengoperasikan sumber data secara langsung, merangkum beberapa metode untuk melakukan operasi dadih pada data.
Mungkin hampir sama di sini, tetapi sebagai front-end, itu tidak hanya menganggap JavaScript itu sendiri, tetapi juga DOM, browser, dll.
Jenis elemen
Mari kita lihat kode berikut, apa yang akan dikembalikan dalam hasilnya?
Object.prototype.toString.call(document.getElementsByTagName('div')[0])
Jawabannya adalah [objek htmldivelement]
Kadang -kadang ketika elemen DOM disimpan dan jika Anda secara tidak sengaja menyalinnya dalam, fungsi salinan dalam di atas tidak memiliki penilaian pada elemen elemen. Untuk menilai elemen elemen, gunakan contoh untuk menilai. Karena untuk tag yang berbeda, ToString akan mengembalikan konstruktor yang sesuai dengan tag yang berbeda.
tipe fungsi (obj) {var toString = object.prototype.toString; var peta = {'[objek boolean]': 'boolean', '[nomor objek]': 'angka', '[string objek]': 'string', '[fungsi objek]': 'fungsi', '[array objek]': 'array', '[tanggal objek]': 'tanggal', '[objek regexp]': ',', ',': '[objek tidak ada objek]': ',': ':' [Object Regexp] ':', ',': 'Date' [Object Regexp] ':', ',' Tanggal ',' Tanggal ',' 'null', '[objek objek]': 'objek'}; if (obj instance dari elemen) {return 'element'; } return peta [tostring.call (obj)];}Cara lain?
Implementasi jQuery
Untuk detailnya, silakan lihat https: //github.com/jquery/jqu ...
Implementasi Garis Besar
Untuk detailnya, silakan lihat https: //github.com/jashkena/...
Implementasi Lodash
Untuk detailnya, silakan lihat https: //github.com/lodash/lod ...
Implementasi JSON
Anda dapat mewujudkan salinan yang dalam dengan pertama kali melewati json.stringify, dan kemudian json.parse. Namun, tipe data hanya mendukung tipe numerik dasar.
var obj = {a: 'a', b: function () {console.log ('b')}} // Ketika json.stringify, fungsi akan difilter. Json.stringify (obj) // "{" a ":" a "}"ringkasan
Di sini kami secara kasar merangkum salinan yang dalam dan cara mengimplementasikan salinan yang dalam. Dalam skenario yang berbeda, perlu untuk menentukan apakah salinan dalam diperlukan berdasarkan skenario bisnis.