ホームページ > 記事 > ウェブフロントエンド > JavaScript のスコープの詳細な紹介 (コード例)
この記事では、JavaScript のスコープについて詳しく紹介 (コード例) します。一定の参考値があります。困っている友人は参照してください。お役に立てば幸いです。助けられました。
ほとんどすべてのプログラミング言語にはスコープという概念がありますが、スコープとは正確には何を指すのでしょうか?スコープとは、プログラミング言語が変数を定義するときに、変数がどのように保存され、アクセスされるかに関する一連のルールです。さまざまなプログラミング言語のルールは似ています。次に、この一連のルールがどのように設定されるかを見てみましょう。
コンパイル原理
従来のコンパイル言語では、コードが実行される前にコンパイル プロセスが行われます。
は従来のコンパイル言語とは異なり、js のコンパイルと実行が別々に実行されるのではなく、コンパイル処理が完了した直後に実行されることがほとんどです。短時間で 制限時間内に最適なパフォーマンスを達成します。js エンジンは一般的なコンパイラーよりも複雑です。次に、js のコンパイル プロセスを見てみましょう。例として var a = 2 のコンパイルを取り上げます:
字句スコープ
スコープには通常 2 つの作業モデルがあり、最初のモデルはほとんどのプログラミング言語で使用されます。使用される語彙スコープは動的スコープと呼ばれ、たとえば Bash スクリプトでは動的スコープが使用されます。字句スコープは、字句ステージで定義されるスコープです。字句スコープは、コードを記述するときに変数とブロック スコープを記述する場所によって決まります。変数定義の場所によって決まります。一方、動的スコープは、変数の使用によって決まります。決定されます。場所によって。例を見てみましょう:
function foo(a) { var b = a * 2; function bar(c) { console.log(a, b, c) } bar(b * 3) } foo(2)
まず、スコープが合計でいくつあるか分析してみましょう。
次に、変数検索プロセスを分析しましょう。エンジンが console.log() を実行するとき、3 つの変数 a、b への参照を見つける必要があります。 , および c. まず、最も内側の bar () スコープから開始します。エンジンは a を見つけることができないため、foo() スコープまで検索します。ここで a を見つけて検索を停止します。検索プロセスは b と同じです。 c.スコープ検索は常にランタイムの最も内側のレベルから開始され、最初に一致する変数が見つかるまで外側に向かって検索されます。
関数スコープ
関数スコープとは、この関数に属するすべての変数が関数全体のスコープ内で使用および再利用できることを意味します。これは誰もが知っていることです。定義はわかりますが、関数スコープの存在は何の役に立つのでしょうか?次に、関数スコープの秒数を見てみましょう。
内部実装の非表示
内部実装の非表示とは、非表示の目的を達成するために関数のスコープ内で変数と関数をラップすることです。なぜこれを行うのですか?ソフトウェア設計には「最小公開の原則」と呼ばれる非常に有名な原則があります。これは、モジュールやオブジェクトの API 設計など、必要なコンテンツを最小限に公開し、その他のコンテンツを隠すことを指します。関数スコープを使用して変数と関数をラップし、露出を最小限に抑え、外部からの直接アクセスを防止します。次の例を見てください:
function doSomething(a) { b = a + doSomethingElse( a * 2 ); console.log( b * 3 ); } function doSomethingElse(a) { return a - 1; } var b; doSomething( 2 ); // 15”
このコードでは、doSomethingElse と b は doSomething 内でプライベートである必要がありますが、公開されると、予期しない形式で使用され、予期しない結果が生じる可能性があります。より合理的な設計は、これらのプライベート コンテンツを doSomething 内に非表示にすることです。例:
function doSomething(a) { function doSomethingElse(a) { return a - 1; } var b; b = a + doSomethingElse( a * 2 ); console.log( b * 3 ); } doSomething( 2 );
This way b Neither doSomethingElse doSomethingElse も doSomething の外部からアクセスすることはできませんが、いくつかの問題もあります。第一に、doSomething 関数はグローバル スコープで宣言されており、グローバル ロールを汚染しています。第二に、明示的な呼び出しを通じて実行する必要があります。これを回避するには? 汚染されたスコープを呼び出さずに自己実行できますか?答えは関数式です。次の例を見てください:
(function doSomething(a) { function doSomethingElse(a) { return a - 1; } var b; b = a + doSomethingElse( a * 2 ); console.log( b * 3 ); })(2)
まず、関数式である (function doSomething(){}) を見てください。関数宣言とは異なり、括弧で囲まれています。 then (function doSomething(a){})() は値によって呼び出します。そのため、自己実行でき、スコープを汚染しません。コミュニティでは、この用法を表す用語 IIFE が定義されています。これは、関数の即時実行を表します。表現###
块作用域
除JavaScript外很多编程语言都支持块作用域,尽管你可能写过很伪块作用域形式的代码,最常见的就是for循环:
for(var i=0; i<10; i++) { console.log(i) }
写这段代码通常是希望变量i在循环内部使用,但是实际上i会被绑定到外部作用域中,要确保没有在作用域的其他地方意外使用i,就只能依靠自觉,这时候块级作用域就显得尤为有用,ES6改变了现状,引入了新的let、const关键字,let关键字可以将变量绑定到所在的任意作用域中,也就是let为其声明的变量隐式地创建了作用域:
for(let i=0; i<10; i++) { console.log(i) } console.log(i) // ReferenceError
这时候i就只会在for循环的内部有效
以上がJavaScript のスコープの詳細な紹介 (コード例)の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。