您好,登錄后才能下訂單哦!
這篇文章給大家分享的是有關js中閉包指的是什么的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
本文實例講述了js 閉包。分享給大家供大家參考,具體如下:
1.什么是閉包
定義:是指有權訪問另一個函數作用域中的變量的函數
創建閉包:在一個函數內部創建另一個函數
基本特點 在返回的匿名函數中 可以調用外部函數的變量 如下例中所示 內部函數(匿名函數) 可以訪問外部函數的變量num 形式如a[num] 原因是匿名函數作用域鏈中包括外部函數test1的作用域
閉包有權訪問包含函數內部的所有變量 如下面的 外部函數定義變量d 在閉包中可以直接訪問到d (var dd=d)
function test1(num){ var d; return function(a,b){ var d1=a[num],d2=b[num]; var dd=d; } }
實例參考 此時點擊產品1 到 產品4 結果都是5 點擊匿名函數的作用域鏈中包括外部函數init的活動對象 都是引用的同一個變量i 都是5 。解決辦法 返回的匿名函數 通過立即執行函數 把參數i傳給匿名函數
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>閉包演示</title> <style type="text/css"> p {background:gold;} </style> <script type="text/javascript"> function init() { var pAry = document.getElementsByTagName("p"); for( var i=0; i<pAry.length; i++ ) { pAry[i].onclick = function() { alert(i); } } } </script> </head> <body onload="init();"> <p>產品 0</p> <p>產品 1</p> <p>產品 2</p> <p>產品 3</p> <p>產品 4</p> </body> </html>
彈出結果都是5截圖
解決辦法:立即執行匿名函數 參數i是循環i的值 傳遞給num形參 匿名函數里 在創建閉包 可以訪問這個傳遞過來的值num
pAry[i].onclick = function(num){//......}(i)
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8" /> <title>閉包演示</title> <style type="text/css"> p {background:gold;} </style> <script type="text/javascript"> /*修改后*/ function init() { var pAry = document.getElementsByTagName("p"); for( var i=0; i<pAry.length; i++ ) { pAry[i].onclick = function(num) { return function(){ alert(num) } }(i) } } </script> </head> <body onload="init();"> <p>產品 0</p> <p>產品 1</p> <p>產品 2</p> <p>產品 3</p> <p>產品 4</p> </body> </html>
結果點擊第一展示
還有這樣寫也是可以的
function a(){ var pAry = document.getElementsByTagName("p"); for( var i=0; i<pAry.length; i++ ) { (function(num){ pAry[num].onclick = function() { alert(num); } })(i) } }
1.1 閉包的原理
-1) 閉包的作用域鏈 包括 閉包自身的作用域(一般返回匿名函數的作用域),外部函數的作用域(包含的外部函數),全局作用域
-2)通常,函數的作用域和所有變量都會在函數執行結束后被銷毀
-3)函數返回一個閉包,這個函數的作用域會一直保存在內存中直到閉包不存在為止
使用閉包可以模仿塊級作用域
-1)創建閉包并立即執行這個函數 不會再內存中留下該函數的引用
-2 )結果 函數內部的所有變量都會被立即銷毀
2.什么是作用域鏈
執行環境:定義了變量或函數有權訪問其他數據,決定它們各自的行為。
變量對象:每個執行環境都有一個與之關聯的變量對象。
執行環境定義的所有變量和函數都保存在變量對象中。編寫代碼無法訪問這個對象,解析器在處理數據時會在后臺使用它。
-1)全局執行環境是最外圍的一個執行環境
-2)web瀏覽器中,全局執行環境默認是window對象,因此所有全局變量和函數都是作為window對象的屬性和方法創建的
-3)某個執行環境中的所有代碼執行完畢后,該環境被銷毀,保存在其中的所有變量和函數定義都隨之銷毀 全局執行環境直到應用程序退出--例如關閉網頁或瀏覽器時才會被銷毀
-4)每個函數都有自己的執行環境
作用域鏈:當代碼在一個執行環境中執行時,會創建變量對象 一個作用域鏈
作用域鏈用途:保證對執行環境有權訪問的所有變量和函數的有序訪問
標識符解析:沿著作用域鏈一級一級的向上搜索標識符的過程。
函數參數也被當做變量來看待,因此訪問規則與執行環境中的其它變量相同。 例子:下面函數chageColor(num){} 在閉包里tempColor(a){}里可用a[num]訪問
實例解析
<script type="text/javascript"> /*全局變量*/ var color = 'red' ; function changeColor(num){ var otherColor = 'blue', another =color, chage = changeColor(); function tempColor(a){ var temp = otherColor, temp2 = color, temp3 = changeColor();/*這里可以訪問上層執行環境otherColor another chage 和全局color*/ var u =a[num]; } } </script>
全局 window
|
|-------------color 全局變量
|------------changeColor()
|
|---------------otherColor(局部變量 還有兩個就是調用的上層全局環境里的color變量和函數chageColor)
|---------------tempColor()
|-------------------h(變量h不能被上層執行環境調用 只能在tempColor()里調用 標識符向上搜索沿著作用域鏈 這個環境里可以調用外層環境和全局環境的變量)
感謝各位的閱讀!關于“js中閉包指的是什么”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。