JavaScript閉包詳解

Posted on by

1. 什麼是閉包

閉包：函數本身和該函數聲明時所處的環境狀態的組合。
也就是說函數不在其定義的環境中被調用，也能訪問定義時所處環境的變量。

所以使用閉包，就可以將數據與操作該數據的函數相關聯。

舉個例子：

function foo() {
	let a = 1;
	return function() {
		console.log(a);
	}
}
let foo1 = foo();
foo1() // 輸出 1

這個就是一個閉包的例子，在 foo 中，由於 return 瞭一個函數，這個函數擁有涵蓋 foo 內部作用域的閉包，也就是 a，使得 a 一直存活，不會在 foo 結束時被回收。

2. 閉包的作用

2.1) 記憶性

什麼是閉包的記憶性

當閉包產生時，函數所處環境的狀態會始終保持在內存中，不會在外層函數調用結束後，被垃圾回收機制回收。

舉個例子：

function foo() {
    let a = 0;
    return function() {
        a ++;
        console.log(a);
    }
}
let foo1 = foo();
let foo2 = foo();
foo1();  // 1
foo2();  // 1
foo2();  // 2
foo1();  // 2

在這裡插入圖片描述

因為 a 屬於閉包的一部分，所以當閉包產生時，a 所處的環境狀態會保持在內存中，不會隨外層函數調用結束後清除，所以隨著 foo1的使用，a 都會在內存中的值加 1。
然後 foo1 和 foo2 產生的閉包是兩個獨立的閉包，它們互不影響。所以 foo2 第二次調用的時候，是在它自己第一次調用後結果上加 1.

2.2) 模擬私有變量

保證一個變量隻能被進行指定操作。

舉個例子：

function foo() {
	let A = 0;
	return {
	    getA : function() {
	        return A;
	    }, 
	    add : function() {
	        A ++;
	    },
	    del : function() {
	        A --;
	    }
	}
}
let foo1 = foo();
console.log(foo1.getA()); // 0
foo1.add();
console.log(foo1.getA()); // 1
foo1.del();
console.log(foo1.getA()); // 0

在這裡插入圖片描述

通過閉包，保證瞭 A 隻能被進行指定的 加一，減一操作。

3. 閉包的註意點

不能濫用閉包，否則可能會因為內存占用過多而造成網頁的性能問題，甚至可能造成內存泄漏。

總結

本篇文章就到這裡瞭，希望能夠給你帶來幫助，也希望您能夠多多關註WalkonNet的更多內容!

推薦閱讀：