ホームページ > ウェブフロントエンド > jsチュートリアル > 匿名関数、入れ子関数、クロージャとは何ですか?

匿名関数、入れ子関数、クロージャとは何ですか?

一个新手
リリース: 2018-01-27 13:58:09
オリジナル
2256 人が閲覧しました

匿名関数:前の記事でも触れましたが、関数名のない関数を指します

function (){ 
console.log('匿名函数') 
}
ログイン後にコピー

入れ子関数についてはどうですか?コードを見てください:

function test (){
   var  sum = 20;
   //内嵌函数
   demo = function(){
        alert(sum);
        console.log('我是嵌套函数');
    }
}
ログイン後にコピー

コードに示されているように、関数の中に関数が埋め込まれており、これを入れ子関数と呼びます。

では、クロージャとは何でしょうか?

あまり言うことはありません、コードを見てください

function demo(){
   var num = 0;
   
   // 返回一个函数 
   return function(){
      alert( num+1 );
   }
} 
//将返回的函数赋值给 add 变量
var add = demo();
// add就是一个闭包
add();
ログイン後にコピー

こうして見ると、ネストされた関数であり、上位スコープの変数にアクセスできる限り、それはクロージャであるように感じられます。 そうですか?

jsではグローバルスコープとローカルスコープに分かれており、それぞれの関数がローカルスコープに相当することが分かりました。

同様に、変数もグローバル変数とローカル変数に分けられます。 どのような違いがありますか?

ブラウザでは、グローバル スコープ オブジェクトは window です。これは、ページが開かれるとすぐに window オブジェクトが存在することを意味します。

jsでは、各関数にはローカルスコープがあり、ローカル変数は関数の実行とともに作成され、実行後に破棄されます。

グローバル変数は、ページが閉じられない限り常に存在します。関数の実行時に破棄されません。

では、それは閉鎖と何の関係があるのでしょうか?

書籍「JavaScript 高度なプログラミング」では、「スコープ チェーン」の概念について説明しました。特別なことは、グローバル変数を関数内で直接読み取ることができることです。

ただし、関数内の変数は関数外から読み取ることはできません。

言い換えれば、スコープチェーンは、上がることはできても降りることはできないはしごのようなものです。

var  name = "window";
var  age    =  20;
dmeo();
function demo(){
     var age = 21;
     console.log(name);  // window
     console.log(age);     //21
}
ログイン後にコピー

を理解するためにコード スニペットを見てみましょう。demo() 関数を実行すると、グローバル スコープにつながるチェーンが作成され、検索と戻りのために現在のスコープの変数が保存されます。

console.log( name )というコードを実行すると、name変数が現在のスコープに存在するかどうかを検索します(デモ関数) 現在のスコープが存在しないため、グローバル変数名が上位に見つかり、windowが返されます。 ;

コード console.log(age) を実行すると、現在のスコープに age 変数が存在するかどうかも検索されます (デモ関数)。存在するため、21 が返されます。

このメカニズムは上方向にしか読み取ることができないため、内部関数の変数を外部から読み取るにはどうすればよいかという質問を考えてみましょう。

方法はありません。少し変更するだけです。これには、クロージャの概念を使用する必要があります。

function  f1(){
   var num = 0 ;
   //定义内部函数
   function f2(){
      return  num + 1;
   }
   //返回 f2函数引用
   retufn  f2;
}

// bar 变量也指向 f2 函数,在此也是一个闭包
var bar = f1();

//执行
bar();   // 1;
ログイン後にコピー

関数内の変数は、関数の実行後に破棄されることがわかっています。上記コードでは、f1()関数実行後、f2関数がグローバル変数に代入されており、f2関数の変数はf1のnum変数に依存するため、f1

のnum変数は次のようになります。 f1 の機能に従いません。実行後に破棄されます。

ここで「Ruan Yifeng」のタイトルをお借りして分析し、理解を深めます。

リンク: JavaScript クロージャの学習

var name = "the window";
  
 var obj = {
      name : 'the obj',
      getName : function(){
          return funciton(){ 
               return this.name;
          }
      }
}

//执行 getName返回的函数
alert(obj.getName()());
ログイン後にコピー

呼び出し関数の分析を見て、実行のために 2 つの部分に分割してみましょう。 まずobj.getName()を見てみましょう; このとき、getName関数はobjオブジェクトによって呼び出されるため、この値はobjになります。 ただし、今回は出力ではなく関数を返します。

返された関数を実行するには (); を追加しますが、返された関数がオブジェクト自体によって呼び出されない場合、this の値は window オブジェクトに昇格されます。したがって、出力は「ウィンドウ」です

var name = "the Window";
var obj = {
    name : "the obj",
    getName : funciton(){
        var that = this;
        return function(){
             return that.name;
         }
    }
}
//执行 getName 返回的函数
alert(obj.getName()());
ログイン後にコピー

以上が匿名関数、入れ子関数、クロージャとは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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