無處不在的閉包

shengguo 發布于2019-08-23 18:39 / 3112人閱讀

摘要：每次循環都會創建一個以立即執行函數為作用域的變量，原來在程序中函數訪問的是外部變量，現在訪問的是這一閉包中的變量。

這是篇文章主要是講一下對閉包這一概念的理解。討論閉包之前，我們先從一個經典的例子說起

// 程序1
var arr = []
for(var i = 0; i < 3; i++){
    arr[i] = function () {
        console.log(i)
    }
}
arr[0]()  // 3
arr[1]()  // 3
arr[2]()  // 3

大家都知道，這段代碼最終輸出都為3。因為函數調用的時候循環已經結束了所以 i 等于3，更為重要的是，es6之前沒有塊作用域，變量 i 的作用域不在for循環中，而在for循環之外。如果我們想要看到輸出結果依次為0，1，2，就得用到閉包了。否則，除非我們能在每次循環的過程中調用函數，因為只有在循環進行的過程中 i 才會處于0，1，2的狀態。比如像這樣：

// 程序2
for(var i = 0; i < 3; i++){
    (function () {
        console.log(i)
    })()
}
// 0
// 1
// 2

必須要在循環進行時調用哦，像下面這樣都不行！

// 程序3
for(var i = 0; i < 3; i++){
    setTimeout(function () {
        console.log(i)
    }, 0)
}
// 3
// 3
// 3

當然程序2這樣寫已經失去意義了，這個程序的目的就是要給數組加幾個函數供以后調用，而不是馬上就要調用它。閉包主要就是用來解決這樣的問題，它讓函數可以訪問到函數所被創建時的上下文環境，不論這個函數在什么時候被調用。所以閉包產生的條件有兩個，一是函數能通過變量作用域規則訪問到它被創建時的上下文環境，例如程序1，函數只是簡單的訪問了外部的變量 i，嚴格上講不算閉包。二是函數在其它地方執行時，函數依然能夠記住并訪問到它所被定義時的上下文環境，我們使用閉包來對程序1進行修改：

// 程序4
var arr = []
for(var i = 0; i < 3; i++){
    (function () {
        var j = i
        arr[i] = function () {
            console.log(j)
        }
    })()
}
arr[0]()  // 0
arr[1]()  // 1
arr[2]()  // 2

不同的是這次增加了立即執行函數并在里面定義變量 j ，我們可以把立即執行函數稱為 fn 。每次循環都會創建一個以立即執行函數為作用域的變量 j ，原來在程序1中函數訪問的是外部變量 i ，現在訪問的是fn這一閉包中的變量 j 。fn執行結束時 j 本應被回收，但是由于該作用域內還定義了一個內部訪問了變量 j 的函數，該函數在未來可能被執行，所以 j 被“記住”了，也就是作用域鏈被保存了。我們可以把fn稱為一個閉包，閉包內可以定義函數并且這些函數可以訪問閉包中定義的變量，例如：

function fn(){
    var a = 1;
    return function(){
        console.log(a)
    }
}
var module = fn()
module()  // 1

fn返回的函數通過閉包能夠訪問到 a。

云服務器 GPU云服務器無處不在的人工智能不在騰訊云備案的域名 js閉包的理解阿里云買的服務器不在一個地區怎么互相訪問

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/105628.html

你不知道的JavaScript：閉包

摘要：回憶我一年前，雖然使用過很多，但卻完全不理解閉包是什么。就算你，也會在循環完成時，輸出次當然，不要以為主要的原因是延遲函數會在循環結束時才執行，不然我為什么會在閉包這一節用使用這個例子，哈哈。前言在了解閉包的概念時，我希望你能夠有JavaScript詞法作用域的知識，因為它會讓你更容易讀懂這篇文章。感觸對于那些使用過JavaScript但卻完全不理解閉包概念的人來說，理解閉包可...

weknow619 2019-08-22 17:23 評論0 收藏0
深入javascript——無處不在的this

摘要：由于匿名函數的作用域是全局性的，因此閉包的通常指向全局對象調用返回值為而不是我們預期的，在閉包中函數作為某個對象的方法調用時，要特別注意，該方法內部匿名函數的指向的是全局變量。有人的地方就有江湖，有函數的地方就有this。而this在不同的環境下，又表現為不同的形式，難免讓人有種此this非彼this的疑惑在java等面向對象的語言中，this指的就是當前對象，而在jav...

Scorpion 2019-08-21 12:27 評論0 收藏0
重讀你不知道的JS (上) 第一節五章

摘要：詞法作用域的查找規則是閉包的一部分。因此的確同閉包息息相關，即使本身并不會真的使用閉包。而上面的創建一個閉包，本質上這是將一個塊轉換成一個可以被關閉的作用域。結合塊級作用域與閉包模塊這個模式在中被稱為模塊。你不知道的JS(上卷)筆記你不知道的 JavaScript JavaScript 既是一門充滿吸引力、簡單易用的語言，又是一門具有許多復雜微妙技術的語言，即使是經驗豐富的 Jav...

worldligang 2019-08-23 15:07 評論0 收藏0
我眼中的閉包

閉包，顧名思義就是一個封閉的包裹，你沒辦法窺探到其內部，只能通過暴露給你的方法進行操作。其實在寫代碼的過程中，我們可能已經使用了閉包，只是當時不知道而已。等理解了閉包，再去回顧以前的代碼，就會發現JavaScript中閉包無處不在。剛開始學習閉包的時候，我看過很多關于閉包的文章，大部分都會舉例這樣一段代碼：showImg(https://segmentfault.com/img/bVO3Mo?w=...

leeon 2019-08-21 11:45 評論0 收藏0
云天視角-淺談閉包

摘要：函數在執行的時候執行函數，將當前的變量對象由于當前的環境是函數，所以將其活動對象作為變量對象添加到作用域鏈的前端。此時，由于在執行，而作用域鏈也存在，所以可以在作用域鏈上進行查找，去訪問的變量。一、現狀閉包是jser繞不過的坎，一直在都在說，套用 simpson 的話來說：JavaScript中閉包無處不在，你只需要能夠識別并擁抱它。閉包是基于詞法作用域書寫代碼時的自然結果，你甚...

nanfeiyan 2019-08-22 13:56 評論0 收藏0