JavaScript は、ブラウザーによって動的に解析および実行される記述スクリプト言語です。一般に、関数を定義するには 2 つの方法があり、ブラウザでは方法に応じて解析順序が異なります。この記事では主に js の実行シーケンス分析について説明し、皆様のお役に立てれば幸いです。
コードは次のとおりです:
//“定义式”函数定义 function Fn1(){ alert("Hello World!"); } //“赋值式”函数定义 var Fn2 = function(){ alert("Hello wild!"); }
ページの読み込みプロセス中、ブラウザはページまたは読み込まれた各 js コード ブロック (またはファイル) をスキャンし、定義された関数に遭遇した場合は前処理します ( C など)、処理が完了した後、代入関数に遭遇すると実行が上から下に開始され、関数は前処理なしで変数に割り当てられるだけです (変数を最初に定義し、次に定義する必要があるという 1 の原則と同様です)。参照)、呼び出されたときにのみ処理されます。簡単な例を次に示します:
コードは次のとおりです:
//“定义式”函数定义 Fn1(); function Fn1(){ alert("Hello World!"); }
通常どおり実行すると、「Hello World!」が表示され、ブラウザは Fn1 を前処理し、Fn1(); から実行を開始します。
コードは次のとおりです:
//“赋值式”函数定义 Fn2(); var Fn2 = function(){ alert("Hello wild!"); }
Firebug がエラーを報告しました: Fn2 は関数ではありません。ブラウザーは Fn2 を前処理せず、順次実行したため、Fn2 が定義されていないというエラーが報告されました。
3. コード ブロックと JS ファイルの処理
「コード ブロック」とは、 タグで囲まれた 1 組の JS コードを指します。ファイルはファイルを指します、ナンセンス :D
ブラウザは各ブロックまたはファイルを個別にスキャンし、グローバル コードを順番に実行します (2 で述べた)。したがって、1 つのブロック (ファイル) では、関数は呼び出しの後に「定義」できますが、2 つのブロックでは、関数が呼び出されるブロックよりも前に関数が定義されている必要があります。
非常に複雑です。例を見てください:
コードは次のとおりです:
<script type="text/javascript"> Fn(); </script> <script type="text/javascript"> function Fn(){ alert("Hello World!"); } </script> // 报错:Fn is notdefined,两个块换过来就对了
4. 関数を繰り返し定義すると、前の定義が上書きされます
これは、変数の繰り返し定義と同じです。 :
コードは次のとおりです:
function fn(){ alert(1); } function fn(){ alert(2); } fn(); // 弹出:“2”
この場合はどうなりますか:
コードは次のとおりです:
fn(); function fn() { alert(1); } function fn() { alert(2); } // 还是弹出: “2”
「2」がまだポップアップ表示されます、なぜですか? 2については説明済みです...
5. 本体のonload関数と本体の内部関数の実行 テストコード:
//html head... <script type="text/javascript"> function fnOnLoad(){ alert("I am outside the Wall!"); } </script> <body onload="fnOnLoad();"> <script type="text/javascript"> alert("I am inside the Wall.."); </script> </body> //先弹出“I am inside the Wall..”; //后弹出“I am outside the Wall!”
6 JavaScript はマルチスレッドですか、シングルスレッドですか。ネジ式?
厳密に言えば、JavaScript にはマルチスレッドの概念がありません。すべてのプログラムは「シングルスレッド」で順番に実行されます。 不適切な例を挙げると、次のようになります。
function fn1(){ var sum = 0; for(var ind=0; ind<1000; ind++) { sum += ind; } alert("答案是"+sum); } function fn2(){ alert("早知道了,我就是不说"); } fn1(); fn2(); //先弹出:“答案是499500”, //后弹出:“早知道了,我就是不说”
コードは次のとおりです:
function fn1(){ setTimeout(function(){ alert("我先调用") },1000); } function fn2(){ alert("我后调用"); } fn1(); fn2(); // 先弹出:“我后调用”, // 1秒后弹出:“我先调用”
Ajax リクエストのデータ処理関数にも同じことが当てはまります。
JavaScript のスレッドの問題についてさらに詳しく説明するには、infoQ の記事「JavaScript のスレッドに関する私の意見」と「JavaScript マルチスレッド プログラミングの概要」を参照してください。
眠いので、コールバック関数についてもう一度話しましょう。
7. コールバック関数
コールバック関数は何に使用されますか?それはコールバックによって実行される単なる関数です、ナンセンス:D 6 で述べたように、最も一般的なコールバックは、onclick、onmouseotutorialver、onmousedown、onload などのブラウザ イベントの呼び出し関数と、Ajax 非同期リクエスト データの処理関数です。 ; SetTimeOut 遅延実行、setInterval ループ実行関数など。
再生する純粋なコールバック関数を書いてみましょう:
コードは次のとおりです:
function onBack(num){ alert("姗姗我来迟了"); // 执行num个耳光 } function dating(hours, callBack){ var SP= 0; // SP,愤怒值 //女猪脚在雪里站了hours个钟头 //循环开始.. SP ++; //循环结束... callBack(SP); } dating(1, onBack);
以上がjsの実行順序解析の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。