javaScripr學習總結1

<!DOCTYPE html>
<html>
<head>
 <meta charset="UTF-8">
 <script>
    //閉包:能夠讀取其他函數內部變量的屬性的函數。
    //1 閉包會似的函數中的變量都被保存在內存中,內存消耗很大,不能濫用閉包,
    //否則會造成網頁性能的問題。解決方法,在退出函數之前將不適用的局部變量全部刪除。
    //2 閉包會在父函數外部,改變父函數內部變量的值。所以你把父函數當做對象(object)使用時,
    //把閉包當做它的公用的方法(public Method),把內部變量當做它的私有屬性(private value),這時要小心,不要隨便改變
    //父函數內部變量的值。

    /**
     * 官方”的解釋是:
     * 閉包是一個擁有許多變量和綁定了這些變量的環境的表達式(通常是一個函數),因而這些變量也是該表達式的一部分。
     * 通俗的來說就是:
     * JavaScript中所有的function都是一個閉包。
     * 不過一般來說,嵌套的function所產生的閉包更爲強大,也是大部分時候我們所謂的“閉包”
     * 當函數a的內部函數b被函數a外的一個變量引用的時候,就創建了一個閉包。
     */
    /**
     * 閉包的應用場景:
     * 1 保護函數內的變量安全 :不與外部變量衝突,不能在外部訪問
     * 2 在內存中維持一個變量
     * 3 通過保護變量的安全實現JS私有屬性和私有方法(不能被外部訪問
     */


    function f1(){ //當f1作爲對象使用時。
                   //當f1作爲方法使用時。
        //局部變量
        var n=0;
        //公共方法(全局域的方法可以看做全局域的屬性)
        f3=function(){ //閉包
            n++;
            alert(n);
        };
        //局部方法(局部變量)
        function f2(){
            alert(n);
        }

        this.show=function(){
           n++;
           alert(n);
        };

        //return f2;  //閉包
    }
    //----當f1作爲方法使用時
    //var f=f1();
    //f(); //0
    //f3();//1
    //f();//1
    //f3();//2
    //alert(n);//undefined 外部的方法無法訪問內部的屬性
    //----當f1作爲對象(構造函數使用時)
   /*
    var t=new f1();
    alert(t.n);//undefiend 無法訪問,如果把方法看做類的話,此時的局部變量,相當於全局的屬性??
    //alert(t.f3());//t3 is not a function
    alert(t.f3);//undefined 由於作用域鏈的存在,外部的變量時無法訪問內部的定義的變量的。
                //此時f3雖然是全局作用域上的方法,但是並不是f1的屬性,f1並沒有f3這個屬性,所以爲undefined
    alert(t.f2);//undefined
    */
    var ff=new f1();
    /**
     * 對象定義的步驟:
     * function Obj(params){
     *  //do something
     * }
     * var obj=new Obj(params);
     * 1 var obj={};
     * 2 Obj.call(obj,[params]); //如果這個方法有返回值的話,obj包含this.的屬性
     *                           //複製屬性
     * 3 obj.prototype=Obj.prototype; //保持原型鏈
     */
    //alert(ff.show); //(有返回值時)undefined
    ff.show(); //1   局部變量給每一個實例複製了一份,但在ff無法直接訪問它。
                    //屬性直接訪問。
                    //-------是不是可以這樣理解?局部變量看成對象的private屬性,需要提供公共的set方法賦值,get獲取方法。
                    //--------------------------而this.的屬性看成public屬性,可以通過構造函數賦值。
                    //作用域?
                    /*
                     作用域       方法域     全局域

                     public         √         √           //this.屬性 (全局域,obj.value)

                     private        √         ×           //局部變量 (函數內部直接使用)
                     function Person(){
                     var t=10;
                     this.showt=function(){
                     alert(t);
                     };
                     this.showtt=function(){
                     this.tt++;
                     alert(this.tt);
                     }
                     }

                     Person.prototype.tt=100;

                     var p=new Person();
                     //alert(p.tt);//undefined

                     p.showtt();//101

                     var p1=new Person();

                     p1.showtt();//101

                     function Student(){
                     Person.call(this);
                     }

                     var s=new Student();

                     // s.showt();//

                     //s.showtt();//

                     */
   // var ff1=new f1();
   // ff1.show();//1   局部變量給每個實例複製了一份,

    //js中核心概念:
   //作用域鏈
   //原型鏈
   //閉包

    //立即執行的匿名函數:
    //閉包
    //模塊化


    (function(outParams){ //
       var _privateProperty="private Property";//定義自己的私有變量 ,設置默認值
       //
       //this.set();
       //this.get();
       function _privateMethod(){//適合於寫工具方法
           //do Somethings
           alert("private method!!");
       }
       publicProperty="public Property";//public 可以被外部修改的,這樣做不好!

       //可以封裝一個內部的閉包,被外部引用,引用一些可以被調用的方法

       //$("").popup(function(){},{
       //   options;
       // });
       var out=function(){
           //callBack的回調函數
           var version="1.5.0Version";
           //options參數
           this.sum=function(callBack,options){
                 callBack(version,options);//執行回調函數
           };
           this.sum1=function(callBack,options){
               //必填參數,可選參數
           };
           //set
           this.setProperty=function(_private){
                _privateProperty=_private;
            };
           //get
            this.getProperty=function(){
                return _privateProperty;
            };
       };
     window.out=out;//可以再外部直接調用了
    })(outParams);

   var jquery=new out();
   alert(jquery.getProperty()); //private property
   jquery.setProperty("private2");
   alert(jquery.getProperty()); //private2
   jquery.sum(function(version,opt){
           //執行求和的回調
           alert(version+":"+(opt.p1+opt.p2)); //110
     },{
        p1:10,
        p2:100
   });
    var outParams=10;//外部變量被閉包引用時,會存在內存中。
                    //即使把外部變量刪除掉,仍然會被保存
 </script>
<body>

</body>
</html>

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章