5 Lagi Latihan Temubual JavaScript

Mengikuti artikel terdahulu saya, "5 Latihan wawancara JavaScript tipikal," bahagian ini meneroka soalan wawancara umum tambahan, memberi tumpuan kepada konsep utama JavaScript. Mari kita menyelam!

Takeaways utama:

Penutupan adalah penting:

Memahami penutupan adalah penting. Ingat, nilai -nilai berubah dalam penutupan tidak ditetapkan pada masa penciptaan pengendali; Mereka mencerminkan nilai semasa apabila pengendali dijalankan.
Operator Quirks:
• kembali "objek," bukan "array." Gunakan typeof untuk memeriksa semula jenis array yang boleh dipercayai. typeof [] instanceof Mekanik Loop Event:
Gelung acara penyemak imbas menguruskan barisan acara.
• , walaupun dengan kelewatan sifar, beratur panggilan balik untuk pelaksanaan kemudian. setTimeout()
Pengoptimuman fungsi:
• Sentiasa mengesahkan input (nombor negatif, 0, 1 bukan perdana; 2 adalah satu -satunya perdana). Pengujian divisibilitas hanya sehingga akar kuadrat input meningkatkan kecekapan. isPrime()
Soalan 1: Penutupan - Masalah Klasik

Pertimbangkan kod ini:

Apakah output ketika mengklik butang pertama dan keempat? Kenapa?

<code class="language-javascript">var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', function() {
        console.log('You clicked element #' + i);
    });
}</code>

Jawab:

ini menyoroti tingkah laku penutupan. Kod ini akan mencetak "anda mengklik elemen #[nombor butang]" dua kali. Pembolehubah dikongsi di semua pengendali acara. Pada masa mana -mana butang diklik, gelung telah selesai, dan

memegang nilai terakhirnya (bilangan butang).

i i Soalan 2: Memperbaiki isu penutupan

Ubah suai kod sebelumnya untuk mencetak indeks butang dengan betul (0 untuk yang pertama, 1 untuk yang kedua, dll.).

Jawab:

Dua penyelesaian:

Penyelesaian 1 (Iife):

penyelesaian 2 (fungsi pembalut):

<code class="language-javascript">var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', (function(i) {
        return function() {
            console.log('You clicked element #' + i);
        };
    })(i));
}</code>

Soalan 3: Jenis Data Gotchas

<code class="language-javascript">function handlerWrapper(i) {
    return function() {
        console.log('You clicked element #' + i);
    };
}

var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', handlerWrapper(i));
}</code>

apa output ini?

Jawab:

<code class="language-javascript">console.log(typeof null);
console.log(typeof {});
console.log(typeof []);
console.log(typeof undefined);</code>

Perhatikan "objek" yang mengejutkan untuk tatasusunan. Gunakan

untuk pemeriksaan jenis array yang tepat.

<code>object
object
object
undefined</code>

myArray instanceof Array Soalan 4: Perintah gelung acara

apa output dan mengapa?

Jawab:

<code class="language-javascript">function printing() {
    console.log(1);
    setTimeout(function() { console.log(2); }, 1000);
    setTimeout(function() { console.log(3); }, 0);
    console.log(4);
}

printing();</code>

Gelung acara menerangkan ini.

Callbacks beratur, walaupun dengan kelewatan 0MS. Mereka melaksanakan selepas benang utama selesai.

<code>1
4
3
2</code>

setTimeout Soalan 5: Algoritma

isPrime() Tulis fungsi yang mengembalikan

jika nombor itu adalah perdana,

sebaliknya. isPrime(number) true false Jawab:

<code class="language-javascript">var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', function() {
        console.log('You clicked element #' + i);
    });
}</code>

versi yang dioptimumkan ini mengendalikan pengesahan input dan hanya memeriksa nombor ganjil sehingga akar kuadrat.

Kesimpulan:

Latihan ini meliputi konsep JavaScript asas yang sering diuji dalam wawancara. Amalkan ini untuk mengukuhkan pemahaman anda dan meningkatkan prestasi wawancara anda.

Atas ialah kandungan terperinci 5 Lagi Latihan Temubual JavaScript. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!