閉包,是開發(fā)中常見的問題了 ,最近文匯軟件小編在開發(fā)一視頻列表的時(shí)候遇到了這個(gè)問題接下來(lái)給大家分享一下。
那么什么是閉包呢?
接下來(lái)先看段代碼:
video標(biāo)簽的個(gè)數(shù)是3個(gè) ,所以b的值為3 ;循環(huán)內(nèi)輸出變量i的值為0,1,2這個(gè)沒問題 ,在循環(huán)內(nèi)給每個(gè)video注冊(cè)監(jiān)聽事件 ,判斷video標(biāo)簽的播放狀態(tài)來(lái)進(jìn)行接下來(lái)事件的處理。這里打印i的值,邏輯下這個(gè)值應(yīng)該是0,1或者2.哪個(gè)標(biāo)簽在播放就輸出哪個(gè)值。接下來(lái)我們打印一下:
結(jié)果跟想象中的不一樣 ,不論播放哪個(gè)標(biāo)簽。打印的值都是3。那么這是為什么呢?
a[i]這個(gè)里面的i會(huì)跟著for循環(huán)語(yǔ)句一個(gè)一個(gè)的變,而它后面的函數(shù)體里面的i是不同時(shí)隨著一起變的,不知道i為多少,只有當(dāng)最后函數(shù)外面調(diào)用這個(gè)函數(shù)體時(shí)才會(huì)找這個(gè)語(yǔ)句里面i的值(console.log(i)調(diào)用了),而此時(shí)i已經(jīng)變成了3(因?yàn)樯厦鎓or循環(huán)執(zhí)行到i = 2時(shí)i++,此時(shí)i = 2,但是i不滿足判斷條件,賦值語(yǔ)句不執(zhí)行,但是i已經(jīng)變成了3);這就是閉包!??!
那么如何解決這個(gè)問題?
js中沒有會(huì)計(jì)作用域,所以循環(huán)內(nèi)函數(shù)調(diào)用時(shí)調(diào)用的是全局作用域里的值,也就是3;但是在ES6中l(wèi)et實(shí)際是為js新增了塊級(jí)作用域,那么我們改下代碼:
接下來(lái)打印下結(jié)果:
我們可以看到 ,輸出的結(jié)果是我們期望的,上述代碼中for循環(huán)之后的{}是塊級(jí)作用域,每次循環(huán)時(shí)候每個(gè)返回的函數(shù)引用的是其對(duì)應(yīng)塊作用域的變量。i的值在for循環(huán)的作用域之外也是獲取不到的。
好了,今天文匯軟件小編就給大家介紹這些 ,大家可以自己試驗(yàn)下哦 ,歡迎評(píng)論區(qū)留言討論更多前端知識(shí)。