關於作用域和js執行機制的一道面試題

題目：


var funcs = 
for (var i = 0; i < 10; i++) )
}funcs.foreach(function(func) )

這題輸出多少呢？

答案：十個10。

為什麼？

當然了，不排除已經會的童鞋了，如果會的話，請關閉這篇博文，不然只會浪費時間。如果不會，那麼請務必好好看看。

回答之前，我們再看看這道題變化後輸出是什麼樣子的：

var funcs = ;
for (var i = 0; i < 10; i++) )
console.log(funcs[i]());
}funcs.foreach(function(func) )

那麼這道題的列印的又是些什麼值呢？

答案：0.1.2.3.4.5.6.7.8.9和十個10.

為什麼呢？

其實大家把兩段**用瀏覽器即可驗證出來了，細心的同學甚至就知道為什麼了。

下面我把兩段**在瀏覽器中列印的值的圖放出來：

1.首先，函式或者說方法只有在呼叫的是時候才會執行其內部語句，否則相當於只定義了乙個方法，這裡舉個栗子：

這裡我在裡面定義了乙個名為test的函式，但是裡面的變數tested根本就未定義，但是在瀏覽器中是不會報錯的，但只要我們呼叫了這個函式，那麼瀏覽器會報錯：

2. 知道之後，我們便可知原題中，由於funcs陣列push進去了十個匿名函式，但由於尚未呼叫，所以裡面的i並未列印出來，但是實質上裡面的i的確是0,1,2,3,4,5,6,7,8,9。但是在for迴圈外面在呼叫陣列中的函式時，是因為在for迴圈體外，出了for迴圈的作用域，作用域這裡我就不再解釋了，所以導致後面在呼叫的時候，i的已經變成了for迴圈結束之後的值了，也就是10，也因此列印出十個10.

3.修改後的**也就是第二段**為什麼列印的是0,1,2,3,4,5,6,7,8,9，是因為它在for迴圈體內，在作用域內，因此能訪問到正確的i值。

好，分析完了，那麼我們有什麼方法可以修改原題之後，達到我們想要的效果，也就是分別列印出0,1,2,3,4,5,6,7,8,9呢？

博主這裡提供兩種：

1）es5的方法：立即呼叫函式方法

// es5知識，我們可以利用「立即呼叫函式」解決這個問題
var funcs = 
for (var i = 0; i < 10; i++) 
})(i))}
funcs.foreach(function(func) )

2)es6的方法：

const funcs = ;
for (let i = 0; i < 10; i++) )
}funcs.foreach(func => func())

關於作用域和js執行機制的一道面試題

一道關於JS作用域的面試題

js作用域相關的一道題

一 GCC的作用和執行機制

關於作用域和js執行機制的一道面試題

一道關於JS作用域的面試題

js作用域相關的一道題

一 GCC的作用和執行機制

相關推薦