Lebih banyak pertanyaan telah dikumpulkan oleh saya sepanjang jalan, dan ada juga tahun -tahun sebelumnya. Jawabannya tidak dijamin benar. Jika ada kesalahan atau solusi yang lebih baik, harap perbaiki.
Melampirkan Artikel Kedua: Pertanyaan Wawancara Uji Tertulis Tertulis 2014 untuk BAT dan Perusahaan Internet Utama-HTML, CSS
Pertanyaan sebelumnya akan sangat mendasar dan semakin banyak Anda pergi, semakin banyak Anda, semakin Anda akan mendalam.
Junior Javascript:
1. Bahasa macam apa yang merupakan JavaScript dan apa karakteristiknya?
Tidak ada jawaban standar.
2. Apa tipe data JavaScript?
Tipe Data Dasar: String, Boolean, Angka, Tidak Ditentukan, Null
Jenis Data Referensi: Objek (Array, Tanggal, Regexp, Fungsi)
Jadi pertanyaannya adalah, bagaimana menentukan apakah suatu variabel adalah tipe data array?
• Metode 1. Tentukan apakah memiliki "properti array", seperti metode slice (). Anda dapat mendefinisikan metode slice untuk variabel ini sendiri, jadi terkadang gagal
• Metode 2.Obj Contoh array tidak benar dalam beberapa versi IE
• Metode 3. Ada kerentanan di kedua metode. Metode baru array.isArray () didefinisikan dalam ECMA Script5 untuk memastikan kompatibilitasnya. Metode terbaik adalah sebagai berikut
if (typeof array.isArray === "tidak terdefinisi") {array.isArray = function (arg) {return object.prototype.toString.call (arg) === "[array objek]"}; }3. Di kotak input input dengan ID yang diketahui, saya berharap mendapatkan nilai input dari kotak input ini. Bagaimana cara melakukannya? (Tidak ada kerangka kerja pihak ketiga)
Salinan kode adalah sebagai berikut: document.getElementById ("id").
4. Bagaimana cara mendapatkan semua kotak centang di halaman? (Tidak ada kerangka kerja pihak ketiga)
var domlist = document.geteLementsByTagname ('input') var centang kotak = []; var len = domlist.length; // cache ke variabel lokal while (len--) {// gunakan sementara akan lebih efisien daripada untuk loop if (domlist [len] .type == 'centang kotak') {centangboxlist.push (domlist [len]); }}5. Atur konten HTML dari Div dengan ID yang Diketahui ke XXXX, dan Warna Font diatur ke Hitam (tidak ada bingkai pihak ketiga)
Salinan kode adalah sebagai berikut:
var dom = document.getElementById ("id");
dom.innerhtml = "xxxx"
dom.style.color = "#000"
6. Ketika sebuah simpul DOM diklik, kami berharap dapat menjalankan fungsi. Apa yang harus kita lakukan?
• mengikat peristiwa langsung di DOM: <Div onClick = "test ()"> </div>
• Mengikat melalui OnClick di JS: xxx.onClick = tes
• Binding by Event Penambahan: AddEventListener (xxx, 'klik', tes)
Jadi pertanyaannya adalah, apa model aliran acara JavaScript?
• "Bubble Event": Acara mulai diterima oleh elemen paling spesifik dan kemudian menyebar ke atas langkah demi langkah
• "Acara Pengambilan": Acara diterima terlebih dahulu dengan simpul yang paling tidak spesifik, dan kemudian turun langkah demi langkah, sampai ke yang paling spesifik
• "Aliran Acara Dom": Tiga Tahapan: Pengambilan Acara, Target Tahap, Gelembung Acara
7. Apa itu Ajax dan Json, pro dan kontra mereka.
Ajax adalah JavaScript asinkron dan XML untuk mengimplementasikan interaksi data asinkron di halaman web.
keuntungan:
• Dapatkah halaman memuat konten lokal tanpa membebani semua konten, mengurangi jumlah transmisi data
• Hindari pengguna yang terus menyegarkan atau melompat halaman untuk meningkatkan pengalaman pengguna
kekurangan:
• Tidak ramah pada mesin pencari (
• Biaya menerapkan fungsi depan dan belakang di bawah Ajax tinggi
• dapat menyebabkan peningkatan jumlah permintaan
• Pembatasan masalah lintas domain
JSON adalah format pertukaran data ringan, subset dari ECMA
Keuntungan: Ringan, mudah dibaca dan ditulis oleh orang, mudah diurai oleh mesin (JavaScript), dan mendukung tipe data komposit (array, objek, string, angka)
8. Lihat apa output dari kode berikut ini? Jelaskan alasannya.
Salinan kode adalah sebagai berikut:
var a;
waspada (typeof a); // belum diartikan
waspada (b); // Laporkan kesalahan
Penjelasan: Tidak ditentukan adalah tipe data dengan hanya satu nilai. Nilai ini "tidak ditentukan". Ketika suatu variabel dinyatakan menggunakan VAR tetapi penugasannya tidak diinisialisasi, nilai variabel ini tidak ditentukan. Dan B akan melaporkan kesalahan karena tidak dinyatakan. Perhatikan bahwa variabel yang tidak diumumkan berbeda dari yang dinyatakan tidak ditugaskan.
9. Lihatlah kode berikut, output apa? Jelaskan alasannya.
Salinan kode adalah sebagai berikut:
var a = null;
waspada (typeof a); //obyek
Penjelasan: NULL adalah tipe data dengan hanya satu nilai, dan nilai ini nol. Ini menunjukkan bahwa penunjuk nol ditargetkan, jadi menggunakan tipe deteksi akan mengembalikan "objek".
10. Lihatlah kode berikut, output apa? Jelaskan alasannya.
var tidak terdefinisi; tidak terdefinisi == null; // true1 == true; // true2 == true; // false0 == false; // true0 == ''; // truenan == nan; // false [] == false; // true [] ==! []; // BENAR
• Tidak ditentukan sama dengan nol, tetapi tidak identik (===)
• Ketika satu nomor dan yang lainnya adalah string, itu akan mencoba untuk mengonversi string ke nomor
• Cobalah untuk mengonversi boolean menjadi nomor, 0 atau 1
• Cobalah untuk mengonversi objek menjadi angka atau string, tergantung pada jenis jumlah perbandingan lain
• Oleh karena itu, untuk penilaian 0 dan string kosong, disarankan untuk menggunakan "===". "===" pertama -tama akan menentukan jenis nilai di kedua sisi, dan itu akan salah jika jenisnya tidak cocok.
Jadi pertanyaannya adalah, lihat kode berikut, apa output itu, dan mengapa jenis foo?
Salinan kode adalah sebagai berikut:
var foo = "11"+2- "1";
console.log (foo);
console.log (typeof foo);
Setelah eksekusi, nilai FOO adalah 111 dan jenis foo adalah angka.
Salinan kode adalah sebagai berikut:
var foo = "11" +2+ "1"; // mengalami perbedaan antara menambahkan string '1' dan mengurangi string '1'
console.log (foo);
console.log (typeof foo); Setelah eksekusi, nilai FOO adalah 1121 (di sini adalah splicing string), dan jenis foo adalah string.
11. Lihatlah kode untuk memberikan jawabannya.
Salinan kode adalah sebagai berikut:
var a = objek baru ();
a.value = 1;
b = a;
b.value = 2;
peringatan (a.value);
Jawaban: 2 (periksa detail tipe data yang dikutip)
12. Array var StringArray = ["this", "is", "Baidu", "Campus"] diketahui, dan output waspada "Ini adalah kampus Baidu".
Jawaban: Peringatan (StringArray.join (""))
Maka masalahnya adalah, ada diketahui bahwa string foo = "get-element-by-id", tulis fungsi untuk mengubahnya menjadi notasi unta "getElementById".
function combo (msg) {var arr = msg.split ("-"); var len = arr.length; // menyimpan arr.length dalam variabel lokal dapat meningkatkan efisiensi loop untuk (var i = 1; i <len; i ++) {arr [i] = arr [i] .charat (0) .tuppercase ()+arr [i] .substr (1, arr [i] .length-1); } msg = arr.join (""); mengembalikan msg;}(Selidiki API Dasar)
13.var numberArray = [3,6,2,4,1,5]; (Selidiki API Dasar)
1) Menerapkan urutan terbalik dari array dan output ini [5,1,4,2,6,3]
2) Menerapkan pengaturan pesanan yang menurun dari array dan output [6,5,4,3,2,1]
var numberArray = [3,6,2,4,1,5]; numberArray.reverse (); // 5,1,4,2,6,3numberarray.sort (fungsi (a, b) {// 6,5,4,3,2,1 return ba;})14. Output Tanggal hari ini, dalam bentuk yyyy-mm-dd. Misalnya, hari ini adalah 26 September 2014, lalu output 2014-09-26
var d = Tanggal baru (); // Dapatkan tahun, getlyear () mengembalikan angka 4 digit var tahun = .getlyEar (); // Dapatkan bulan, bulan ini cukup istimewa, 0 Januari, dan 11 adalah bulan Desember var bulan = d.getMonth () + 1; // Menjadi dua digit bulan = bulan <10? '0' + bulan: bulan; // Dapatkan hari var hari = d.getDate (); hari = hari <10? '0' + Day: Day; waspada (tahun + '-' + bulan + '-' + hari);
15. Ganti {$ id} di string "<tr> <td> {$ id} </td> <td> {$ name} </td> </tr>" dengan 10, dan {$ name} dengan Tony (menggunakan ekspresi reguler)
Jawaban: "<tr> <td> {$ id} </td> <td> {$ id} _ {$ name} </td> </tr>". Ganti (/{/$ id}/g, '10'). Ganti (/{/$ name}/g, 'Tony');
16. Untuk memastikan keamanan output halaman, kita sering perlu melarikan diri dari beberapa karakter khusus. Harap tulis fungsi EscapeHtml dan Escape <,>, &, "
Fungsi EscapeHtml (str) {return str.Replace (/[<> "&]/g, function (match) {switch (match) {case" <": return" <"; case"> ": return"> "; case" & return "&"; case "/": return "";});}17.foo = foo || bar, apa arti baris kode ini? Mengapa saya menulis dengan cara ini?
Jawaban: if (! Foo) foo = bar; // Jika ada foo, nilainya tetap tidak berubah, jika tidak, nilai bilah ditugaskan untuk FOO.
Ekspresi sirkuit pendek: sebagai ekspresi operan dari "&&" dan "||" Operator, ketika ekspresi ini dievaluasi, proses evaluasi akan berakhir selama hasil akhir dapat ditentukan untuk menjadi benar atau salah. Ini disebut evaluasi sirkuit pendek.
18. Melihat kode berikut, apa yang akan menjadi output? (Peningkatan Deklarasi Variabel)
Salinan kode adalah sebagai berikut:
var foo = 1;
fungsi(){
console.log (foo);
var foo = 2;
console.log (foo);
}
Jawaban: Output tidak ditentukan dan 2. Kode di atas setara dengan:
var foo = 1; function () {var foo; console.log (foo); // foo yang tidak ditentukan = 2; console.log (foo); // 2; }Deklarasi fungsi dan deklarasi variabel secara implisit dipromosikan ke atas ruang lingkup saat ini oleh mesin JavaScript, tetapi hanya mempromosikan nama tidak mempromosikan bagian penugasan.
19. Gunakan JS untuk secara acak memilih 10 angka antara 10 dan 100, simpan ke dalam array, dan urutkan.
var iarray = []; fungsi getRandom (start, iend) {var ichoice = isStart - iend +1; return math.floor (math.random () * ichoice+isStart;} untuk (var i = 0; i <10; i ++) {iarray.push (getRandom (10.100));} iarray.sort ();20. Gabungkan kedua angka dan hapus elemen kedua.
Salinan kode adalah sebagai berikut:
var array1 = ['a', 'b', 'c'];
var barray = ['d', 'e', 'f'];
var carray = array1.concat (barray);
carray.splice (1,1);
21. Cara Menambahkan, Menghapus, Pindahkan, Salin, Buat dan Temukan Node (JS Asli, Dasar -Dasar Nyata, Tidak Ada Penulisan Detail dari Setiap Langkah)
1) Buat simpul baru
CreateDocumentFragment () // Buat fragmen DOM
createElement () // Buat elemen tertentu
createTextNode () // Buat node teks
2) Tambahkan, Hapus, Ganti, Sisipkan
ovendChild () // Tambah
removechild () // hapus
replacechild () // ganti
InsertBefore () // Masukkan
3) Cari
GetElementsByTagname () // dengan nama tag
GetElementsByName () // Nilai Properti Nama Elemen dilewatkan
getElementById () // melalui ID elemen, keunikan
22. Ada url seperti itu: http://item.taobao.com/item.htm?a=1&b=2&c=&d=xxx&e. Harap tulis program JS untuk mengekstrak setiap parameter GET di URL (nama parameter dan jumlah parameter tidak pasti), dan mengembalikannya ke struktur JSON dalam bentuk nilai kunci, seperti {a: '1', b: '2', c: '', d: 'xxx', e:} yang tidak ditentukan.
Menjawab:
function serilizeUrl (url) {var result = {}; url = url.split ("?") [1]; var peta = url.split ("&"); untuk (var i = 0, len = map.length; i <len; i ++) {hasil [peta [i] .split ("=") [0]] = peta [i] .split ("=") [1]; } return hasil;}23. Apa perbedaan antara konstruktor ekspresi reguler var reg = regexp baru ("xxx") dan ekspresi reguler literal var reg = //? Kotak surat yang cocok dengan ekspresi reguler?
Jawaban: Saat menggunakan konstruktor regexp (), Anda tidak hanya perlu melarikan diri dari kutipan (mis. /"Berarti"), tetapi Anda juga perlu juga menggandakan backslash (mis. // berarti A /). Menggunakan literal ekspresi reguler lebih efisien.
Pencocokan email rutin:
Salinan kode adalah sebagai berikut: var Regmail = /^(ace-za-z0-9_-ubungi)+@(öa-za-z0-9_-ubungi)+(.hta-za-z0-9_- media {2,3 --) {1,2 --)$/;
24. Lihatlah kode berikut dan berikan hasil output.
Salinan kode adalah sebagai berikut:
untuk (var i = 1; i <= 3; i ++) {
setTimeout (function () {
console.log (i);
}, 0);
};
Jawaban: 4 4 4.
Penyebab: Prosesor acara JavaScript tidak akan berjalan sampai utas menganggur. Jadi pertanyaannya adalah, bagaimana membuat output kode di atas 1 2 3?
untuk (var i = 1; i <= 3; i ++) {setTimeOut ((function (a) {// Secara instan menjalankan fungsi console.log (a);}) (i), 0); }; 1 // output 2325. Tulis fungsi untuk menghapus spasi sebelum dan sesudah string. (Kompatibel dengan semua browser)
Gunakan trim antarmuka bawaan (), mempertimbangkan kompatibilitas:
if (! string.prototype.trim) {string.prototype.trim = function () {return this.replace (/^/s+/, "") .replace (// s+$/, ""); }} // uji fungsi var str = " /t /n string uji" .trim (); alert (str == "test string"); // peringatan "true"26. Apa peran Callee dan Caller dalam JavaScript?
Menjawab:
Penelepon mengembalikan referensi ke fungsi yang memanggil fungsi saat ini;
Callee mengembalikan fungsi fungsi yang dijalankan, yaitu, tubuh objek fungsi yang ditentukan.
Jadi pertanyaannya adalah? Jika sepasang kelinci melahirkan sepasang kelinci setiap bulan; Sepasang kelinci baru akan melahirkan kelinci dari bulan kedua; Dengan asumsi bahwa setiap pasangan kelinci adalah satu betina dan satu jantan, berapa pasang kelinci yang dapat dibiakkan sepasang kelinci dalam bulan n? (Gunakan callee untuk menyelesaikan)
var result = []; function fn (n) {// Urutan fibonacci khas jika (n == 1) {return 1; } lain jika (n == 2) {return 1; } else {if (hasil [n]) {return hasil [n]; } else {//argument.callee () berarti fn () hasil [n] = arguments.callee (n-1)+argumen.callee (n-2); hasil pengembalian [n]; }}}JavaScript menengah:
1. Menerapkan klon fungsi yang dapat menyalin 5 tipe data utama dalam JavaScript (termasuk angka, string, objek, array, boolean)
• Titik pencarian 1: Apakah jelas apakah perbedaan antara tipe data dasar dan tipe data referensi disimpan dalam memori?
• Titik pencarian 2: Apakah Anda tahu cara menentukan jenis variabel apa itu?
• Titik inspeksi 3: Desain algoritma rekursif
// Metode 1: Object.prototype.clone = function () {var o = this.constructor === Array? []: {}; untuk (var e di ini) {o [e] = typeof ini [e] === "objek"? ini [e] .clone (): ini [e]; } return o;} // Metode 2:/** * Kloning objek * @param obj * @returns */function clone (obj) {var buf; if (obj instance dari array) {buf = []; // Buat array kosong var i = obj.length; while (i--) {buf [i] = clone (obj [i]); } return buf; } else if (obj instance dari objek) {buf = {}; // Buat objek kosong untuk (var k dalam obj) {// tambahkan atribut baru ke objek ini buf [k] = clone (obj [k]); } return buf; } else {// variabel biasa secara langsung menetapkan pengembalian obj; }}2. Bagaimana cara menghilangkan elemen duplikat dalam array?
var arr = [1,2,3,3,4,4,5,5,6,1,9,3,25,4]; function diPeat () {var newarr = []; var obj = {}; indeks var = 0; var l = arr.length; untuk (var i = 0; i <l; i ++) {if (obj [arr [i]] == tidak terdefinisi) {obj [arr [i]] = 1; newarr [index ++] = arr [i]; } lain jika (obj [arr [i]] == 1) lanjutkan; } return newarr; } var newarr2 = Derepeat (arr); waspada (newarr2); // output 1,2,3,4,5,6,9,253. Xiaoxian adalah anak anjing yang lucu (anjing), dan teriakannya sangat bagus. Setiap kali dia melihat pemiliknya, dia akan berteriak (Yelp). Dari deskripsi ini, Anda bisa mendapatkan objek berikut:
function dog () {this.wow = function () {alert ('wow'); } this.yelp = function () {this.wow (); }}Seperti Xiaoxian, Xiaomang ternyata adalah anak anjing yang lucu, tetapi tiba -tiba suatu hari dia menjadi gila (Maddog), dan ketika dia melihat seseorang, dia akan berteriak (wow) dan terus memanggil (Yelp) setiap setengah detik. Harap gunakan kode untuk mengimplementasikannya sesuai dengan deskripsi. (Warisan, prototipe, setInterval)
Menjawab:
function maddog () {this.yelp = function () {var self = this; setInterval (function () {self.wow ();}, 500); }} Maddog.prototype = new dog (); // untuk testvar dog = new dog (); dog.yelp (); var maddog = new maddog (); maddog.yelp ();4. UL berikut, bagaimana mengingatkan indeksnya saat mengklik pada setiap kolom? (penutup)
Salinan kode adalah sebagai berikut:
<ul id = "test">
<li> Ini adalah yang pertama </li>
<li> Ini adalah yang kedua </li>
<li> Ini adalah item ketiga </li>
</ul>
Menjawab:
// Metode 1: var lis = document.geteLementById ('2223'). GetElementsByTagname ('li'); untuk (var i = 0; i <3; i ++) {lis [i] .index = i; lis [i] .Onclick = function () {alert (this.index); };} // Metode 2: var lis = document.geteLementById ('2223'). GetElementsByTagname ('li'); untuk (var i = 0; i <3; i ++) {lis [i] .index = i; lis [i] .Onclick = (function (a) {return function () {waspada (a);}}) (i);}5. Tulis fungsi JavaScript dan masukkan pemilih jenis yang ditentukan (hanya tiga selektor CSS sederhana: ID, kelas, dan tagname, dan tidak ada pemilih kombinasi yang kompatibel yang diperlukan) untuk mengembalikan node DOM yang cocok, yang perlu mempertimbangkan kompatibilitas dan kinerja browser.
/*** @param pemilih {string} pemilih CSS yang masuk. * @return {array}*/
Jawaban: (terlalu lama, klik untuk membuka)
var query = function (selector) {var reg = /^(#)?(/.)?(/w+)$/img; var regresult = reg.exec (pemilih); var result = []; // Jika itu adalah pemilih ID if (regResult [1]) {if (regResult [3]) {if (typeof document.queryselector === "function") {result.push (document.queryselector (regReSult [3])); } else {result.push (document.getElementById (regResult [3])); }}} // Jika itu adalah pemilih kelas lain jika (regResult [2]) {if (regResult [3]) {if (typeof document.geteLementsbyclassname === 'function') {var doms = document.getElementsbyclassname (RegReSult [3]); if (DOMS) {result = convertoArray (DOMS); }} // Jika fungsi GetElementsByClassName tidak didukung lain {var alldoms = document.geteLementsByTagname ("*"); untuk (var i = 0, len = alldoms.length; i <len; i ++) {if (alldoms [i] .classname.search (regexp baru (regresult [2]))> -1) {result.push (Alldoms [i]); }}}}}}} // Jika itu adalah pemilih tag lain jika (regresult [3]) {var doms = document.geteLementsByTagname (regResult [3] .tolowerCase ()); if (doms) {result = convertoArray (DOMS); }} hasil pengembalian; } function convertoArray (node) {var array = null; coba {array = array.prototype.slice.call (node, 0); // untuk browser non -e} catch (ex) {array = new array (); untuk (var i = 0, len = node.length; i <len; i ++) {array.push (node [i])}} return array; }6. Harap evaluasi kode berikut dan berikan saran untuk perbaikan.
if (window.addeventListener) {var addlistener = fungsi (el, ketik, pendengar, usecapture) {el.addeventListener (ketik, pendengar, usecapture); };} else if (document.all) {addListener = function (el, ketik, pendengar) {el.attachevent ("on"+type, function () {listener.Apply (el);}); }}mengevaluasi:
• Fungsi AddListener tidak boleh dinyatakan dalam pernyataan IF dan yang lain, itu harus dinyatakan terlebih dahulu;
• Tidak perlu menggunakan window.addeventListener atau dokumen. Semua untuk mendeteksi browser, deteksi kemampuan harus digunakan;
• Karena attachEvent memiliki masalah penunjuk ini di IE, itu perlu ditangani saat menyebutnya
Perbaikan adalah sebagai berikut:
fungsi addevent (elem, type, handler) {if (elem.addeventListener) {elem.addeventListener (type, handler, false); } lain jika (elem.attachevent) {elem ['temp' + type + handler] = handler; elem [type + handler] = function () {elem ['temp' + type + handler] .Apply (elem); }; elem.attachevent ('on' + type, elem [type + handler]); } else {elem ['on' + type] = handler; }}7. Tambahkan metode ke objek string, lewati parameter tipe string, dan kemudian mengembalikan ruang harga antara setiap karakter string, misalnya:
AddSpace ("Hello World") // -> 'HelloWorld D'
Salinan kode adalah sebagai berikut:
String.prototype.spacify = function () {
kembalikan this.split (''). gabungkan ('');
};
Kemudian jawab pertanyaan di atas, maka pertanyaannya
1) Apakah aman untuk menambahkan metode langsung ke prototipe objek? Terutama pada objek objek. (Saya tidak bisa menjawab ini? Saya harap saya akan memberi tahu Anda apa yang saya tahu.)
2) Apa perbedaan antara deklarasi fungsi dan ekspresi fungsi?
Jawaban: Dalam JavaScript, ketika parser memuat data ke lingkungan eksekusi, ia tidak memperlakukan deklarasi fungsi dan ekspresi fungsi secara merata. Parser akan menjadi yang pertama membaca deklarasi fungsi dan membuatnya tersedia (dapat diakses) sebelum menjalankan kode apa pun. Adapun ekspresi fungsi, Anda harus menunggu sampai parser dieksekusi ke baris kode di mana ia berada sebelum akan diuraikan dan dieksekusi. (Fungsi Deklarasi Promosi)
8. Tentukan metode log sehingga dapat proxy console.log Metode.
Metode yang layak:
Salinan kode adalah sebagai berikut:
function log (msg) {
console.log (msg);
}
Log ("Halo Dunia!") // Halo Dunia!
Bagaimana jika Anda ingin melewati beberapa parameter? Jelas metode di atas tidak dapat memenuhi persyaratan, jadi metode yang lebih baik adalah:
Salinan kode adalah sebagai berikut:
function log () {
console.log.Apply (konsol, argumen);
};
Jadi pertanyaannya adalah, apa persamaan dan perbedaan antara metode berlaku dan panggilan?
Menjawab:
Dua fungsi Apply and Call adalah sama, yaitu, memanggil satu metode objek dan mengganti objek saat ini dengan objek lain. Mengubah konteks objek suatu fungsi dari konteks awal ke objek baru yang ditentukan oleh ThisoBJ.
Tetapi ada perbedaan dalam parameter antara keduanya. Arti parameter pertama adalah sama, tetapi untuk parameter kedua: berlaku dilewatkan dalam array parameter, yaitu, menggabungkan beberapa parameter ke dalam array, dan panggilan dilewatkan sebagai parameter panggilan (mulai dari parameter kedua). Misalnya, metode penulisan aplikasi yang sesuai untuk func.call (func1, var1, var2, var3) adalah: func.Apply (func1, [var1, var2, var3]).
9. Apa itu array semu di JavaScript? Bagaimana cara mengubah array semu menjadi array standar?
Menjawab:
Pseudo-array (Class Array): Anda tidak dapat memanggil metode array secara langsung atau mengharapkan perilaku khusus atribut panjang, tetapi Anda masih dapat melintasi mereka pada metode traversal array nyata. Biasanya, parameter argumen fungsi juga disebut GetElementsByTagname, Document.childnodes, dll., Dan mereka semua mengembalikan objek nodelist yang termasuk pseudo-array. Array dapat dikonversi menjadi objek array nyata menggunakan array.prototype.slice.call (fakeArray).
Misalkan kita mengikuti batang pertanyaan kedelapan, kita perlu menambahkan awalan "(aplikasi)" ke setiap metode log, seperti 'halo dunia!' -> '(Aplikasi) Halo Dunia!'. Metode ini adalah sebagai berikut:
function log () {var args = array.prototype.slice.call (argumen); // Untuk menggunakan metode array unshift, ubah argumen menjadi array nyata args.unshift ('(app)'); console.log.Apply (konsol, args); };10. Untuk memahami konteks lingkup dan ini, lihat kode berikut:
var user = {count: 1, getCount: function () {return this.count; }}; console.log (user.getCount ()); // apa? var func = user.getCount; console.log (func ()); // Apa?Apa output dari dua konsol? Mengapa?
Jawabannya adalah 1 dan tidak terdefinisi.
FUNC dieksekusi dalam konteks Winodw, sehingga properti Count tidak dapat diakses.
Maka pertanyaannya adalah, bagaimana memastikan UESR selalu dapat mengakses konteks func, yaitu, mengembalikan 1 dengan benar.
Jawaban: Cara yang benar adalah menggunakan function.prototype.bind. Kompatibel dengan kode lengkap masing -masing browser adalah sebagai berikut:
Function.prototype.bind = function.prototype.bind || fungsi (konteks) {var self = this; return function () {return self.apply (konteks, argumen); };} var func = user.getCount.bind (user); console.log (func ());11. Apa perbedaan antara Window JS Native. Bagaimana cara mengimplementasikan metode siap JQ menggunakan JS asli?
Metode window.onload () harus menunggu sampai semua elemen termasuk gambar di halaman dimuat sebelum eksekusi.
$ (dokumen) .ready () dieksekusi setelah struktur DOM ditarik, dan tidak perlu menunggu sampai dimuat.
/* * Pass the function to whenReady() * When the document is parsed and ready for the operation, the function is called as the method of the document */var whenReady = (function() { //This function returns whenReady() function var funcs = []; // When the event is obtained, the function to be run var ready = false; // When the event handler is triggered, switch to true // When the document is ready, call the event handler function Handler (E) {if (Ready) Return; // Pastikan bahwa event handler hanya berjalan sekali // jika peristiwa OnReadyStateChange terjadi, tetapi keadaannya tidak lengkap, maka Dokumen belum siap jika (E.Type === 'FoundStatechange' && Document.ReadyState! // Jika panggilan fungsi -fungsi ini dapat menyebabkan lebih banyak fungsi terdaftar (var i = 0; i <func.length; i ++) {funcs [i] .call (dokumen); funcs = null; } // Daftarkan pawang untuk acara apa pun yang diterima IF (document.addeventListener) {document.addeventListener ('domContentLoaded', handler, false); document.addeventlistener ('readystatechange', handler, false); // ie9+ window.addeventListener ('muat', pawang, false); } else if (document.attachevent) {document.attachevent ('onreadystatechange', handler); window.attachevent ('onload', handler); } // return wheweady () function function function whenready (fn) {if (ready) {fn.call (dokumen); } else {func.push (fn); }}}) ();Jika kode di atas sangat sulit untuk dipahami, versi sederhana berikut:
function ready (fn) {if (document.addeventlistener) {// standar browser document.addeventListener ('domContentLoaded', function () {// event login untuk menghindari pemicu berulang document.removeeventener ('domContentLoaded', argument.callee, false); fales; false (false ('domContentLoaded', arguments.callee, false); fales; false (false ('domContentLoaded', arguments.callee, false); fales; false (false ('domContentLoaded' } else if (document.attachevent) {// ie document.attachevent ('onreadystatechange', function () {if (document.readystate == 'complete') {document.detachevent ('onreadystatechange', arguments.callee); fn (); // function}}}}}}; }};12. (Pertanyaan Desain) Ingin menerapkan hambatan pada simpul halaman tertentu? Bagaimana cara melakukannya? (Gunakan JS asli)
Jawab saja konsepnya, berikut adalah beberapa poin kunci
1. Bind mousedown, mousemove, peristiwa mouseup ke node yang perlu diseret
2. Setelah acara mousedown dipicu, mulai menyeret dan menyeret
3. Saat mousemove, Anda perlu mendapatkan posisi seret melalui event.clientx dan clienty, dan perbarui posisi secara real time.
4. Saat mouseup, seret dan jatuhkan ujungnya
5. Perhatikan batas browser
13.
fungsi setCookie (name, value, days) {// tambahkan variabel waktu ke cookie var exp = new date (); exp.settime (exp.getTime () + hari*24*60*60*1000); // Atur dokumen waktu kedaluwarsa ke hari. } function getCookie (name) {var result = ""; var mycookie = ""+document.cookie+";"; var searchName = "+name+" = "; var startofcookie (name) {var result =" "; var mycookie =" "+document.cookie+"; "; var searchName ="+name+"="; var startofcookie = mycookie.indexof (searchName); var endofcookie; if (satrtofcookie! = -1) {startofcookie += searchName.length; endofcookie = mycookie.indexof (";", startofcookie); hasil = (mycookie.substring (startofcookie, endofcookie)); } return result;} (function () {var otips = document.geteLementById ('tips'); // Misalkan ID tips adalah tips var page = {check: function () {// periksa apakah cookie TIPS tidak ada dan memungkinkan tampilan tip var = getCookie ('Tips'); if (! if (tips == "never_show_again") mengembalikan false;}, hidetip: function (bnever) {if (bnever) setCookie ('Tips', 'never_show_again', 365); Tips adalah elemen tingkat baris}, function () {var _this = ini;14. Katakan apa fungsi fungsi berikut? Apa yang harus diisi di area kosong?
// define (function (window) {function fn (str) {this.str = str;} fn.prototype.format = function () {var arg = ______; return this.str.replace (_____, function (a, b) {return arg [b] || ";}); _____, fnn = fn) {return arg [b] ||";});} window.fn = fn = fn; fn (<p> <a href = "{0}"> {1} </a> <span> {2} </span> </p> ');Jawaban: Tujuan mengakses fungsi adalah dengan menggunakan fungsi format untuk menggantikan parameter fungsi seperti {0} dan mengembalikan hasil yang diformat:
Kosong pertama adalah: argumen
Kosong kedua adalah: // {(/d+)/}/ig
15. Gunakan JavaScript berorientasi objek untuk memperkenalkan diri. (Tidak ada jawaban, silakan coba sendiri)
Jawaban: Objek atau JSON adalah pilihan yang baik.
16. Jelaskan prinsip menerapkan Ajax oleh JS asli.
Nama lengkap Ajax adalah JavaScript dan XML asinkron. Di antara mereka, asinkron berarti asinkron, yang berbeda dari metode sinkronisasi yang digunakan dalam pengembangan web tradisional.
Prinsip AJAX hanya untuk menggunakan objek XMLHTTPREQUEST untuk mengirim permintaan asinkron ke server, mendapatkan data dari server, dan kemudian menggunakan JavaScript untuk mengoperasikan DOM untuk memperbarui halaman.
XmlHttpRequest adalah mekanisme inti Ajax. Ini pertama kali diperkenalkan di IE5 dan merupakan teknologi yang mendukung permintaan asinkron. Sederhananya, JavaScript dapat segera membuat permintaan dan memproses respons ke server tanpa memblokir pengguna. Tidak mencapai efek refresh.
Properti objek XMLHTTPREQUEST adalah:
• OnReadyStateChang Pengawal Acara untuk acara yang dipicu oleh setiap perubahan negara bagian.
• ResponsEtext Mengembalikan bentuk string data dari proses server.
• Objek Data Dokumen yang kompatibel dengan DOM RESPONSML Dikembalikan dari proses server.
• Status kode numerik dikembalikan dari server, seperti Common 404 (tidak ditemukan) dan 200 (siap)
• Informasi string teks status disertai dengan kode status
• Nilai keadaan objek ReadyState
• 0 (tidak diinisialisasi) Objek telah ditetapkan, tetapi belum diinisialisasi (metode terbuka belum dipanggil)
• 1 (Inisialisasi) Objek telah ditetapkan dan metode kirim belum dipanggil
• 2 (Kirim Data) Metode Kirim telah dipanggil, tetapi status saat ini dan header HTTP tidak diketahui
• 3 (transmisi data) Beberapa data telah diterima, karena respons dan header HTTP tidak lengkap, kesalahan akan terjadi ketika responsbody dan responseText diperoleh.
• 4 (Lengkap) Data diterima, dan data respons lengkap dapat diperoleh melalui ResponseXML dan ResponseText.
Berikut ini adalah enkapsulasi fungsi sederhana: (sedikit panjang, klik untuk membuka)
AJAX ({url: "./testxhr.aspx", // Jenis Alamat Permintaan: "Posting", // METODE METODE PERMINTAAN: {Name: "Super", Usia: 20}, // Parameter Permintaan DataType: "JSON", Success: Function (Response, XML) {// Kode yang dieksekusi setelah penempatan yang berhasil}, gagal: FUNGSI: function AJAX (option) {options = options || {}; options.type = (options.type || "get"). Touppercase (); options.datatype = options.DataType || "json"; var params = formatParams (options.data); // create - non -e6 - Langkah 1 if (window.xmlHttpRequest) {var xhr = new xmlHttpRequest (); } else {// ie6 dan di bawah browser var xhr = new ActivexObject ('microsoft.xmlhttp'); } // terima - Langkah 3 xhr.onreadystatechange = function () {if (xhr.readystate == 4) {var status = xhr.status; if (status> = 200 && status <300) {options.success && option.success (xhr.responsetext, xhr.responsexml); } else {options.fail && options.fail (status); }}} // Sambungkan dan Kirim - Langkah 2 if (options.type == "get") {xhr.open ("get", options.url + "?" + Params, true); xhr.send (null); } else if (options.type == "post") {xhr.open ("post", options.url, true); // Atur jenis konten saat mengirimkan formulir XHR.SetRequestheader ("tipe konten", "Aplikasi/X-WWW-Form-Urlencoded"); xhr.send (params); }} // Format Format Parameter FormatParams (data) {var arr = []; untuk (nama var dalam data) {arr.push (encodeuricomponent (name) + "=" + encodeuricomponent (data [name])); } arr.push (("v =" + math.random ()). ganti (".")); return arr.join ("&"); }Kode di atas secara kasar menggambarkan proses AJAX, dan penjelasannya di -Google sendiri. Pertanyaannya belum selesai. Tahukah Anda apa itu JSONP dan PJAX?
Menjawab:
JSONP: (JSON dengan padding) adalah metode permintaan lintas domain. Prinsip utamanya adalah memanfaatkan fitur yang dapat diminta oleh tag skrip di seluruh domain. Atribut SRC mengirimkan permintaan ke server, server mengembalikan kode JS, halaman web menerima respons, dan kemudian menjalankannya secara langsung. Ini sama dengan prinsip referensi file eksternal melalui tag skrip. JSONP terdiri dari dua bagian: fungsi callback dan data. Fungsi panggilan balik umumnya dikendalikan oleh halaman web dan dikirim ke sisi server sebagai parameter. Sisi server mengeja fungsi dan data menjadi string dan kembali.
PJAX: PJAX adalah teknologi baru berdasarkan AJAX+History.pushstate. This technology can change the content of a page without refresh and can change the URL of the page. (Keypoint: It can implement back functions that cannot be achieved by ajax) pjax is an encapsulation of ajax+pushState, and supports local storage, animation and other functions. Currently, it supports various versions such as jquery, qwrap, kissy, etc.
觉得题目还ok的亲点个推荐哦，题量会不断增加。
你可能会感兴趣：BAT及各大互联网公司2014前端笔试面试题--Html,Css篇
暂且贴出我做出答案的部分。有时间把未做出答案也贴出来。针对文中各题，如有更好的解决方法或者错误之处，各位亲务必告知我，误人子弟实乃罪过。
原文：http://www.cnblogs.com/coco1s/p/4029708.html