さらに5つのJavaScriptインタビューエクササイズ

以前の記事「5つの典型的なJavaScriptインタビューエクササイズ」のフォローアップ、この作品は、重要なJavaScriptの概念に焦点を当てた追加の一般的なインタビューの質問を探ります。 飛び込みましょう！

キーテイクアウト：

• 閉鎖は非常に重要です：閉鎖を理解することが不可欠です。閉鎖内の変動値は、ハンドラーの作成時に固定されていないことを忘れないでください。それらは、ハンドラーが実行されるときの現在の値を反映しています
• オペレーターの癖：typeof「アレイ」ではなく「オブジェクト」を返します。 typeof []を使用して、アレイタイプを確実に確認します。instanceof
• イベントループメカニクス：ブラウザのイベントループがイベントキューを管理します。 、遅延がゼロであっても、後で実行するためのコールバックをキューにします。 setTimeout()
• 関数の最適化：常に入力を検証します（負の数字、0、1はプライムではありません; 2は唯一のプライムです）。 入力の平方根までの分裂性をテストすると、効率が大幅に向上します。 isPrime()
質問1：閉鎖 - 古典的な問題

このコードを検討してください：

最初と4番目のボタンをクリックすると、出力は何ですか？なぜ？

var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', function() {
        console.log('You clicked element #' + i);
    });
}

回答：

これは閉鎖動作を強調します。コードには「要素＃[ボタンの数]」を2回クリックします。 変数は、すべてのイベントハンドラーで共有されます。ボタンがクリックされるまでに、ループが終了し、が最終値（ボタンの数）を保持します。

質問2：閉鎖の問題の修正ii

前のコードを変更して、ボタンのインデックスを正しく印刷します（1つ目は0、2番目の場合は1など）。

回答：

2つのソリューション：

ソリューション1（iife）：

ソリューション2（ラッパー関数）：

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));
}

質問3：データ型gotchas

これの出力は何ですか？

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));
}

回答：

console.log(typeof null);
console.log(typeof {});
console.log(typeof []);
console.log(typeof undefined);

配列の驚くべき「オブジェクト」に注意してください。 正確な配列タイプチェックには

を使用してください。

質問4：イベントループ順序

<code>object
object
object
undefined</code>

myArray instanceof Array出力とその理由は何ですか？

回答：

function printing() {
    console.log(1);
    setTimeout(function() { console.log(2); }, 1000);
    setTimeout(function() { console.log(3); }, 0);
    console.log(4);
}

printing();

イベントループがこれを説明しています。 0ms遅延がある場合でも、

コールバックがキューに登録されます。 メインスレッドが完了した後に実行されます 質問5： algorithm

<code>1
4
3
2</code>

数値がプライムの場合はsetTimeoutを返す関数を書きます。そうでなければ。

回答：isPrime()

var nodes = document.getElementsByTagName('button');
for (var i = 0; i < nodes.length; i++) {
    nodes[i].addEventListener('click', function() {
        console.log('You clicked element #' + i);
    });
}

この最適化されたバージョンは、入力検証を処理し、正方形まで奇数をチェックします。

結論：

これらの演習は、インタビューで頻繁にテストされる基本的なJavaScriptの概念をカバーしています。 これらを練習して理解を強化し、インタビューのパフォーマンスを向上させてください。

以上がさらに5つのJavaScriptインタビューエクササイズの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。