js面試題知識點全解(一閉包)

標籤：ons   修改   範圍   fun   實際應用   child   pre   面試題   listener   

閉包使用情境:
1.函數作為傳回值，如下情境

 1 function F1(){ 2     var a = 100 //自由變數 3     //返回一個函數(函數作為傳回值) 4     return function(){ 5         console.log(a) //a是定義的時候 的範圍，不是執行的時候的範圍，為100 6     } 7 } 8 //f1得到一個函數 9 var f1 = F1()10 var a = 200 //全域範圍，不影響函數內範圍11 f1()

2.函數作為參數傳遞

 1 function F1(){ 2     var a = 100 //自由變數 3     return function(){ 4         console.log(a) //自由變數，父範圍尋找 5     } 6 } 7 var f1 = F1() 8 function F2(fn){ 9     var a =30010     fn() 11 }12 F2(f1) //輸出100

3.實際開發中閉包的應用：
閉包實際應用中主要用於封裝變數，收斂許可權

 1 function isFirstLoad(){ 2     var _list = [] //放在函數內部，封裝變數，使外部無法修改 3     return function (id){ 4         if (_list.indexOf(id) >= 0){ //indexOf() 方法可返回某個指定的字串值在字串中首次出現的位置。如果要檢索的字串值沒有出現，則該方法返回 -1。 5             return false 6         }else{ 7             _list.push(id) 8             return true 9         }10     }11 }12 13 //使用14 var firstLoad = isFirstLoad()15 firstLoad(10) //true16 firstLoad(10) //false17 firstLoad(20) //true

執行個體:建立10個a標籤，點擊哪個彈出哪個數字

錯誤寫法：

 1 //錯誤寫法 2 var i,a 3 for( i = 0; i<10; i++){ 4     a = document.createElement(‘a‘) 5     a.innerHTML=i+‘<br/>‘ 6     a.addEventListener(‘click‘,function(e){ 7         e.preventDefault() //preventDefault() 方法阻止元素髮生預設的行為（例如，當點擊提交按鈕時阻止對錶單的提交）。 8         alert(i) //i都是10，i是自由變數，要去父範圍(全域範圍)擷取值，此時i已執行完，值為10 9     })10     document.body.appendChild(a)11 }

 正確寫法：

 1 var i 2 14 for( i = 0; i<10; i++){ 3 15     (function(i){ 4 16         var    a = document.createElement(‘a‘) 5 17         a.innerHTML=i+‘<br/>‘ 6 18         a.addEventListener(‘click‘,function(e){ 7 19             e.preventDefault() //preventDefault() 方法阻止元素髮生預設的行為（例如，當點擊提交按鈕時阻止對錶單的提交）。 8 20             alert(i)  9 21         })10 22         document.body.appendChild(a)11 23     })(i) //建立一個自執行函數12 24 }

 

js面試題知識點全解(一閉包)