1. 程式人生 > >第12天:作用域與閉包

第12天:作用域與閉包

1.js 無塊作用域。

while(true){
                var num=10;
                break;
            }
            console.log(num);

2.作用域 由裡到外,層層呼叫。

3.閉包模式:函式內中包含函式。函式內建包含物件。

閉包的作用:快取資料,如 s.但延長了作用域,一般情況下s 作為區域性變數,在f4()函式執行結束後,記憶體釋放。但由於閉包,ff(),s 的值未能釋放。
            function f4(){
                var s=100;
                return function f2(){
                    s++;
                    return s;
                }
                
            }
            var ff=f4();
            console.log(ff());
            console.log(ff());
            console.log(ff);

result:[Web瀏覽器] "101"    /frontEnd/bind/include.html (42)
[Web瀏覽器] "102"    /frontEnd/bind/include.html (43)
[Web瀏覽器] "function f2(){
                    s++;
                    return s;
                }"    /frontEnd/bind/include.html (44)

4.沙箱

寫在函式內相對獨立的一塊,裡面定義的都是區域性變數,可以訪問外面的全域性變數。裡面的宣告的變數及物件具有預編譯的作用。eg:

var num="456";
            (function(){
                console.log(num);     //宣告會提前,但是未賦值, 因此輸出 undefined
                var num="123";
            }());

result:[Web瀏覽器] "undefined"    /frontEnd/bind/sandbox.html (11)

沙箱 可以避免變數與函式名相同出錯的問題,可把重名的部分函式及程式碼塊放入沙箱中。

(function(){

}());

5.遍歷DOM 樹。

var root=document.docuementElement;  得到 根節點

var children=root.children;  得到子節點的集合。

<script>
        
        var root=document.documentElement;
//        console.log(root.nodeName);
        //找打所有子節點
        function findChildren(root){
            var children=root.children; //root.children 輸出節點   root.chilrdenNodes  非IE輸出節點和#text 
            for(var i=0;i<children.length;i++){
                var childrenNode=children[i];
                console.log(childrenNode.nodeName);
                travalChildren(childrenNode);
            }
        }
//        findChildren(root);
        //遍歷所有子節點的函式
        function travalChildren(childrenNode){
            childrenNode.children&&findChildren(childrenNode);
        }
        findChildren(root);
        
    </script>

6.真陣列與偽陣列。

真陣列長度可變,假陣列長度不可變。

var ss=[10,20,30];
            console.log(ss.length);             =========》3
            ss[3]=40;
            console.log(ss.length);            =========》4
            console.log(ss[0]);                  =========》10;
            
物件:偽陣列            

var st={
                0:10,
                1:20,
                2:30,
                length:3
            };
            console.log(st[0]);                 ==========》10;
            console.log(st.length);          ==========》3

真陣列能使用陣列中的方法,偽陣列可以使用陣列中的方法。

            ss.forEach(function(ele){
                console.log(ele+1);                      ====》11,21,31,41;
            });

    function f1(){
                var sum=0;
//                for(var i in arguments){
//                    sum+=arguments[i];
//                }
                arguments.forEach(function(){            =========》報錯;
                    
                });
                return sum;
            }
            console.log(f1(1,2,3));