ホームページ  >  記事  >  ウェブフロントエンド  >  JSコードが実行される順序は何ですか?

JSコードが実行される順序は何ですか?

php中世界最好的语言
php中世界最好的语言オリジナル
2017-12-31 11:35:142215ブラウズ

今回紹介するのは、厳密に言えば、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 は unknown を出力します。理由:jsスコープチェーンのアクセスルールにより、アクセス対象の変数aはカレントスコープに存在するため、カレントスコープの変数が使用されます。 jsコードの実行順序により、この時点ではaは宣言されているだけで代入されていないため、デフォルトではunknownが出力されます。

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


上記の紹介を読んだ後は、この方法を習得したと思います。さらに興味深い情報については、php 中国語 Web サイトの他の関連記事に注目してください。


関連資料:

require.js の使用法の詳細

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

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。