JavaScript匿名関数とクローズド

47839 ワード

匿名関数とクローズド
  • 匿名関数
  • クローズド
  • 概念
  • 関連知識点
  • クローズド中のthis
  • 循環関数における匿名関数とクローズド
  • 循環関数における匿名関数
  • 循環関数におけるクローズド
  • ブロックレベル作用領域を模仿する
  • プライベート変数
  • 静的プライベート変数
  • 匿名関数
    関数名の関数がありません.
  • 別の匿名関数は、実行および呼び出しができない
  • である.
  • は、匿名関数を変数
  • に割り当てることができる.
  • 、表現による自己実行、シンタックス:(匿名関数).
  • 匿名関数伝達パラメータ、シンタックス:(匿名関数)(パラメータ);
  •     <script>
            //     
            function func1(){
                alert("      ");
            }
            // func1();
    
            //     
            // function(){
            //     alert("      ");
            // }
    
            //           
            // var myfunc = function (){
            //     alert("      2");
            // }
            // alert(myfunc);//        
            // myfunc();//      
    
            //              
            (function(name, age){
                alert("        ")
            })();
    
            //         
            (function(name, age){
                alert(name + "  " + age + " ")
            })("OliGit", 23);
        script>
    
    包みを閉じる
    概念
  • クローズドされた英語の単語はクローズアップであり、他の関数作用領域の変数にアクセスできる関数
  • を意味する.
  • は本質的には、クローズドとは、関数の内部と関数の外部とをつなぐ橋のことである.内部層の関数は、外部関数のすべての変数を使用することができます.外部関数の実行が完了しても、
  • これはJavaScriptの中で非常に重要な知識の一部です.なぜなら、クローズドを使うと、コードの量を大幅に減らすことができます.コードがよりはっきり見えるようになります.
    関連の知識点
  • 一般的な方法は、関数の内部に別の関数
  • を作成することである.
       function myfunc(){
           return function(){
               return("***********");
           }
       }
    
       // alert(myfunc);//         
       // alert(myfunc());//         
       
       //       1
       // alert(myfunc()());//         
       
       //      2
       var bb = myfunc();
       alert(bb());
    
  • クローズドの第1の用途:クローズドによってローカル変数
  • にアクセスすることができます.
       //           
       
       function func(){
           var jb = "    ";
       }
       // alert(jb);//               
    
       function func2(){
           var jb2 = "    2";
           return function(){
               return(jb2);//        func2()     jb2
           }
       }
       //     1
       // alert(func2()());
       
       //     2
       var JB2 = func2();
       alert(JB2());
    
  • クローズドされた第二の用途:これらの変数の値は常にメモリの中で1、懸念点に保持されます.ローカル変数はメモリの中に存在し、グローバル変数の使用を避けることができます.(グローバル変数は複雑なプログラムで多くのトラブルを引き起こす(例えば、衝突、ゴミ回収など)ので、プライベートのパッケージを使用する局部変数を推奨します.この点はクローズドで実現できます.そのため、クローズドを使いすぎると性能が低下します.
       var num = 100;//    
       function add(){
           alert(++num);
       }
       // add();
       // add();
       // add();//       ,num    
    
       function add2(){
           var num2 = 100;//    
           alert(++num2);
       }
       //              ,        
       // add2();add2();add2();
    
       //             
       function add3(){
           var num3 = 100;//    
    
           return function(){
               alert(++num3);
           }
       }
       //     1:      ,      num3       ,
       //                   ,       ,  num3       
       // add3()();add3()();add()();//101
    
       //     2:      ,      add3     , num3      
       //             ,          num3,        
       var ADD3 = add3();//        
       ADD3();ADD3();ADD3();//101,102,103
    
       ADD3 = null;//      ,      ,         
    
    
    クローズド中のthis
    匿名関数の実行環境は大域的であり、thisは通常windowを指す.
  • は、オブジェクトを用いてthisの指向を強制的に変更することができる
  • .
  • は、この変数
  • にアクセスするために、thisを変数に割り当てます.
    
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>    thistitle>
    head>
    <body>
        <script>
            var name = "The Window";
    
            var obj1 = new Object();
            obj1.name = "The Object";
            obj1.getName = function(){
                return this.name;
            }
            // alert(obj1.getName());//  The Object
    
            var obj2 = {
                name : "The Object2",
                getName: function(){
                    return this.name;
                }
            }
            //       
            // alert(obj2.getName());//  The Object2
    
            //     this/////////////////////////////////
            var obj3 = {
                name : "The Object3",
                getName : function(){
                    return function(){
                        //               ,this     window 
                        return this.name;
                    }
                }
            }
            // alert(obj3.getName()());//  The Window
            
            //        name
            //    :        call()    this   
            // alert(obj3.getName().call(obj3));//  The Window
    
            //    : this       ,        
            var obj4 = {
                name : "The Object4",
                getName : function(){
                    //    object  ,    this  object,        2   
                    // alert(this);
                    //            this       ,              
                    var self = this;//this  Object  
                    return function(){
                        //                 
                        return self.name;
                    }
                }
            }
            alert(obj4.getName()());
        script>
    body>
    html>
    
    循環関数の匿名関数とクローズド
    循環関数の匿名関数
            function func1(){
                var arr = [];
                for (var i = 0; i < 5; i++){
                    arr[i] = "  " + i;
                }
                return(arr);
            }
            // alert(func1());//  0,  1,  2,  3,  4
    
            //         
            function func2(){
                var arr2 = [];
                for (var i = 0; i < 5; i++){
                    arr2[i] = function(){
                        return "  " + i;
                    };//          ,   i   
                }
                return(arr2);//  arr2   5         
            }
            // alert(func2());//               ,          
            //function(){ return "  " + i; },
            //function(){ return "  " + i; },
            //function(){ return "  " + i; },
            //function(){ return "  " + i; },
            //function(){ return "  " + i; }
    
            var Bb = func2();//      ,   i    5,      
            //      , i = 5        
            // alert(Bb[0]);   alert(Bb[1]); //function(){ return "  " + i; }
            // alert(Bb[0]());     alert(Bb[1]()); //  5,   5
            // for (var i = 0; i < 5; i++){
            //     alert(Bb[i]());//    5,         
            // }
    
            //            
            function func3(){
                var arr3 = [];
                for (var i = 0; i < 5; i++){
                    arr3[i] = (function(){
                        return "  " + i;
                    })()//        
                }
                return arr3;//  arr3               
            }
            var Bb3 = func3();
            // alert(Bb3.length);//5
            // alert(Bb3);//  0,  1,  2,  3,  4
            // alert(Bb3[0]);//  0
    
    循環関数の中のクローズド
            function func4(){
                var arr4 = [];
                for (var i = 0; i < 5; i++){
                    arr4[i] = (function(n){
                        return function(){
                            return "  " + n;
                        }
                    })(i)
                }
                return arr4;
            }
            var Bb4 = func4();
            // alert(Bb4.length);//5
            for (var i = 0; i < 5; i++){
                // alert(Bb4[i]);
                alert(Bb4[i]());//      0-4
            }
    
    ブロックレベルのスコープを模倣する
    ブロックレベルのスコープはまたプライベートスコープと呼ばれ、単数JSはブロックレベルのスコープの概念がない.これは、ブロックステートメント(例えば、forステートメント)で定義された変数が、forステートメントを残してから無効になることがないことを意味します.
  • は、ブロックレベルのスコープを使用した後、匿名関数で定義された任意の変数が、実行終了時に破棄されます.
  • 一般的には、私たちは、グローバルスコープに変数と関数をできるだけ少ない量で追加します.多すぎるグローバル変数と関数は、命名衝突を招きやすいです.
  • ブロックレベルのスコープを使用して、各開発者は自分の変数を使うことができます.また、グローバルスコープを混乱させる心配もありません.
  • は、グローバルスコープにおいてブロックレベルのスコープを使用することで、クローズドメモリの占有問題を低減することができる
  • .
    function func(){
                for (var i = 0; i < 5; i++){
                    // i       for     
                }
                var i;//        i  ,    5
                alert(i);//i  5
            }
            // func();
    
            //        
            function func2(){
                (function(){
                    for (var i = 0; i < 5; i++){
    
                    }
                })()
                alert(i);//   i     ,   :"i is not defined"
            }
            func2();
    
    プライベート変数
    JavaScriptには私有属性概念がない.すべての属性は共通のプライベート変数の概念です.関数外でこれらの変数にアクセスできないので、どの関数でも定義された変数はプライベート変数です.
  • プライベート変数:関数のパラメータ、局所変数、関数の内部定義を含む他の関数
  • 特権方法:内部にクローズドが作成され、クローズドがプライベート変数にアクセスできます.したがって、プライベート変数にアクセスするためのパブリック方法を作成し、特権方法
  • と呼ぶ.
  • は、構成方法を通じてプライベート変数にアクセスすることができる(この方法の欠点は、各インスタンスのための新しい方法のセットを作成し、共有を実現することができない)
  • .
        <script>
            function sum(){
                var m = 100;
            }
            // alert(m);//   ,    (    ),      
    
            function people(){
                this.name = "OliGit";
                this.say = function(){
                    return "  " + this.name;
                }
            }
            // var pson = new people();
            // alert(pson.name);//OliGit
            // alert(pson.say());//  OliGit
    
            function people2(){
                var name = "OliGit";//    
                function say(){//    、  
                    return "  " + name;
                }
                this.getName = function(){
                    return name;
                }
                this.getSay = function(){
                    return say();
                }
            }
            var pson2 = new people2();
            // alert(pson2.name);//undefined
            // alert(pson2.age);//undefined
            // alert(pson2.say());//say is not a function
    
            alert(pson2.getName());//OliGit
            alert(pson2.getSay());//  OliGit
    
    		//                
            function people3(_name){
                var name = _name;
                this.getName =  function(){
                    return name;
                }
                this.setName = function(value){
                    name = value;
                }
    
            }
            var pson3 = new people3("OliGit");
            alert(pson3.getName());
            
            pson3.setName("   ");
            alert(pson3.getName());
        </script>
    
    静的プライベート変数
    ブロックレベルのスコープ(プライベートスコープ)でプライベート変数または関数を定義し、外部公開の特権方法を作成する.
  • は、まずプライベートスコープ
  • を作成する.
  • プライベート変数または関数
  • を定義します.
  • 構築関数と特権方法を定義する
  • .
  • このように作成されたプライベート変数は、プロトタイプを使用して共有される
  • を実現する.
  • 同時共有のため、インスタンスは自分のプライベート変数
  • を持っていません.
        <script>
            (function(){
                var name = "OliGit";
                User = function(){}//     
                User.prototype.getName = function(){
                    return name;
                }
                User.prototype.setName = function(value){
                    name = value;
                }
            })()
            var VIP1 = new User();
            // alert(VIP1.getName());
            VIP1.setName("Olivia");
            alert(VIP1.getName());//Olivia
    
            var VIP2 = new User();
            alert(VIP2.getName());//Olivia
        script>