コードの一部は、jsの実行文脈を理解するための作業フローを持っています.


原文のリンク、私のブログに注目してください.
先の初心者の多くは、初めはコンテキストという概念によってめまいをしたり、知っているようで分からないことが多いと思います.二年間仕事をしていた私にとって、恥ずかしいと思いますが、それはたぶんなんでしょうか?
コンテキストを実行
その基本的なワークフローを説明するには、thread of exection( )variable envirnoment( )call Stack( )global execution contextという三つの基本的な概念を先に説明する必要があります.これらの概念は私たちが多かれ少なかれ接触したことがあります.
セグメントコード
const num = 2;

function addOne(input) {
  const output = input + 1;
  return output;
}

const result = addOne(2);
このコードは何をしましたか?
上記のコードを実行する前に、jsエンジンが作った最初のものはthread、つまりグローバル実行コンテキストを作成することです.
まず図中の黒い矢印を参照してください.スレッドglobal memoryの実行順序を表しています.jsは単スレッドであり、行が1つ、上から下へコードが実行されます.一方、右のglobalは、現在のコンテキストにおけるデータを記憶するために使用され、スレッドは現在グローバルコンテキスト環境にあるので、numのプレフィックスを追加する.
このコードでは、第1行目は4という可変ではない変数を宣言し、global memoryに値を与えます.したがって、addOneにはメモリが割り当てられ、この変数を格納します.
続いて、スレッドが2行目に実行されると、問題が発生します.global memoryの変数を作成し、関数をそれに割り当てました.この問題を解くために、わざわざ印刷しました.
function addOne(input) {
  const output = input + 1;
  return output;
}
console.log(addOne);
関数の内容を全部印刷しました.明らかに、関数の内部にある「テキスト情報」が保存されています.
実際には、2行目を実行すると、この関数は呼び出されませんので、スレッドはすぐに中身を解析するのではなく、その内部の情報を「テキスト内容」として保存します.実行が必要なときは、変数内の関数の内容を解析します.これもよく解析されました.なぜ関数内の異常は関数が呼び出された時だけ出てくるのですか?
したがって、global execution context長は、このようにする.addOneには関数の内容が保存されていますので、現在スレッドについては未知です.ここでは特に入力出力矢印を持つ関数アイコンを使って、解析されていない関数として使用します.
第3のステップを継続して実行します.または変数resultを作成しましたが、このとき、スレッドはundefinedの関数からその戻り値を一時的に知ることができないので、addOneに与えられます.addOne関数が呼び出されたので、スレッドは保存されたaddOne変数からコンテンツを取り出して解析し、実行します.この時、jsは新しい実行文脈を作成しました.つまり、現在の実行文脈は船の新しい文脈です.だから、私はわざわざ新しい写真でそれを説明します.
まず、このlocal execution contextは、私がmemoryプレフィックスを追加しました.表面に現在記憶されているのはすべてこのコンテキストの変数データです.上記のlocalであっても、または現在または将来のglobal memoryであっても、このような記憶環境をより専門的な用語で説明することができる.
さらに、この黒い矢印は、大域的なコンテキストから入ってきたという意味で、特に角を描きました.local memoryは、まず変数variable envirnomentにメモリを割り当てて、呼び出し時にlocal memoryによって値を割り当てられました.続いてinputタグを作成し、計算結果2を与えました.最後に、スレッドがコンテキストから離れた識別情報outputに出会うと、コンテキストから離れ、3の結果を一緒に返します.
この時、この文脈は役に立たなくなりました.だから、ゴミの回収はそれに注目して、適当なタイミングを選んで、中のreturnを光を削除します.
この時、学生が聞きました.「これは普通のシーンです.じゃ、クローズドはどう説明しますか?」
ここでは、関数だけでなく、ouputで参照された変数を関数としてまとめて返します.これはサメに吸着するのが好きな魚のようです.タウナギはどこに行っても持っています.この関数はどこで呼び出されても、それ自体に付随するlocal memoryにその変数を見つけることができる.もしあなたが戻ってきた関数returnを取り出しても、それを見つけることができます.ここでは詳細には説明しません.クローズドのもっと多い概念(関数式プログラミングにおける使用を含む)について、興味のある子供靴はこの記事を見てもいいです.Partial&Curry-関数式プログラミングです.
go onはlocal memoryに戻りました.local memoryは一人ぼっちではなく、可愛いconsole.logをもらいました.
ここに来て、私達のスレッドはすべての仕事を完成しました.休んでもいいです.待ってください.何かを漏らしたようです.はい、global execution contextです.
先ほど私達は全編で説明しました.resultはどのように頑張って行解析実行コードを実行していますか?undefinedはどのようにまめに変数を格納していますか?怠けているのですか
実際には、3は非常に重要な役割を果たしています.これがあったら、スレッドはいつでも自分が現在どのコンテキストにあるかを知ることができます.
考えてみてください.コードを書く過程では、しばしば各種の関数の中に種関数が挿されています.再帰のように、勤勉なスレッドは文脈に入り、コンテキストを終了し、また入り、また退出し、再入場することが好きです.どのCall Stackでデータを取るべきか分かりません.すべてがごっちゃになっていますので、現在のスレッドが置かれている環境を追跡して記録しなければなりません.thread of exectionは、「記憶」文脈のためのデータ構造であり、variable envirnomentに押し入れられ、call stackの文脈を押し出すことによって、スレッドが現在位置している環境を追跡する.スレッドは、自分がどこにいるかを意図的に記憶する必要はなく、常に最上位にいて、以下を実行すれば、現在の関数が実行する正しい位置である.
プログラムが実行されると、call stackはまずmemory個のcall stackを実行します.次に、上記コードの第3行でpushを呼び出しました.popは直ちにcall stackのコンテキストpushを中に入れて、global execution contextの識別が実行されると、addOneが出てきます.
同様に、複雑な場合であっても、call stackaddOne、および時刻が最上位のコンテキストにあるという原則に従う限り、スレッドは常に正しい位置に維持され得る.
ちなみに、pushの階数には上限がありますので、注意しないと、あなたの書いた再帰はreturnを引き起こすかもしれません.
締め括りをつける
簡単に言えば、コンテキストはコードを実行するために使用できる環境であり、関連する3つの重要な概念があります.
  • thread of exectionは、上から下にかけて、コードを解析して実行します.同時に多くの場所で実行しません.つまり、私たちがよく口にする「jsはシングルスレッドですよ」
  • です.
  • variable envirnoment(変数環境)アクティブなデータ記憶用メモリ
  • call stack(コールスタック)は、コンテキストを記憶し、現在のスレッドが属するコンテキスト位置を追跡するためのデータ構造
  • を提供する.