本次主要內容是 閉包

閱讀時間： 約 3分鐘

記得點個贊支援支援我哦

初步瞭解

先看下程式碼,輸出結果是多少?

1 function fn1 () {
2    var a = 2
3    function fn2 () {
4      console.log(a)
5    }
6 }
7 fn1()

如何產生閉包呢?

當一個巢狀的內部(子)函式引用了巢狀的外部(父)函式的變數(函式)時, 就產生了閉包

那閉包到底是什麼呢

理解一: 閉包是巢狀的內部函式(絕大部分人) 
理解二: 包含被引用變數(函式)的物件(極少數人)(傾向於第二種) 
我們可以chrome除錯來檢視 

產生閉包的條件

1.函式巢狀 
2.內部函式引用了外部函式的資料(變數/函式)

常見的閉包

一  將函式作為另一個函式的返回值

 1 function fn1() {
 2    var a = 2
 3    function fn2() {
 4        a++
 5        console.log(a)
 6    }
 7    return fn2
 8 }
 9 var f = fn1()
10 f() // 3
11 f() // 4

1.請問該過程產生了幾個閉包? 
答: 共產生一個(產生條件是建立內部函式物件就會產生閉包)

2.如果說我想再次產生一個閉包,該怎麼做? 
答: 再次建立一個外部函式

二 將函式作為實參傳遞給另一個函式呼叫

1 function showMsgDelay(msg, time) {
2    setTimeout(function () {
3        console.log(msg)  //如果將這行去掉就不會產生閉包
4    }, time)
5 }
6 showMsgDelay('zhouMao', 1000)

閉包作用

1. 使用函式內部的變數在函式執行完後, 仍然存活在記憶體中(延長了區域性變數的生命週期)

2. 讓函式外部可以操作(讀寫)到函式內部的資料(變數/函式)

思考/總結

 1 function fn1() {
 2    var a = 2
 3    function fn2() {
 4        a++
 5        console.log(a)
 6    }
 7    function fn3() {
 8        a--
 9        console.log(a)
10    }
11    return fn3
12 }
13 var f = fn1()
14 f() // 1
15 f() // 0

1. 函式執行完後, 函式內部宣告的 區域性變數(  var a )是否還存在? 
   答: 存在，因為它在閉包中，只有存在於閉包中的變數才 可能存在

2.   fn2 是否存在 
   答: 不存在,因為沒有人引用它,就會變成垃圾物件 

3. 那  fn3 呢,是否存在? 
   答: 存在，是因為  var f = fn1() 導致的( 閉包沒有消失的根本原因 )，當我  return fn3() 的時候，儲存的是  fn3， 一旦返回後，fn3 不存在，但是fn3 不存在不代表函式物件變成垃圾物件，因為  var f = fn1() f 指向的是 fn3

4. 在函式外部能直接訪問函式內部的區域性變數嗎? 
   

   答案但是不能了，但是我們可以通過 閉包 這個技術讓外部操作它

希望大家多多支援我哦

  孔子東遊記           公眾號：  晝貓筆記

​

晝貓筆記