JavaScript 関数の遅延読み込みの実装とその利点の紹介_JavaScript スキル

最近、高度な JavaScript プログラミングから多くのことを学びました。今後数日で読書メモを書きます。以前に Ajax の予備的な理解に関するエッセイを書きましたが、その中には XmlHttpRequest オブジェクトを作成する関数があり、ブラウザーの互換性のため、記述されたコードでは関数を正しい方向に導くために大量の if 判定や try および catch ステートメントが使用されています。コード。

コードをコピー コードは次のとおりです:

この関数を呼び出すたびに、まずブラウザの機能を確認する必要があります。 -in XMLHyypRequest オブジェクトがサポートされていない場合は、ActiveX ベースの XMLHttpRequest の各バージョンを確認します。実際、ブラウザが特定の XMLHttpRequest オブジェクトをサポートしている場合、この関数が呼び出されるたびにこれが行われます。このサポートは、次回の実行時にサポートされます。プロパティは変更されません。if ステートメントが 1 つしかない場合でも、実行は明らかに遅くなります。 if 文を毎回実行する必要がなくなると、頻繁に呼び出す場合の実行速度が向上します。解決策は、遅延読み込みと呼ばれる手法です。

遅延ロード
遅延ロードとは、関数の最初の呼び出し時に関数実行の分岐がのみ実行されることを意味します。適切な方法で実行される別の関数で上書きされるため、元の関数への呼び出しは実行の分岐を経由する必要がありません。 createXHR 関数は、次のように書き換えることができます。
var xhr=null;
if(typeof XMLHttpRequest !='unknown'){
xhr = new XMLHttpRequest(){

return new XMLHttpRequest(); } }else{ try { xhr = new ActiveXObject("Msxml2.XMLHTTP"); createXHR=function(){ return new ActiveXObject("Msxml2.XMLHTTP") ");

}

}
catch (e) {
try {
xhr = new ActiveXObject("Microsoft.XMLHTTP");
createXHR=function(){
return new ActiveXObject("Microsoft.XMLHTTP")
}
}
catch (e) {
createXHR=function(){
return null;
}
}
}
}
return xhr;
}


この遅延ロードされた createXHR が初めて実行されるとき、各ブランチは createXHR を再割り当てし、元の関数を上書きして xhr オブジェクトを返します。書き換えられた関数は 2 回目の実行時に直接呼び出されるため、各ブランチを実行して再検出する必要はありません。


利点


遅延ロード関数には 2 つの主な利点があります。1 つ目は、関数が最初に実行されるときに割り当てを意味することになりますが、明らかな効率の問題です。実行は遅くなりますが、繰り返しの検出が回避されるため、その後の呼び出しは高速になります。2 つ目は、実行される適切なコードが、関数が実際に呼び出されるときにのみ実行されることです。多くの JavaScript ライブラリは、読み込み時にブラウザーによって異なります。多くの分岐を実行し、すべてをセットアップすると、遅延ロード機能が最初のスクリプトの実行時間に影響を与えることなく遅延を計算します。