2021 年に最も一般的な Javascript 面接の質問と回答

URLを入力してからページが表示されるまでの間に何が起こったのでしょうか?

1. ユーザーは URL を入力して Enter キーを押します
2. ブラウザのプロセスは URL をチェックし、プロトコルを組み立てて、完全な URL を形成します。
3. ブラウザ プロセスは、プロセス間通信 (IPC) を通じて URL リクエストをネットワーク プロセスに送信します。
4. ネットワーク プロセスは URL リクエストを受信すると、リクエストされたリソースがローカル キャッシュにキャッシュされているかどうかを確認し、キャッシュされている場合はリソースをブラウザ プロセスに返します。
5. そうでない場合、ネットワーク プロセスは Web サーバーへの http リクエスト (ネットワーク リクエスト) を開始します。
6. ネットワーク プロセスは応答プロセスを解析します。200 の場合は、応答タイプ Content-Type を確認します。バイト ストリーム タイプの場合は、ダウンロード マネージャーに要求を送信します。ナビゲーション プロセスは終了しており、続行されません。 html、ブラウザに通知 プロセスがレンダリングの準備ができました プロセスがレンダリングの準備ができました
7. レンダリング プロセスを準備します。ブラウザ プロセスは、現在の URL が以前に開いたレンダリング プロセスのルート ドメイン名と同じかどうかを確認します。同じである場合は、元のプロセスが再利用されます。異なる場合は、新しいレンダリング プロセスが実行されます。が開始されます。
8. データ転送、ステータス更新

（「ブラウザは? インタビューの質問1: URLを入力してからページが表示されるまで、途中で何が起きましたか?」をクリックすると詳しい説明がご覧いただけます)

JavaScript データ型とその検出?

Js のデータ型は次の 2 つのタイプに分類されます。

• 基本データ型; 未定義、Null、ブール、数値、文字列、シンボル (ES6 の新機能、一意の値を表す) を含む
• 参照データ型; オブジェクト、配列、関数などを含むオブジェクト オブジェクトと総称される場合があります。

検出方法:

• typeof ; typeof はデータ型を表す文字列を返し、返される結果には数値、ブール値、文字列、シンボル、オブジェクト、未定義、関数、その他の 7 つのデータ型が含まれますが、null、配列などは判断できません (一般に基本的なものは判断できません)。データ型)
• instanceof ;instanceof は、A が B のインスタンスであるかどうかを判断するために使用されます (一般的に参照データ型を判断します)。
• Object.prototype.toString.call() (すべてのデータ型を判断できる、最も正確で一般的な方法)

typeofとinstanceofの違いは何ですか?

種類：

• 基本的なデータ型を判断するために使用されますが、typeof null は Object を返します。これは JavaScript の長年のバグであり、null が参照データ型であることを意味するものではなく、null 自体がオブジェクトではありません。
• 参照型データはtypeofで判定すると関数以外は認識され、残りはオブジェクトを出力します

インスタンスの：

• instanceof 演算子は、コンストラクターのプロトタイプ プロパティがインスタンス オブジェクトのプロトタイプ チェーンに現れるかどうかを検出するために使用されます。
• 主に参照データ型を検出し、基本型の場合は false を返します。

違い：

• typeof は変数の基本型を返し、instanceof はブール値を返します。
• instanceof は複雑な参照データ型を正確に判断できますが、基本的なデータ型を正しく判断できません。
• また、typeof には基本的なデータ型 (null を除く) は判定できますが、関数型以外の参照データ型は判定できないという欠点もあります。
• 一般的な検出データ型が必要な場合は、Object.prototype.toString を使用してこのメ​​ソッドを呼び出し、「[object Xxx]」形式の文字列を一律に返すことができます。

スタックメモリとヒープメモリの違いをご存知ですか?

スタックメモリ:

• スタックは、前に繰り返し説明した呼び出しスタックであり、実行コンテキストを保存するために使用されます。
• スタック領域はあまり大きく設定されません。スタックは主に基本値と参照型値のアドレスを保存するために使用されます。
• 自動的に割り当てられる比較的固定サイズのメモリ空間は、データの読み取りおよび書き込み速度が高速ですが、ストレージの内容が小さいため、変数が使用されなくなるとシステムが自動的にクリーンアップして変数を解放します。

ヒープメモリ:

• 順序付けされていない一意の参照型値のセットを保存するために使用されます。スタック内のキー名を使用して取得できます。
• ヒープの読み取りおよび書き込み速度は遅いですが、多くのコンテンツが格納されます。一般にオブジェクトはヒープに格納され、格納されるデータのサイズは不明です。
• ヒープは動的に割り当てられるメモリであり、サイズは可変で、自動的には解放されません。

2 つの違い:

• スペース割り当ての違い: スタックはオペレーティング システム (コンパイラ) によって自動的に割り当ておよび解放され、関数のパラメータ値やローカル変数の値などが格納されます。データ構造内のスタックのように動作します。ヒープ (オペレーティング システム) は、通常、プログラマによって割り当ておよび解放されますが、プログラマが解放しない場合は、プログラムの終了時に OS によって再利用される場合があります。割り当て方法はリンク リストに似ています。
• キャッシュ方式の違い: スタックは 1 次キャッシュを使用します。これは通常、呼び出されたときに記憶域スペースに保管され、呼び出しの直後に解放されます。ヒープは 2 次キャッシュに格納され、そのライフサイクルは仮想マシンのガベージ コレクション アルゴリズムによって決定されます (孤立オブジェクトになるとリサイクルできません)。したがって、これらのオブジェクトを呼び出す速度は比較的遅くなります。
• データ構造の違い: ヒープは、ヒープのソートなど、ツリーとしてみなすことができます。スタックは先入れ後出しのデータ構造です。
• ストレージ タイプの違い: スタックは通常、基本値と参照タイプの値のアドレスを保存するために使用され、ヒープは順序付けされていない一意の参照タイプ オブジェクトのグループを保存するために使用されます。

ブラウザの動作原理と実践 - スタックスペースとヒープスペースをクリックすると、詳細な説明が表示されます。

ディープコピーとシャローコピーの違いは何ですか?

浅いコピー:

同じアドレスを指すのではなく、元のオブジェクトのプロパティ値の正確なコピーを持つ新しいオブジェクトを作成します。つまり、オブジェクトの浅いコピーは「メイン」オブジェクトのみをコピーし、オブジェクト属性の基本型の値がコピーされます。属性が参照型の場合、メモリ アドレスがコピーされ、コピーは深くないので、浅いコピーと呼ばれます。

• 浅いコピー オブジェクトの最初のレイヤーの非オブジェクト参照クラス属性を変更しても、元のオブジェクトには影響しません。
• 浅いコピーはオブジェクト内のオブジェクトをコピーしないため、「内部オブジェクト」は元のオブジェクトとメモリを共有するため、浅いコピー オブジェクトのサブプロパティ オブジェクト内のプロパティを変更すると、元のオブジェクトにも影響します。

ディープコピー:

ディープ コピーでは、メタオブジェクトの各属性を 1 つずつコピーするだけでなく、元のオブジェクトの各属性に含まれるオブジェクト属性を新しいオブジェクトに再帰的に一度にコピーするため、コピーされたオブジェクトを変更しても元のオブジェクトには影響しません。 ;

• ディープ コピーでは、オブジェクトの各属性をレイヤーごとにコピーします。コピーされたオブジェクトの属性を変更しても、元のオブジェクトには影響しません。

違い：

	元のデータと同じオブジェクトを指しているかどうか	データの最初の層は基本的なデータ型です	元のデータに含まれるサブオブジェクト
浅いコピー	いいえ	元のデータを一緒に変更することはありません	元のデータも一緒に変更します
ディープコピー	いいえ	元のデータを一緒に変更することはありません	元のデータを一緒に変更することはありません

Javascript の浅いコピーと深いコピーの探索と詳細な説明をクリックすると、詳細な説明が表示されます

プロジェクトに深いコピーと浅いコピーを実装するために一般的に使用される方法は何ですか?

浅いコピーを実装する方法:

• 単純な割り当て
• for...in ループを使用した浅いコピー
• Object.assign() メソッドの使用

ディープコピーの実装方法は以下の通りです。

• 再帰を使用したディープコピーの実装
• JSONオブジェクトによるディープコピーの実装
• lice()、concat() 配列のディープコピー

Javascript の浅いコピーと深いコピーの探索と詳細な説明をクリックすると、詳細な説明が表示されます

割り当て、浅いコピー、深いコピーの違いは何ですか?

	元のデータと同じオブジェクトを指しているかどうか	データの最初の層は基本的なデータ型です	元のデータに含まれるサブオブジェクト
割り当て	はい	元のデータも一緒に変更します	元のデータも一緒に変更します
浅いコピー	いいえ	元のデータを一緒に変更することはありません	元のデータも一緒に変更します
ディープコピー	いいえ	元のデータを一緒に変更することはありません	元のデータを一緒に変更することはありません

3 つのメモリ マップ:

割り当て

浅いコピー

ディープ コピークリックし

て、Javscript のシャロー コピーとディープ コピーを調べて説明します。詳細な説明を表示します。

new はオブジェクトを作成するときに何をしますか?

1. 最初に空のオブジェクト obj が作成されます
2. プロトタイプチェーンを介してオブジェクトとコンストラクターを接続する
3. コンストラクター内でこれを新しく作成したオブジェクト obj にバインドします。
4. コンストラクタの戻り値の型で判断し、プリミティブ値の場合は無視し、戻り値のオブジェクトの場合は通常通り処理する必要がある

JavaScriptのプロトタイプとプロトタイプチェーンについて理解していますか？

プロトタイプ：

• JavaScript では、オブジェクトが定義されるたびに、いくつかの事前定義されたプロパティが含まれます。各関数オブジェクトには、関数のプロトタイプ オブジェクトを指すプロトタイプ属性があります。
• プロトタイプ オブジェクトは、プロトタイプ属性が配置されている関数へのポインターであるコンストラクター属性を自動的に取得します。
• 新しいインスタンスを作成するためにコンストラクターが呼び出されるとき、上位インスタンス オブジェクトには、コンストラクターのプロトタイプ オブジェクトを指すポインター (内部属性 _proto_) が含まれます。
• プロトタイプ オブジェクトの目的は、特定の型のすべてのインスタンスで共有できるプロパティとメソッドを含めることです。

プロトタイプチェーン:

• プロトタイプ チェーンは、インスタンス オブジェクトが属性を検索するときに、属性が見つからない場合、そのオブジェクトに関連付けられたプロトタイプの __proto__ に沿って検索し、見つかった場合は戻ります。最上位の Object 関数のプロトタイプに対して、そのプロトタイプ オブジェクトの _proto__ には参照できる上位レベルのプロトタイプがないため、その値は null となり、undefind を返します。
• プロトタイプ チェーンは継承を実現する主な方法であり、基本的な考え方は、プロトタイプを使用して参照型に別の参照型のプロパティとメソッドを継承させることです。

Javascript のプロトタイプとプロトタイプ チェーンの探索と詳細な説明をクリックすると、詳細な説明が表示されます。

Javascript の継承について話しますが、継承を実装するにはどうすればよいでしょうか?

継承とは:

継承（継承）とは、オブジェクト指向ソフトウェア技術における概念で、クラスBが別のクラスAから「継承」した場合、このBを「Aのサブクラス」と呼び、Aを「Bの親クラス」と呼ぶことができます。 「A は B のスーパークラスである」とも言えます。

• 継承により、同じコードを再度記述することなく、サブクラスが親クラスのさまざまなプロパティやメソッドを持つことができます。
• サブクラスは親クラスを継承しますが、一部のプロパティを再定義し、一部のメソッドを書き換えることができます。つまり、親クラスの元のプロパティとメソッドを上書きして、親クラスから異なる関数を取得できるようにします。

継承を実装する方法:

• プロトタイプチェーンの継承
• コンストラクターの継承 (呼び出しあり)
• 構成の継承
• プロトタイプの継承
• 寄生継承
• 寄生組成の継承

Javascriptの継承・実装メソッドをクリックすると詳しい説明が表示されます。

JavaScript の実行コンテキストと実行スタックとは何ですか?

実行コンテキスト:

実行コンテキストは、JavaScript コード実行環境の抽象的な概念であり、JavaScript コードが実行される限り、実行コンテキストで実行する必要があります。

実行コンテキストには次の 3 種類があります。

• グローバル実行コンテキスト: 1 つだけ。ブラウザ内のグローバル オブジェクトはウィンドウ オブジェクトです。これはこのグローバル オブジェクトを指します。
• 関数実行コンテキスト: 無数にあり、関数が呼び出されたときにのみ作成され、関数が呼び出されるたびに新しい実行コンテキストが作成されます。
• Eval 関数実行コンテキスト: eval 関数で実行されるコードを指します。これはめったに使用されず、推奨されません。

実行スタック:

実行スタック (コール スタックとも呼ばれます) には、コードの実行中に作成されたすべての実行コンテキストを格納するための LIFO (後入れ先出し) 構造があります。

Javascript エンジンがスクリプト コードの最初の行の実行を開始すると、グローバル実行コンテキストが作成され、実行スタックにプッシュされます。

エンジンは関数を検出するたびに、関数実行コンテキストを作成し、この実行コンテキストを実行スタックにプッシュします。

エンジンは実行スタックの最上位で実行コンテキスト (通常は関数実行コンテキスト) を実行します。関数の実行が終了すると、対応する実行コンテキストがポップアップ表示され、制御フローは次の実行コンテキストに到達します。実行スタック。

[JavaScript 実行メカニズム - 呼び出しスタック] [詳細を表示]をクリックします。

JavaScript のスコープについての理解について教えてください。

スコープとは、変数が定義されるプログラム内の領域を指し、この場所が変数の有効期間を決定します。平たく言えば、スコープは変数と関数のアクセス可能なスコープです。つまり、スコープは変数と関数の可視性とライフサイクルを制御します。

ES6 より前の ES には、グローバル スコープと関数スコープの 2 つのスコープしかありませんでした。

• グローバル スコープ内のオブジェクトはコード内のどこからでもアクセスでき、そのライフ サイクルにはページのライフ サイクルが伴います。
• 関数スコープは関数内で定義された変数または関数であり、定義された変数または関数は関数内でのみアクセスできます。関数の実行が終了すると、関数内で定義された変数は破棄されます。

ES6 にはブロックレベルのスコープがあり、ブロックレベルのスコープは関数、判定文、ループ文などの中括弧で囲まれたコードであり、単一の {} もブロックレベルのスコープと見なされます。

クロージャと使用シナリオについての理解について教えてください。

JavaScript では、字句スコープの規則に従い、内部関数は外部関数で宣言された変数に常にアクセスできます。外部関数を呼び出して内部関数が返された場合、外部関数が実行された後であっても、内部関数参照は外部関数の変数は引き続きメモリに格納されており、これらの変数のコレクションをクロージャと呼びます。

クロージャの使用方法を誤ると、メモリ リークが発生しやすくなります。そのため、クロージャを使用するときは、次の原則に注意する必要があります。クロージャが常に使用される場合は、グローバル変数として存在できます。ただし、使用頻度が高くなく、多くのメモリを消費する場合は、ローカル変数にしてみてください。

クロージャの使用シナリオは次の 2 つの点から切り離すことができません。

• プライベート変数を作成する
• 変数の有効期間を延長する

シーン:

• カレー関数

JavaScript の実行メカニズム - スコープ チェーンとクロージャをクリックして詳細を表示します。

JavaScript の this オブジェクトについての理解を教えてください。

1. 関数を実行する際、まず関数名の前に「.」があるかどうかを確認し、「.」の前にある場合は誰、ない場合はウィンドウです。
2. 自己実行関数の this は常にウィンドウです
3. コンストラクターモードでは、クラス（関数本体）に出現する this.xxx=xxx が現在のクラスのインスタンスになります。
4. call、apply、bind は、関数の最初のパラメータである this の方向を変更できます。
5. アロー関数の this は、外側の層に関数があるかどうかで決まり、ある場合は外側の関数の this が内側のアロー関数の this になり、ない場合はウィンドウになります。

Javascript 配列の一般的なメソッドは何ですか?

操作方法：

• 拡張：push()、unshift()、splice()、concat()
• 削除:pop()、shift()、splice()、slice()
• 変更: splice()
• 查：indexOf()、includes()、find()

並べ替え方法:

• 配列自体には、reverse()、sort() という 2 つのメソッドがあります。
• ソート関数の定義: バブル ソート、挿入ソート、マージ ソート、カウント ソート

変換方法：

• 加入（）

反復方法:

• いくつかの（）
• 毎日（）
• forEach()
• フィルター（）
• 地図（）

Javascript 配列 (推奨コレクション) で最もよく使用されるメソッドをクリックすると、詳細な説明が表示されます。

配列のソートメソッドを手動で記述しますか?

バブルソート：

var arr = [3,4,1,2,21,5,15,6,63];
function BubbleSort(ary){
    
    
    for(var i = 0;  i < ary.length - 1;  i++){
    
    
        for(var j = i + 1;  j < ary.length;  j++){
    
    
            var current = ary[i];
            if(current > ary[j]){
    
    
                var tmp = ary[j];
                ary[j] = current;
                ary[i] = tmp;
             }
         }
    }
   return ary;
}
1
BubbleSort(arr); // [1, 2, 3, 4, 5, 6, 15, 21, 63]

Javascript 配列 (推奨コレクション) で最もよく使用されるメソッドをクリックすると、詳細な説明が表示されます。

JavaScript 文字列の一般的なメソッドは何ですか?

操作方法：

• 追加: concat()、
• 删：slice()、substr()、substring()
• 変更：trim()、trimLeft()、trimRight()、repeat()、toLowerCase()、toUpperCase()
• 查：chatAt()、indexOf()、startWith()、includes()

変換方法：

• スプリット

テンプレートマッチング方法:

• マッチ（）
• 検索（）
• 交換（）

Javascript文字列の一般的なメソッドをクリックすると、詳細な説明が表示されます。

JavaScript の型変換メカニズムについて話してください。

一般的な型変換は次のとおりです。

• キャスト（表示変換）
• 自動変換（暗黙的な変換）

jsの6つのデータ型、必須型変換、暗黙的型変換をクリックすると詳しい説明が表示されます。

== と === の違いと使用シナリオは何ですか?

等号演算子:

等号演算子は 2 つの等号 (==) で表され、オペランドが等しい場合は true を返します。
等号演算子 (==) は、まず比較で型変換を実行し、次にオペランドが等しいかどうかを判断します。 ;

• どちらも単純な型であり、文字列とブール値は数値に変換されて比較されます
• 単純型は参照型と比較され、オブジェクトは元の型の値に変換されてから比較されます。
• どちらも参照型であり、同じオブジェクトを指しているかどうかを比較します。
• nullと未定義は等しい
• NaN が存在する場合は false を返します

合同演算子:

恒等演算子は 3 つの等号 ( === ) で表され、2 つのオペランドが変換なしで等しい場合にのみ true を返します。つまり、同じ型、値も同じでなければなりません

違い：

• 等価演算子 (==) は型変換を行ってから値を比較しますが、等価演算子は型変換を行いません。
• null と未定義を比較すると、等価演算子 (==) は true、合同は false

比較オブジェクトのプロパティが null または未定義の場合を除き、等価演算子 == を使用できますが、それ以外の場合には合同演算子 === を使用することをお勧めします。

JavaScript のイベント モデルを理解するにはどうすればよいですか?

イベント モデルは次の 3 つのタイプに分類できます。

• プリミティブイベントモデル（DOM0レベル）
• 標準イベントモデル（DOM2レベル）
• IEイベントモデル（基本的には使用しません）

詳細を表示するには、「JavaScript のイベント モデル」をクリックします。

プロセスとスレッドについての理解について話してください。

マルチスレッドではタスクを並列処理できますが、スレッドは単独で存在できず、プロセスによって開始および管理されます。

プロセスは、プログラムの実行中のインスタンスです。詳細に説明すると、プログラムが開始されると、オペレーティング システムはコード、実行データ、およびタスクを実行するメイン スレッドを保存するためのプログラム用のメモリ ブロックを作成します。このようなオペレーティング環境をプロセスと呼びます。

関係：

• プロセス内でスレッド実行エラーが発生すると、プロセス全体がクラッシュします。
• プロセス内のデータはスレッド間で共有されます。
• プロセスが閉じられると、オペレーティング システムはプロセスによって占有されていたメモリを再利用します。
• プロセス間のコンテンツは互いに分離されています。

「イベント ループとは何ですか?」をクリックします。詳細を見る

Javascript のイベント ループの理解について話してください。

JavaScript は設計の初期段階ではシングルスレッドです。つまり、プログラムの実行時にはスレッドが 1 つだけ存在し、一度に 1 つのことしか実行できません。シングルスレッドの実行ブロッキングの問題を解決するために、JavaScript は次の関数を使用します。コンピュータシステムの動作機構。この機構をイベントループ(Event Loop)と呼びます。

JavaScript では、すべてのタスクは次のように分割できます。

• 同期タスク: すぐに実行されるタスク。通常、同期タスクは実行のためにメインスレッドに直接入ります。
• 非同期タスク: ajax ネットワーク要求、setTimeout タイミング関数など、非同期で実行されるタスク。

同期タスクと非同期タスクの実行フローチャートは以下のとおりです。

上記のことから、同期タスクはメインスレッド、つまりメイン実行スタックに入り、非同期タスクはタスクキューに入ります。メインスレッドのタスクが実行されると、タスクは空になり、タスクキューに移動して、対応するタスクを読み取り、実行のためにメインスレッドにプッシュします。上記のプロセスの継続的な繰り返しがイベント ループです。

Javascript のイベント ループ メカニズムの探索と詳細な説明をクリックすると、詳細な説明が表示されます。

マクロタスクとマイクロタスクの導入

イベント プロキシとアプリケーション シナリオとは何ですか?

それは何ですか：

イベント プロキシとは、平たく言えば、イベント (クリック、キーダウンなど) に応答する要素の機能を別の要素に委任することです。

イベント フローは、キャプチャ ステージ -> ターゲット ステージ -> バブリング ステージの 3 つのステージを経ます。イベントの委任はバブリング ステージで完了します。

イベント委任。1 つまたは要素グループのイベントをその親レイヤーまたは外部要素に委任します。外部要素は実際にはターゲット要素ではなくイベントにバインドされます。

イベントがターゲット要素に応答すると、イベント バブリング メカニズムを通じてその外側の要素のバインディング イベントがトリガーされ、外側の要素で関数が実行されます。

アプリケーションシナリオ:

多数のリスト項目を含むリストがある場合、リスト項目がクリックされたときにイベントに応答する必要があります。各リスト項目に関数がバインドされていると、大量のメモリを消費します。このとき、イベントデリゲートを実行し、クリックイベントを親要素 ul にバインドし、イベントの実行時にターゲット要素と一致させることができます。

[イベント プロキシとアプリケーション シナリオ]をクリックして詳細を表示します

関数カリー化とは何ですか?

複数の引数を受け入れる関数を 1 つの引数 (元の関数の最初の引数) を受け入れる関数に変換し、残りの引数を受け入れて結果を返す新しい関数を返す手法。

複数の引数を取る関数を 1 つの引数を取る関数に変換します

// 普通函数
var add = function(x, y) {
    return x + y;
}    
add(3, 4)       //7var foo = 'bar';

// 柯里化
var foo = function(x) {
 return function(y) {
        return x + y
    }
}
foo(3)(4)       // 7  

Ajax の原理とそれを実現する方法は何ですか?

それは何ですか：

AJAX (Async Javascript and XML) の正式名称

つまり、非同期 JavaScript と XML は、インタラクティブな Web アプリケーションを作成するための Web 開発テクノロジであり、サーバーとデータを交換し、Web ページ全体をリロードせずに Web ページの一部を更新できます。

Ajax の原理は、単に XmlHttpRequest オブジェクトを通じてサーバーに非同期リクエストを送信し、サーバーからデータを取得し、JavaScript を使用して DOM を操作してページを更新することです。

フローチャートは次のとおりです。

実装プロセス:

• Ajax XMLHttpRequest オブジェクトのコア オブジェクトを作成する
• XMLHttpRequest オブジェクトの open() メソッドを通じてサーバーとの接続を確立します。
• リクエストに必要なデータコンテンツを構築し、XMLHttpRequest オブジェクトの send() メソッドを通じてサーバーに送信します。
• XMLHttpRequest オブジェクトによって提供される onreadystatechange イベントを通じて、サーバー側で通信ステータスをリッスンします。
• サーバーがクライアントに応答したデータ結果を受け入れて処理します
• 処理結果をHTMLページに更新します

Ajax の原理、実装手順、パッケージ化をクリックすると、詳細な説明が表示されます。

バインド、呼び出し、適用の違いは何ですか?

効果：

call、apply、bind の関数は、関数の実行時にコンテキストを変更します。つまり、関数の実行時に this ポイントを変更します。

違い：

• apply、call、bind は関数の this ポイントを変更できます
• apply と call はどちらも関数のポイントを変更し、パラメータを渡した直後に関数を呼び出して実行します。
• バインドは、関数の this ポイントを変更し、パラメータを渡した後に新しい関数を返すことです。すぐに呼び出して実行することはありません。
• apply によって渡されるパラメータは配列の形式です。call によって渡されるパラメータは、コンマで区切られて 1 つずつ順番に渡されます。bind によって渡されるパラメータは、配列の形式または 1 つずつ渡すことができます。順番に一つ。

バインド、呼び出し、適用の違いをクリックして詳細を表示します

DOM についての理解について教えてください。一般的な操作は何ですか?

DOM の正式名は The Document Object Model で、ドキュメント オブジェクト モデルです。これは、HTML、XHTML、または XML ドキュメントをツリー構造として扱い、各ノードをオブジェクトとして扱い、プログラミング言語の操作で使用できる仕様、クロスプラットフォーム、プログラミング言語に依存しない API として理解される必要があります。ドキュメントの構造を変更し、ドキュメントの表示にマッピングします。

DOM とは、簡単に言うと、プログラミング言語の便宜上、HTML などの文書を操作するためのもので、HTML 文書内のすべてのノードを個別のオブジェクトとみなし、それらのオブジェクトが階層関係に従ってツリーを形成するものです。ツリーは名前付き DOM ツリーです。オブジェクトを使用すると、プログラミングがさらに便利になり、オブジェクトをレイヤーごとに取得する限り、オブジェクトのプロパティを適切に変更したり、HTML などのドキュメントの表示を動的に変更したりできます。

DOM の一般的な操作を分析してみましょう。主に次のように分類されます。

• ノードを作成する
• クエリノード
• ノードを更新する
• ノードを追加
• ノードの削除

「DOM の理解と一般的な操作」をクリックすると、詳細な説明が表示されます。

BOM についてのあなたの理解について教えてください。一般的な BOM オブジェクトについて何を知っていますか?

それは何ですか：

ブラウザ オブジェクト モデルである BOM (ブラウザ オブジェクト モデル) は、コンテンツとは独立してブラウザ ウィンドウと対話するオブジェクトを提供します。

その機能は、ページの戻る、進む、更新する方法、ブラウザ ウィンドウの変更方法、スクロール バーのスクロール方法など、ブラウザを使用していくつかのインタラクティブな効果を実行し、ブラウザのブランド バージョン、画面解像度などの顧客情報を取得することです。

BOM オブジェクト:

• 窓
• 位置
• ナビゲーター
• 画面
• 歴史

BOM と共通 BOM オブジェクトの理解をクリックすると、詳細な説明が表示されます

JavaScript でのメモリ リークのいくつかの状況について話しますか?

それは何ですか：

メモリ リーク (メモリ リーク) は、コンピュータ サイエンスにおいて、過失またはエラーにより、プログラムが使用されなくなったメモリを解放できないことを指します。

サービス プロセスを継続的に実行するには、使用されなくなったメモリを適時に解放する必要があります。そうしないと、メモリ使用量がますます増加し、システムのパフォーマンスにわずかな影響を及ぼし、最悪の場合はプロセスがクラッシュする可能性があります。

そこで、ほとんどの言語では、プログラマの負担を軽減するために「ガベージコレクション機構」と呼ばれる自動メモリ管理が提供されています。

一般的なメモリ リーク:

• 予期しないグローバル変数
• タイマーもメモリリークを引き起こすことがよくあります
• 関数の内部変数のライフサイクルを延長するクロージャもあり、不適切な呼び出しやタイミングの悪い解放もメモリ リークの原因となります。

JavaScriptでのローカルストレージの方法にはどのようなものがありますか? 違いと適用シナリオは?

ローカルストレージの方法:

• クッキー
• セッションストレージ
• セッションストレージ

違い：

• ストレージ サイズ: Cookie データ サイズは 4K を超えることはできません。sessionStorage と localStorage にもストレージ サイズ制限がありますが、Cookie よりもはるかに大きく、5M 以上に達する可能性があります。
• 有効期間: localStorage は永続データを保存し、データがアクティブに削除されない限り、ブラウザを閉じた後もデータは失われません。sessionStorage データは、現在のブラウザ ウィンドウが閉じられた後に自動的に削除されます。Cookie によって設定された Cookie は、ウィンドウまたはブラウザが閉じている場合でも、Cookie の有効期限が切れます。
• データとサーバー間の対話では、Cookie データがサーバーに自動的に送信され、サーバーはクライアントに Cookie を書き込むこともできます。sessionStorage と localStorage はデータをサービスに自動的に送信しません。

アプリケーションシナリオ:

• ユーザーをマークし、ユーザーの行動を追跡するには、Cookie の使用をお勧めします。
• ローカル データ (トークン) の長期保存に適しており、localStorage の使用をお勧めします。
• 機密性の高いアカウントにはワンタイムログイン、sessionStorage が推奨されます

ローカル ストレージ方法をクリックすると、詳細な説明が表示されます

JavaScript で関数キャッシュを実装するにはどうすればよいですか? 応用シナリオは何ですか?

それは何ですか：

関数キャッシュとは、関数の演算結果をキャッシュすることです。

本質的には、空間（キャッシュストレージ）を時間（計算プロセス）と交換することです。

キャッシュは、そのデータに対する今後のリクエストをより迅速に処理できるように、データを保持する単なる一時的なデータ ストアです。

実装：

• 閉鎖
• カリー化
• 高次関数

キャッシュは次の状況に適しています。

• 高価な関数呼び出し、複雑な計算を実行する関数の場合。
• 入力範囲が限られており、反復性が高い関数の場合
• 入力値が繰り返される再帰関数の場合
• 純粋関数、つまり、特定の入力で呼び出されるたびに同じ出力を返す関数の場合

「関数キャッシュの実装方法」をクリックして詳細を表示します。

機能制限と手ぶれ補正について話しますか? 違いは何ですか? どうやって達成するのか？

スロットル：

• n 秒以内に 1 回のみ実行、n 秒以内に繰り返しトリガーされた場合は 1 回のみ実行

手ぶれ防止 (デバウンス):

• イベントは n 秒後に実行されます。n 秒以内に繰り返しトリガーされると、タイマーが再起動されます。

現地語の理解:

エレベーターは、機能の実行と応答に似た輸送を完了します。

エレベーターにデバウンス (揺れ防止) とスロットル (スロットル) という 2 つの走行戦略があると仮定すると、容量制限に関係なく、タイムアウトは 15 秒に設定されます。

エレベーターの最初の人が到着してから 15 秒後に定刻に搬送されますが、これは非常にスムーズです。

先頭の人がエレベーターに乗り込んだら15秒ほど待ちます。プロセス中に誰かが入ってきた場合は、15 秒後に配信が開始されるまで、15 秒間待ってタイマーを再起動します。これにより、手ぶれ防止になります。

違い：

同じ点:

• どちらも setTimeout を使用することで実現できます
• 目的は、コールバックの実行頻度を減らすことです。コンピューティングリソースを節約する

違い：

• 関数アンチシェイクは、一定期間の連続操作の後、clearTimeout と setTimeout を使用してコールバックを処理します。継続的な操作での機能スロットルは、期間ごとに 1 回のみ実行され、パフォーマンスを向上させるために高頻度のイベントで使用されます。
• 機能アンチシェイクは、一定期間継続してトリガーされるイベントに焦点を当て、最後に 1 回だけ実行されますが、機能スロットリングは一定期間に 1 回だけ実行されます。

機能制限と手ぶれ補正をクリックすると、詳細な説明が表示されます

es6の新機能は何ですか?

• Let および const キーワード
• 変数の構造化代入
• 配列、オブジェクトの拡張子
• アロー関数
• スプレッド演算子
• クラスサポート
• 関数パラメータのデフォルト値
• オブジェクトの割り当ての簡素化

var、let、const の違いについて話してください。

• var で宣言された変数には変数プロモーションがあります。つまり、変数は宣言の前に呼び出すことができますが、値は未定義です。let と const には変数プロモーションがありません。つまり、宣言した変数は宣言の後に使用する必要があります。エラーが報告されます
• var には一時的なデッド ゾーンはありません。let と const には一時的なデッド ゾーンがあり、変数を宣言するコード行が表示された場合にのみ変数を取得して使用できます。
• Var にはブロック レベルのスコープがありませんが、let と const にはブロック レベルのスコープがあります
• var では変数の繰り返し宣言が許可されますが、let と const では同じスコープ内での変数の繰り返し宣言は許可されません
• var と let は変更できますが、const は読み取り専用の定数を宣言します。一度宣言した定数の値は変更できません

ES6 の約束と使用シナリオをどのように理解していますか?

ES6 の約束を理解するにはクリックして詳細な説明を表示します