JavaScriptのコード実行順序を詳しく解説

黄舟
リリース: 2017-10-30 09:48:16
オリジナル
1667 人が閲覧しました

1. js--->シングルスレッド

厳密に言えば、javascriptには複数のスレッドという概念がありません。すべてのプログラムは単一のスレッドによって順番に実行されます。

1.シングルスレッドとは何ですか?

平たく言えば、コードの実行中に別のコードを実行したい場合は、現在のコードが実行されるまで待機する必要があります。それを説明するためにコードを見てみましょう

 for(var i=1;i<=3;i++){
   setTimeout(function(){
     console.log(i); //输出:4,4,4
   },0)
 }
ログイン後にコピー

遅延時間が 0 に設定されているため、ループは 1 回実行され、i はすぐに出力されるはずですが、最終的な出力結果は次のようになります。は: 4、4、4。上記の結果が発生する理由は、まさに js コードがシングルスレッド アプリケーションであるためです。

実行プロセス中に、最初にforループが発生し、forループが最初にスレッドに入ります。 i=1 の場合、ループが setTimeOut に達した後、for ループの実行はまだ完了していないため、setTimeOut は実行を待機する場所 (スレッド プール) に置かれます。この時点で、for ループは実行を続けます。i=2 の場合、この時点では setTimeOut は実行を待機しているスレッド プールに置かれます。 for ループが 3 回完了すると、for ループの実行が完了すると、スレッド プールで実行を待機している setTimeOut が実行され、i が 4 になります。 , したがって、4 が 3 つ出力されます。

2. 上記の状況を変更したい場合は、次のコードを使用できます

//将var变为let
for(let i=1; i<=3; i++){
  setTimeOut(function(){
    console.log(i); //输出的结果为1,2,3
  },0);
}
//用自执行函数进行包裹
for(var i=1; i<=3; i++){
  !function(i){
    setTimeOut(function(){
      console.log(i); //输出的结果为1,2,3
    },0);
  }(i)
}
ログイン後にコピー

2. 関数スコープとjsでのコード実行

>>>関数スコープ

まず次の概念を理解しましょう:

1. js言語には、c言語のようなブロックレベルのスコープがありません。

2. js言語の最上位スコープはウィンドウオブジェクトのスコープ内にあり、グローバルスコープで宣言された変数がグローバル変数です。

3. js関数のスコープ内の変数は関数内でのみ使用でき、関数外では使用できません。

4. JS関数はネスト可能 複数の関数のネストは、スコープの階層ごとのネストを構成します。これは、JSではスコープチェーンと呼ばれます。

5. JSスコープチェーン変数アクセスルール:

(1) アクセス対象の変数が現在のスコープに存在する場合、その変数を現在のスコープで使用します。

(2)アクセス対象の変数が現在のスコープに存在しない場合は、グローバルスコープまでの上位スコープで検索されます。

> 、変数のデフォルト値は未定義です。

2. コードの実行フェーズ このフェーズでは、変数に値が代入され、関数が宣言されます。

上記のいくつかの具体的な概念を見た後、コードの一部を取り上げて説明しましょう:

var a=1; //声明了一个全局变量
function func(){
  console.log(a); //输出:undefined。打印a,而在func这个作用域中已经声明了a变量,按照js的执行顺序,此时的a并未被赋值。
  var a=1;
  console.log(a); //输出:1。
}
func();
ログイン後にコピー

上記のコードを見てください: 最初の a は未定義を出力します。理由:jsスコープチェーンのアクセスルールにより、アクセス対象の変数aはカレントスコープに存在するため、カレントスコープの変数が使用されます。 jsコードの実行順序により、この時点ではaは宣言されているだけで代入されていないため、デフォルトではunknownが出力されます。

2番目のaは1を出​​力しますが、このときaは宣言されて値が代入されているからこそ、aは1を出​​力します。


概要

以上がJavaScriptのコード実行順序を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート