範囲と可変リフト:フロントエンド(34)〜学習(XI)のJSを学びます

スコープ:人気の用語、スコープは、変数や関数のスコープです関数が定義されている場合スコープは、それが決定されています。

目的:命名の競合を削減しながら、プログラムの信頼性を向上させます。

分類スコープ

  • グローバルスコープ:内部全体のスクリプトタグの役割、または別のJSファイルの範囲。

  • 関数スコープ(ローカルスコープ):機能コード環境での役割。

アクセス関係の範囲

範囲内で外側のスコープ内部変数のスコープにアクセスできないの範囲外の変数にアクセスすることができます。

コード例:

= VAR 'AAA'、
関数foo(){ 
    VAR = B 'BBB'; 
    にconsole.log(A); //印刷結果:AAA。外側のスコープ内のスコープ変数最も内側の説明access 
} 

;のfoo()
はconsole.log(B); //エラー:キャッチされないにReferenceError:Bが定義されていません 。説明囲むスコープ内部スコープでアクセス変数はできません

変数のスコープ

グローバル変数、レイアウト変数:異なる変数のスコープに応じて2つのカテゴリに分けることができます。

グローバル変数:

  • 変数と呼ばれる、グローバルスコープで宣言された「グローバル変数。」任意のグローバルスコープの場所は、この変数にアクセスすることができます。

  • グローバルスコープでは、変数は、VARのグローバル変数を使用して宣言されています。

  • 特殊なケース:VAR変数はグローバル変数を宣言された関数内で使用されていません(そのような使用はお勧めしません)。

ローカル変数:

  • 変数関数のスコープで定義され、「ローカル変数」と呼びます

  • 関数の内部で、変数はローカル変数varを宣言しています。

  • 関数のパラメータはローカル変数が属しています。

パフォーマンスの観点から、グローバルとローカル変数:

  • グローバル変数は:ブラウザが閉じているときにのみ、総メモリの比較を破壊されます。

  • ローカル変数:それが実行されているコードブロックは、メモリ空間の保存、比較を破壊されます。

優れた-従属関係のスコープ

変数関数スコープを操作する場合は直接使用(近接の原則)がある場合、それは最初、その範囲で探します。そうでない場合は、次に高いレベルのスコープグローバルスコープを見つけるまで探して、グローバルスコープがまだ見つからない場合は、エラーにReferenceError。

機能では、ウィンドウオブジェクトを使用することができ、グローバル変数にアクセスしたいです(あなたはグローバル変数を使用することができますアクセスしたい場合たとえば、グローバルスコープと関数スコープは、変数Aに定義されていますwindow.a

グローバルスコープ

JSコードは、グローバルスコープの両方で、スクリプトタグ内に直接書き込ま。

  • グローバルスコープは、ページを閉じたときにページが破壊され、開かれたときに作成されます。

  • グローバルスコープでグローバルオブジェクトウィンドウ、持っている代表ブラウザによって作成されたブラウザウィンドウのが、私たちが直接使用することができます。

グローバルスコープ内の:

  • 変数は次のように作成されたウィンドウオブジェクトプロパティを保存しますたとえば、グローバルスコープの書き込みでは  var a = 100、ここ  a と同じです  window.a

  • 関数は、作成するウィンドウオブジェクトの保存方法を。

予め変数宣言(可変リフト

使用する変数宣言varキーワード(たとえば  var a = 1、)任意のコードが実行される前に、それが宣言されます(ただし、割り当てられていない)、しかし、あなたは、varキーワードを使用していない場合は(直接書き込みなどの変数を宣言するときa = 1)、変数は事前に宣言されていません

例1:

    console.log(A)。
    VAR A = 123。

印刷結果:未定義ことに注意してください印刷結果がエラーではありませんが、未定義、説明変数は事前に宣言されているが、まだ割り当てられていません。

例2:

    console.log(); 
    = 123; window.aに//この場合、対応します

プログラムがしますUncaught ReferenceError: a is not defined文句を言います:

例3:

    = 123; window.aに//この場合は、相当
    にconsole.log()。

結果を印刷します:123。

例4:

FOO(); 

関数foo(){ 
    {(偽)なら
        するvar i = 123。
    } 
    にconsole.log(I)。
}

印刷結果:未定義。印刷結果ではなく、エラーが、未定義のことに注意してください。再びショー一度この例:関数実行前に、変数iが、それは事前に宣言されましたが、まだ割り当てられていません。

事前に関数の宣言

関数の宣言:

使用函数声明創造の形で機能をfunction foo(){}それが事前に宣言されます

言い換えれば、関数全体任意のコードが実行される前に、それがされた作成だから、コードの順に、我々は最初の関数を呼び出し、その関数を定義することができます。

コード例:

    FN1(); // 定義関数FN1が戻っている間は、しかし、あなたはここで関数を呼び出すことができるように彼らは、事前に宣言されたため
 
    、関数FN1(){ 
        はconsole.log(「私は、関数FN1よ」); 
    }

関数式:

使用し函数表达式作成された機能はvar foo = function(){}それが事前に宣言されることはありませんので、あなたが文の前に呼び出すことはできません

この時点ではfooは(ここでの唯一の変数宣言)と宣言され、定義されていない、としなかったので、まあ、理解  function(){} FOOに割り当てられています。

したがって、次の例を説明します。

関数スコープ

関数スコープではなく、機能の事前の声明:1を思い出させます:

  • この関数は、変数を宣言するためにvarキーワードを使用して、任意のコードが実行される前に、関数内で宣言されます

  • この関数は、何の変数はグローバル変数varステートメントではないが、と事前に宣言していません

例えば:

    A 1 = VAR; 

    関数foo(){ 
        にconsole.log()
        = 2; //ここでwindow.aに対応
    } 

    のfoo(); 
    にconsole.logを(); //印刷結果が2であります

FOOを行った後、上記のコード、()、印刷結果である機能1コード、実行のfoo()、印刷結果が関数の最初の行を削除する場合Uncaught ReferenceError: a is not defined

リマインダー2:の定義パラメータは、に相当する機能の範囲変数の宣言。

    関数fun6(E){//この関数は、パラメータEので、この場合は、関数内のコードの最初の行に相当する、EのVARを書いた; 
        にconsole.log(E); 
    } 

    FUN6() ; //印刷結果は未定義である
    FUN6(123); //印刷結果123

JavaScriptは(ES6用前)ブロックレベルのスコープはありません

、によって他のプログラミング言語でブロックレベルのスコープが存在する(Java(登録商標)、C#等){}を含みます。たとえば、Java言語で、変数がif文で作成された、あなただけのif文の内部で使用することができます。

IF(TRUE){ 
    int型NUM = 123。
    system.out.print(NUM)。// 123 
} 
system.out.print(NUM)。//报错

しかし、JSに(ES6用前)ないブロックレベルのスコープ。たとえば、次のように:

(真の)IF { 
NUMするvar = 123; 
    にconsole.log(123); // 123 
} 

にconsole.log(123); // 123(通常印刷)

スコープチェーン

はじめに:

  • ロングコードのように、少なくともスコープあります

  • 関数のローカルスコープ内に書かれました

  • 関数がまだ機能している場合、このスコープが誕生しますと範囲

上記のいくつかの内容に基づいて、我々は描くことができスコープチェーンの概念を。

スコープチェーン外部関数にアクセスするための変数内の関数を用いて検索するための鎖を取られる値を決定する方法は、この構造が呼び出されるスコープチェーン検索するときは、使用して近接の原理を

コード例:

10 NUM = VAR、

関数fn(){ 
    //外部関数
    のvar NUM = 20であり、

    関数fun(){ 
        内部//関数
        にconsole.log(NUM); 
    } 
    ファン(); 
} 
のFn()。

結果を印刷します:20。

 

おすすめ

転載: www.cnblogs.com/Vincent-yuan/p/12423453.html