Saya memilah bagian AJAX terakhir kali, dan setelah membaca bagian keterampilan lanjutan minggu ini, saya akan menyelesaikannya juga.
1. Deteksi tipe
Gunakan Object.Prototype.tostring.call (OBJ).
Karena tipe maupun instance dari tidak dapat secara akurat menilai jenis variabel.
2. Konstruktor yang aman
Biasanya saat kami mendefinisikan konstruktor, kami akan menggunakan sesuatu seperti
Salinan kode adalah sebagai berikut:
function person (name) {
this.name = name;
}
Namun, jika Anda tidak pergi ke var orang = orang baru ("cnblogs").
Sebaliknya, var orang = orang ("cnblogs"). Maka ini akan menunjuk ke tempat lain, menyebabkan kontaminasi dari benda -benda lainnya.
Solusinya adalah membuat penilaian saat mengatur ini.property
Contoh orang ini
Jika tidak, orang baru (x, x, x);
Salinan kode adalah sebagai berikut:
function person (name) {
if (instance orang ini) {
this.name = name;
}kalau tidak{
mengembalikan orang baru (nama);
}
}
Tetapi satu hal yang perlu diperhatikan adalah bahwa jika konstruktor lain mencoba menerapkan warisan melalui metode orang. Call (this, x).
Perlu dicatat bahwa sebelum instantiasi, arahkan prototipe fungsi itu ke orang.
3. Fungsi pemuatan malas
Saat memanggil suatu fungsi, seringkali ada situasi di mana fungsi perlu menilai fungsi browser.
Misalnya
Salinan kode adalah sebagai berikut:
fungsi createSomething () {
if (suport5) {
// Lakukan sesuatu
}kalau tidak{
// Lakukan hal lain
}
}
Namun, jika browser mendukung suatu fungsi, itu harus selalu didukung, jadi tidak perlu untuk membuat penilaian setiap kali Anda menjalankan kode, karena sekali sudah cukup.
Jadi bisa ditulis ulang
Salinan kode adalah sebagai berikut:
fungsi createSomething () {
if (suport5) {
createSomething = function () {// Tulis ulang fungsi CreateSomething
// Lakukan sesuatu
}
}kalau tidak{
// Sama seperti di atas
}
}
Dengan cara ini, Anda akan membuat penilaian ketika Anda menyebutnya pertama kali, dan kemudian Anda secara alami tidak akan membuat penilaian jika Anda menulis ulang fungsi.
4. Fungsi Ikatan
Di JS, hal yang paling membingungkan harus menjadi pertanyaan tentang siapa yang menunjukkan hal ini.
Faktanya, setelah saya mempelajari JS begitu lama, saya menemukan kesimpulan
Ini dalam fungsi akan menunjukkan objek yang akhirnya memanggil fungsi.
Setelah Anda mengetahuinya, ikatan fungsi tidak menjadi masalah.
Metode untuk mengubah titik ini dalam fungsi adalah panggilan dan berlaku, tetapi fungsi akan dieksekusi menggunakan kedua metode ini.
Jika Anda tidak ingin menjalankan fungsi, tetapi lulus fungsi sebagai parameter ke fungsi dan ingin mengubahnya, maka gunakan ikatan terbaru.
5. Timer
Meskipun SetTimeou, SetInterval, atau Ajax tidak sinkron, seperti multi-threading, JS adalah satu utas.
Bahkan, metode ini tidak menambahkan utas.
SetTimeout (FN, 300) berarti memasukkan FN ke dalam antrian eksekusi JS setelah 300 milidetik.
Jika tidak ada transaksi dalam antrian yang akan dieksekusi (yaitu, penerjemah JS menganggur), itu akan segera dieksekusi. Jika tidak, fungsi akan dieksekusi setelah transaksi antrian diproses.
Oleh karena itu, menggunakan SetTimeout atau SetInterval bukanlah waktu kontrol yang akurat.
Hal lain yang perlu diperhatikan adalah bahwa menggunakan SetTimeout untuk mensimulasikan setInterval dapat secara akurat mengontrol interval waktu eksekusi minimum.
6. Gunakan timer untuk menjalankan metode dalam waktu yang tetap.
Jika suatu metode perlu dieksekusi untuk waktu yang lama, yang dapat menyebabkan browser tidak merespons untuk waktu yang singkat, maka Anda dapat menggunakan timer untuk mengeksekusi sebagian dari itu setiap periode waktu. Ini akan mencegah JS sibuk sepanjang waktu (browser tidak responsif) dan memiliki waktu luang untuk menangani sisa transaksi. Misalnya, jika ada loop array panjang 1000, maka Anda dapat menjalankan 100 setiap kali, dan interval antara JS menganggur untuk melakukan operasi lain.
7. Fungsi Throttling.
Fungsi Throttling adalah cara yang bagus untuk meningkatkan kinerja, yang dapat meningkatkan efisiensi beberapa kali dalam beberapa kasus.
Misalnya, saat melakukan seret atau beberapa operasi yang terjadi di acara onressize.
Setiap kali Anda mengoperasikannya, Anda benar -benar menjalankannya berkali -kali. Misalnya:
Salinan kode adalah sebagai berikut:
var i = 0;
window.onresize = function () {
console.log (i ++);
}
Jika Anda mencoba meregangkan browser, Anda akan menemukan bahwa konsol secara instan menunjukkan bahwa I lebih dari 100.
Ubah metode penulisan, misalnya:
Salinan kode adalah sebagai berikut:
var i = 0, j = 1;
window.onresize = function () {
if (j % 2 == 0) {
console.log (i ++);
}
j ++;
}
Buat variabel J dan biarkan J dieksekusi setiap kali hanya ketika ada angka genap, yang berarti setengah dari jumlah eksekusi.
Dengan memproses seperti ini, jumlah eksekusi dapat dikurangi sebesar 50%, tetapi untuk pengguna, perbedaannya tidak dapat dirasakan.
Ada juga fungsi peleburan yang diimplementasikan menggunakan timer.
Kode inti adalah sebagai berikut:
Salinan kode adalah sebagai berikut:
fungsi throttle (metode, konteks) {
ClearTimeout (Method.TID);
method.tid = setTimeout (function () {
method.call (konteks);
}, 100);
}
Di sini, lingkungan eksekusi dari fungsi dan fungsi eksekusi (yaitu, objek penunjuk ini dalam fungsi eksekusi), kemudian hapus antrian tindakan terlebih dahulu, dan kemudian jalankan tindakan.
Bentuk ini dapat mengontrol frekuensi aksi dengan lebih baik.
Dengan asumsi itu adalah aksi peregangan browser, selama Anda cukup cepat meregangkan dan interval waktu untuk setiap pemicu adalah dalam 100 ms, maka hasil terakhir hanya akan dieksekusi.
8. Acara Kustom
Esensi adalah pola pengamat. Pola dasar membutuhkan 3 fungsi.
Salah satu fungsi adalah peristiwa yang mengikat, satu fungsi adalah peristiwa pemicu, dan yang lainnya adalah menghapus ikatan.
Pola ini dapat sangat mengurangi kopling kode.