高度な JavaScript をマスターする: 重要なトピックと面接の質問

JavaScript は現代の Web 開発に不可欠な言語ですが、その高度な概念を習得すると、開発者として優れた能力を発揮できます。このブログでは、重要な高度な JavaScript トピックを検討し、次の面接で優れた成績を収めるために役立つ、面接の質問と回答と例を提供します。

1.クロージャ

クロージャとは何ですか?
クロージャは、外側の関数が戻った後でも外側のスコープへのアクセスを保持する関数です。

例：

function outerFunction(outerVariable) {
    return function innerFunction(innerVariable) {
        console.log(`Outer Variable: ${outerVariable}, Inner Variable: ${innerVariable}`);
    };
}

const closureFunction = outerFunction("Hello");
closureFunction("World");

出力:

Outer Variable: Hello, Inner Variable: World

インタビューの質問:
Q: クロージャは実際のシナリオでどのように使用できますか?
A: クロージャは、JavaScript でプライベート変数を実装したり、非同期コールバックで状態を維持したりするなど、データを隠すのに役立ちます。

2. Promise と Async/Await

約束とは何ですか?

約束は、現在、将来、または決して利用できない可能性のある値を表します。これらにより、非同期操作をより適切に処理できるようになります。

非同期/待機の例:

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => resolve("Data fetched"), 2000);
    });
}

async function getData() {
    try {
        const data = await fetchData();
        console.log(data);
    } catch (error) {
        console.error(error);
    }
}

getData();

出力:

Data fetched

インタビューの質問:
Q: Promise.then() と async/await の違いは何ですか?
A: Promise.then() は Promise を処理するために使用されるメソッドですが、async/await は非同期コードを同期的に見せるための糖衣構文を提供し、読みやすさを向上させます。

---

3.イベントループと同時実行モデル

イベント ループはどのように機能しますか?
イベント ループは、コールバックや非同期タスクなどの JavaScript コードの実行を処理します。

例:

console.log("Start");

setTimeout(() => {
    console.log("Timeout");
}, 0);

console.log("End");

出力:

Start
End
Timeout

インタビューの質問:
Q: コールスタックとイベントループの違いを説明してください。
A: コール スタックは関数の実行を追跡し、スタックが空になるとイベント ループによってコールバックなどの非同期タスクが確実に実行されます。

---

4.プロトタイプと継承

JavaScript のプロトタイプとは何ですか?

プロトタイプを使用すると、オブジェクトは他のオブジェクトからプロパティとメソッドを継承できます。

例:

function Person(name) {
    this.name = name;
}

Person.prototype.greet = function() {
    console.log(`Hello, my name is ${this.name}`);
};

const person1 = new Person("Alice");
person1.greet();

出力:

Hello, my name is Alice

インタビューの質問:
Q: プロトタイプ継承は古典的な継承とどのように異なりますか?
A: プロトタイプの継承は、他のオブジェクトから直接継承するオブジェクトに基づいていますが、古典的な継承はクラス階層に依存します。

---

5.カレー作り

カリー化とは何ですか？

カリー化は、複数の引数を持つ関数を、それぞれが 1 つの引数を取る一連の関数に変換します。

例：

function outerFunction(outerVariable) {
    return function innerFunction(innerVariable) {
        console.log(`Outer Variable: ${outerVariable}, Inner Variable: ${innerVariable}`);
    };
}

const closureFunction = outerFunction("Hello");
closureFunction("World");

出力:

Outer Variable: Hello, Inner Variable: World

インタビューの質問:
Q: JavaScript でカリー化を使用する理由は何ですか?
A: カリー化により部分的な適用が可能になり、コードの再利用性と可読性が向上します。

6.モジュールシステム

CommonJS 対 ES モジュール

• CommonJS: Node.js で使用され、モジュールは require() を使用して同期的にロードされます。
• ES モジュール: JavaScript にネイティブで、モジュールはインポートとエクスポートを使用して非同期的にロードされます。

例:

function fetchData() {
    return new Promise((resolve, reject) => {
        setTimeout(() => resolve("Data fetched"), 2000);
    });
}

async function getData() {
    try {
        const data = await fetchData();
        console.log(data);
    } catch (error) {
        console.error(error);
    }
}

getData();

インタビューの質問:
Q: CommonJS ではなく ES モジュールを使用する利点は何ですか?
A: ES モジュールは、バンドル サイズを最適化するためのツリーシェイクをサポートしており、最新のブラウザでネイティブにサポートされています。

以上が高度な JavaScript をマスターする: 重要なトピックと面接の質問の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。