閉包和js事件執行機制簡介

最近碰到了關於閉包的問題，查看資料總結下我眼中的閉包

var price=document.getElementsByTagName('div');
for (var i = 0; i < 6; i++) {
    price[i].onClick=function () {
        console.log(i)
    }
}  // 6 6 6 6 6 6
1
2
3
4
5
6
7
8

先瞭解下js的執行機制，這裡涉及了JS中單線程的概念。由於JS是單線程語言，不存在併發執行的任務，所有任務都需要排隊，前一個任務結束，才會開始下一個任務。因此，在JS中，任務分為兩種，一是同步任務，一是非同步任務。而for迴圈就是同步任務，點擊事件函數是非同步任務，非同步任務會去排隊，排到同步任務的後面（大家猜猜如果幾個非同步任務排隊順序是怎樣的），ok !
現在代碼其實可以等於

var price=document.getElementsByTagName('div');
for (var i = 0; i < 6; i++) {
	price[i].onClick=order();
}  
fnction order(){
    console.log(i)
}
1
2
3
4
5
6
7

然後瞭解什麼是閉包，我理解的閉包就是在函數這個作業域里引用作用域之外的量,閉包有個特點就是–基於詞法作用域的查找規則（當前找不到某個變數，就向上查找，如果最終沒有找到，則返回undefined）。
所以,order()中的 i 就成了6，好了，小伙伴們瞭解了吧

,

                                </div><div data-report-view="{&quot;mod&quot;:&quot;1585297308_001&quot;,&quot;dest&quot;:&quot;https://blog.csdn.net/weixin_44989478/article/details/105594964&quot;,&quot;extend1&quot;:&quot;pc&quot;,&quot;ab&quot;:&quot;new&quot;}"><div></div></div>
            <link href="https://csdnimg.cn/release/phoenix/mdeditor/markdown_views-60ecaf1f42.css" rel="stylesheet">
                            </div>
</article>