JS閉包 及閉包的應用場景

2022-08-10 19:03:13 字數 1768 閱讀 1864

閉包:如大家所知,通俗講,可以訪問其他函式內部變數的函式

//

建立閉包最常見的方式函式作為返回值

function

fn() ;

}let log =fn();

log();

//列印「小帆」 --外部函式訪問內部變數

下面來實現乙個簡單的demo:計數器

var number = 0;

function

creat()

creat();

//確實實現了需求

//但是如果需要第二個計數器呢?

//確定要像

下面這樣寫嗎?

var num = 0;

function

creat_1()

creat_1();

function

createnum() ;

}var fun1 =createnum();

fun1(); //1

fun1(); //

2var fun2 =createnum();

fun2(); //1

fun2(); //

2

有一種經典題目:for迴圈裡的定時器引發的思考

下面這道題的結果是多少?

for (var i = 0; i < 4; i++) , 300);

}

依次列印0,1,2,3  ???,然而列印的全都是4

原因:js 執行的時候首先會先執行主線程,非同步相關的會存到非同步佇列裡,當主線程執行完畢開始執行非同步佇列, 主線程執行完畢後,此時 i 的值為 4,說以在執行非同步佇列的時候,列印出來的都是 4(這裡需要大家對event loop 有所了解(js 的事件迴圈機制))

要使其依次列印0,1,2,3,則可以考慮閉包:

//

方法一:

//這個是通過自執行函式返回乙個函式,然後在呼叫返回的函式去獲取自執行函式內部的變數,此為閉包

for (var i = 0; i < 4; i++) ;

})(i),

300);}//

方法二:

//大部分都認為方法一和方法二都是閉包,我認為方法一是閉包,而方法二是通過建立乙個自執行函式,使變數存在這個自執行函式的作用域裡

for (var i = 0; i < 4; i++) , 300);

})(i);

}

再舉乙個例子:獲取多個元素並新增點選事件

var op = document.queryselectorall("p");

for (var j = 0; j < op.length; j++) ;}//

log出來的值是一樣的

//解決辦法一:

for (var j = 0; j < op.length; j++) ;

})(j);}//

解決辦法二:

for (var j = 0; j < op.length; j++) ;

})(j);

}

既然這樣,那每次遇到這種問題的時候我是不是可以都這樣使用閉包?

最後說一下,閉包有它的好處,也有它的壞處

閉包的缺點:閉包會導致記憶體占用過高,因為變數都沒有釋放記憶體,從而垃圾**機制不會銷毀該變數。

js閉包的應用場景

js閉包的應用場景 本質 js中沒有私有變數,而閉包是是一種保護私有變數的機制,保護裡面的私有變數不受外界干擾。閉包的演進過程 統計網頁訪問的次數 1.常規方式 var counter 0 function add add add add 計數器現在為 3存在問題 任何地方都可以直接訪問counte...

閉包的應用場景二

閉包的應用場景一 閉包的應用場景二 閉包的應用場景三 閉包的應用場景 1.使用閉包代替全域性變數 2.函式外或在其他函式中訪問某一函式內部的引數 3.在函式執行之前為要執行的函式提供具體引數 4.在函式執行之前為函式提供只有在函式執行或引用時才能知道的具體引數 5.為節點迴圈繫結click事件,在事...

mysql閉包錶應用場景 閉包的理解和應用場景

1.什麼是閉包?在了解閉包之前,我們要清楚js的另乙個知識,那就是作用域鏈。什麼是作用域鏈,比如乙個函式裡面包含著另乙個函式,裡面的函式在使用乙個變數的時候會在函式自己的作用域內去查詢這個變數,如果沒有,就會沿著作用域鏈向上級函式的作用域去查詢,這樣的乙個過程我們就叫做作用域鏈。作用域鏈是可以有函式...