首頁 >web前端 >js教程 >實例淺析對閉包的理解

實例淺析對閉包的理解

零到壹度
零到壹度原創
2018-04-02 10:47:391347瀏覽

這篇文章給大家分享的是淺談對閉包的理解 ,內容還蠻不錯的,希望可以幫助到有需要的朋友

##作用域鏈

要更清楚的理解閉包應該先充分的理解作用域鏈,這樣理解閉包就會輕鬆很多。

作用域鏈就是一個指向不同變數儲存空間的列表,通常在全域下都會被window的變數環境所包圍。

每一個執行環境的[[scope]]的屬性都存放著對作用域鏈的參考。

var name = "tianci";

當我們執行完上面的程式碼的時候,在瀏覽器中window.name屬性便是“tianci”,此時window[[scope]]指向的作用域列表所指向的變數空間就有name:"tianci"存在

var name = "tianci";
function sy() {
    var name = "haha";
    console.log(name);
}
sy();//haha

在這個程式碼中,執行到sy()的時候,sy的執行環境的[[scope]]指向的作用域列表會先將window的作用域列表複製到自己的列表,在將sy變數空間插入到作用域列表的頭部(即  list.[0]的位置)。執行到name的時候便會從列表開始查詢name變量,0->1 -> 2 ->3 ......一直到最頂層的變量環境為止。

var name = "tianci";
function sy() {
    var name = "haha";
    console.log(name);
    console.log(this.name);
}
sy();

//haha
//tianci

兩次輸出不一樣

log(name)的時候函數sy先從自身的環境找name所以輸出haha

log(this.name)的時候sy的this指向了window(在瀏覽器中),所以查詢的起始會從window的環境開始查找name所以輸出tianci

#1.作用域鏈就是一個指向多個物件儲存空間的列表,

2.每次函數被呼叫的時候,就會先將呼叫者的作用域鏈copy到自己的作用域鏈,再在鍊錶頭部插入自己的作用域

閉包

閉包就不是很難理解了,閉包概念就是有權訪問另一個函數作用域的變數的函數,其常見的創建方式就是在漢輸得內部創建另一個函數如:

function cC(property) {
    return function (obj1,obj2) {        var value1 = obj1[property]
        var value2 = obj2[property]
        if (value1 < value2) {
            return -1;
        }else if(value1 > value2){
            return 1;
        }else if(value1 == value2){
            return 0;
        }
    }
}

在這裡匿名函數中便訪問了呼叫函數的變數property,這便是閉包

但是閉包會有一個問題,就是當cC執行完之後匿名函數若沒有執行結束,cC的環境活動物件也不會被銷毀,只有等匿名函數執行完後,才會被銷毀。所以閉包有時會造成不必要的記憶體洩漏

通常情況下匿名函數的this物件會指向window(瀏覽器中)

因為當得到傳回的匿名函數之後通常都是在全域環境中直接呼叫了,所以會造成this當時指向的是window。

var name = "chentainci";
var obj ={
    name:"myboj",
    getName:function () {
        return function () {
            return this.name
        }
    }
}
console.log(obj.getName()())

閉包只是取得變數的終值

function fun() {
    var result =new Array();
    for (var i  = 0;i  < 10; i++) {
        result[i] = function () {
            return i
        }
    }
    return result;
}

result儲存的是函數的回傳值都是i的終值10

相關推薦:

閉包什麼是閉包

#深入理解js 閉包

#閉包的常見應用#

以上是實例淺析對閉包的理解的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn