Part1 kode tulisan tangan
Kode tulisan tangan di tempat adalah jenis pertanyaan wawancara yang sangat umum dalam wawancara saat ini, memeriksa struktur data dasar dan kemampuan algoritma.
1. Implementasi Deduplikasi Array
Deduplikasi Array Dasar
Array.prototype.unique = function () {var result = []; this.foreach (function (v) {if (result.indexof (v) <0) {result.push (v);}}); Hasil pengembalian;}• Gunakan tabel hash untuk deduplikat, ini adalah cara untuk bertukar ruang waktu
Array.prototype.unique = function () {var result = [], hash = {}; this.foreach (function (v) {if (! hash [v]) {hash [v] = true; result.push (v);}}); Hasil pengembalian;}Ada bug dalam metode di atas. Untuk array [1,2, '1', '2', 3], hasil deduplikasi adalah [1,2,3]. Alasannya adalah bahwa objek akan melemparkan indeks atribut ketika objek indeks. Arr ['1'] dan arr [1] keduanya mendapatkan nilai ARR [1], jadi beberapa perubahan perlu dilakukan:
Array.prototype.unique = function () {var result = [], hash = {}; this.foreach (function (v) {var type = typeof (v); // dapatkan elemen tipe hash [v] || (hash [v] = array baru ()); if (hash [v] .indexof (type) <0) {hash [v] .push (type); // penyimpanan jenis result.push (v);}}; Hasil pengembalian;}• Urutkan dulu dan kemudian hapus pengulangan
Array.prototype.unique = function () {var result = [ini [0]]; this.sort (); this.foreach (function (v) {v! = hasil [result.length - 1] && result.push (v); // Bandingkan hanya dengan elemen terakhir hasil});}2 Implementasi Penyortiran Cepat
Metode 1 (Jangan gunakan metode array JS sebanyak mungkin):
function quicksort (arr) {qsort (arr, 0, arr.length - 1);} fungsi qsort (arr, rendah, tinggi) {if (rendah <tinggi) {var partisi = partisi (arr, rendah, tinggi); QSort (ARR, Low, Partkey - 1); qsort (ARR, Partkey + 1, tinggi); }} Partisi fungsi (arr, rendah, tinggi) {var key = arr [rendah]; // Gunakan elemen pertama sebagai basis klasifikasi sementara (rendah <tinggi) {while (rendah <high && arr [tinggi]> = arr [key]) tinggi--; arr [rendah] = arr [tinggi]; while (Low <high && arr [Low] <= arr [Key]) Low ++; arr [tinggi] = arr [rendah]; } arr [low] = key; mengembalikan rendah;}Metode 2 (menggunakan metode array JS):
function quicksort (arr) {if (arr.length <= 1) return arr; indeks var = math.floor (arr.length/2); var key = arr.splice (indeks, 1) [0]; var left = [], kanan = []; arr.foreach (function (v) {v <= key? left.push (v): right.push (v);}); return quicksort (kiri) .concat ([kunci], quicksort (kanan));}Selain itu, harus dicatat bahwa kompleksitas waktu rata -rata dari o o (nlogn) yang cepat, kasus terburuk adalah kasus yang tertib, kompleksitas waktu adalah kuadrat n, dan penyortiran cepat tidak stabil.
Part2 JavaScript Terkait
1 JavaScript Data Tipe Data
Tipe data JavaScript termasuk tipe primitif dan jenis referensi, dan ada lima tipe primitif:
Number (Value) String (String) Boolean (Boolean) Null (Kosong) Tidak Ditentukan (Tidak Ditentukan)
Ada jenis referensi:
Objek (objek)
Melalui TypeOf (x), Anda dapat mengembalikan tipe data "nomor", "string", "boolean", "tidak terdefinisi", dan "objek" dari variabel x. Satu hal yang perlu diperhatikan di sini: Operator TypeOF mengembalikan objek untuk tipe nol.
"JavaScript Advanced Programming":
Ini sebenarnya adalah bug dalam implementasi awal JavaScript, yang kemudian digunakan oleh ecmascript. NULL sekarang dianggap sebagai placeholder untuk objek, sehingga menjelaskan kontradiksi ini. Tapi secara teknis itu masih nilai aslinya.
2 Bicara tentang rantai lingkup javascript
Saat menjalankan sepotong kode JavaScript (kode atau fungsi global), mesin JavaScript akan membuat ruang lingkup untuk itu, juga dikenal sebagai konteks eksekusi. Setelah halaman dimuat, ruang lingkup global akan dibuat terlebih dahulu, dan kemudian setiap fungsi akan dieksekusi, ruang lingkup yang sesuai akan ditetapkan, sehingga membentuk rantai ruang lingkup. Setiap ruang lingkup memiliki rantai ruang lingkup yang sesuai, kepala rantai adalah ruang lingkup global, dan ekor rantai adalah ruang lingkup fungsi saat ini.
Tujuan dari rantai ruang lingkup adalah untuk menguraikan pengidentifikasi. Ketika fungsi dibuat (tidak dieksekusi), ini, argumen, parameter bernama dan semua variabel lokal dalam fungsi akan ditambahkan ke ruang lingkup saat ini. Ketika JavaScript perlu menemukan variabel x (proses ini disebut resolusi variabel), pertama -tama akan mencari apakah ada atribut x dari ujung rantai dalam rantai ruang lingkup, yaitu, ruang lingkup saat ini. Jika tidak ditemukan, terus cari di sepanjang rantai lingkup sampai kepala rantai, yaitu, rantai lingkup global, dan variabel tidak ditemukan, diyakini bahwa tidak ada variabel X pada rantai ruang lingkup kode ini, dan pengecualian referensi (referensi) pengecualian dilemparkan.
3 Cara Memahami Rantai Prototipe JavaScript
Setiap objek dalam JavaScript memiliki atribut prototipe, yang kami sebut prototipe, dan nilai prototipe juga merupakan objek, sehingga juga memiliki prototipe sendiri, yang menghubungkan rantai prototipe. Header rantai prototipe adalah objek, dan prototipenya relatif istimewa, dengan nilai nol.
Fungsi rantai prototipe digunakan untuk warisan objek. Properti prototipe fungsi A adalah objek. Ketika fungsi ini digunakan sebagai konstruktor untuk membuat instance, properti prototipe fungsi akan ditetapkan untuk semua instance objek sebagai prototipe. Misalnya, jika kita membuat array baru, metode array akan diwarisi dari prototipe array.
Saat mengakses atribut suatu objek, pertama -tama cari objek itu sendiri, dan kembalikan jika ditemukan; Jika tidak ditemukan, terus cari sifat -sifat objek prototipe (jika masih belum ditemukan, ia benar -benar akan mencari ke atas sepanjang rantai prototipe sampai root). Selama tidak ditimpa, sifat -sifat prototipe objek dapat ditemukan di semua contoh, dan jika seluruh rantai prototipe tidak ditemukan, ia akan mengembalikan tidak ditentukan;
4 Deklarasi Variabel JavaScript terlebih dahulu
Panduan otoritatif untuk JavaScript menjelaskan hal ini: Variabel JavaScript tersedia sebelum deklarasi, dan fitur JavaScript ini secara informal disebut Hoisting, yaitu, semua variabel yang dinyatakan dalam fungsi JavaScript (tetapi tidak melibatkan penugasan) adalah "maju" ke bagian atas fungsi.
Dari contoh:
var scope = "global"; function myfunc () {console.log (scope); var scope = "local";}Apa yang dicetak konsol itu bukan "global" tetapi "tidak ditentukan". Ini karena dalam ruang lingkup fungsi myfunc, deklarasi lingkup variabel lokal diajukan ke bagian atas fungsi. Pada saat ini, ruang lingkup hanya menyatakan dan tidak menetapkan nilai, sehingga output tidak terdefinisi. Faktanya, kode di atas sama dengan yang berikut:
var scope = "global"; function myfunc () {var scope; console.log (lingkup); scope = "lokal";}5 Cara Memahami dan Menerapkan Penutupan JavaScript
Konsep yang diberikan dalam literatur tentang definisi spesifik penutupan sangat abstrak. Saya pikir penutupan adalah mekanisme sintaks yang memungkinkan fungsi untuk semua variabel lokal dari fungsi lain.
Misalnya:
function outfunc () {var name = "vicfeel"; fungsi infunc () {console.log (name); } return infunc;} infunc (); // Menampilkan Konsol "Vicfeel"Kita dapat melihat contoh ini bahwa nama variabel lokal Outfunc masih dapat diakses dalam fungsi infunc.
Contoh aplikasi penutupan, mensimulasikan sifat pribadi kelas. Mengambil keuntungan dari sifat -sifat penutupan, variabel lokal hanya dapat diakses dalam metode Sayage, dan nama juga diakses secara eksternal, sehingga menerapkan properti pribadi kelas.
function user () {this.name = "vicfeel"; // Total atribut var usia = 23; // atribut pribadi this.sayage: function () {console.log ("Usia saya adalah" + usia); }} var user = pengguna baru (); console.log (user.name); // console.log "vicfeel" (user.age); // user.sayage "tidak terdefinisi (); // "Usia saya berusia 23"Untuk mempelajari lebih lanjut tentang penutupan, saya merekomendasikan log jaringan Ruan Yifeng - Pelajari Penutupan JavaScript (penutupan).
6 Inti dari objek konstruksi baru
function user () {this.name = "vicfeel"; this.age = 23;} var user = new user ();Melalui operator baru, operasi berikut sebenarnya diselesaikan pada pengguna konstruktor:
• Buat objek baru yang jenisnya adalah objek;
• Atur properti internal, dapat diakses dan prototipe dari objek baru ini sebagaimana diatur dalam konstruktor (mengacu pada konstruktor yang ditunjuk oleh prototipe.construtor);
• mengeksekusi konstruktor;
• Mengembalikan objek yang baru dibuat.
function user () {// this = {}; //this.constructor = pengguna; this.name = "vicfeel"; this.age = 23; // kembalikan ini; } var user = pengguna baru ();Jika konstruktor mengembalikan objek ini yang baru dibuat secara default, jika suatu variabel dikembalikan secara manual, itu tidak valid jika variabelnya dari jenis asli, dan jika itu adalah objek, ia dikembalikan.
7 Agen JavaScript
Ketika kita perlu menambahkan acara ke banyak elemen, kita dapat memicu fungsi pemrosesan dengan menambahkan peristiwa ke node induknya dan mendelegasikan acara ke node induk.
Misalnya, kita perlu secara dinamis menambahkan banyak Li ke UL, dan kita perlu melintasi Li untuk menambahkan peristiwa klik satu per satu.
<ul id = 'list'> </ul> var count = 100; var ullist = document.getElementById ("daftar"); // simpul konstruksi dinamis untuk (var i = count; i-;) {var lidom = document.createElement ('li'); Ullist.AppendChild (LIDOM); } // mengikat klik peristiwa var linode = Ullist.getElementByTagname ("li"); untuk (var i = 0, l = linodes.length; i <l; i ++) {linode [i] .Onclick = function () {// li klik event}}Seperti yang kita semua tahu, operasi DOM sangat memakan kinerja. Jadi ikatan acara berulang hanyalah pembunuh kinerja. Gagasan inti dari proxy acara adalah mendengarkan sebanyak mungkin peristiwa melalui binding sesedikit mungkin. Bagaimana cara melakukannya? Jawabannya adalah menggunakan mekanisme gelembung peristiwa untuk mengikat Node UL induk (gelembung peristiwa), dan kemudian menggunakan Event.target untuk menentukan simpul mana yang memicu acara tersebut, sehingga mengurangi pengikatan banyak penhawan.
var count = 100; var ullist = document.getElementById ("daftar"); // simpul konstruksi dinamis untuk (var i = count; i-;) {var lidom = document.createElement ('li'); Ullist.AppendChild (LIDOM); } // mengikat klik peristiwa var linode = Ullist.getElementByTagname ("li"); linode.onClick = function (e) {if (e.target && e.target.nodename.touppercase == "li") {// li klik event}}Konten baru akan diperbarui terus menerus ...