當作爲參數傳遞的forEach爲什麼不CONSOLE.LOG工作？

Question

這僅僅是出於好奇，但你們有一個想法，爲什麼這個代碼將無法正常工作？

[1, 2, 3, 4, 5].forEach(console.log); 

// Prints 'Uncaught TypeError: Illegal invocation' in Chrome 

在另一方面，這似乎很好地工作：

[1, 2, 3, 4, 5].forEach(function(n) { console.log(n) }); 

所以......？

Answer 1

其實作爲@SLaks指出，執行console.log好像是用this內部，當它作爲一個參數this傳遞真實，現在指的是陣列實例。

該解決方法很簡單：

var c = console.log.bind(console); [1,2,3,4,5].forEach(c);

Answer 2

我不能說我已經看到了語法，但我的猜測是，因爲日誌需要一個參數，是消息/對象/等登錄控制檯。

在第一個例子

，你只是傳遞一個函數引用的forEach，如果你的函數不期望paramater這使得像預期的那樣，其功能是好的。在第二個例子中，你傳遞e然後記錄它。

Answer 3

這工作：

[1,2,3,4,5].forEach(console.log.bind(console)); 

Answer 4

值得指出的是，存在的console.log實施行爲上的差異。在節點v0.10.19下，您不會收到錯誤;你只看到這一點：

> [1,2,3,4,5].forEach(console.log); 
1 0 [ 1, 2, 3, 4, 5 ] 
2 1 [ 1, 2, 3, 4, 5 ] 
3 2 [ 1, 2, 3, 4, 5 ] 
4 3 [ 1, 2, 3, 4, 5 ] 
5 4 [ 1, 2, 3, 4, 5 ] 

這是因爲回調forEach是三個參數的函數取值，索引和數組本身。功能console.log看到這三個參數並盡職盡責地記錄它們。

在Chrome瀏覽器控制檯，不過，你得到

> [1,2,3,4,5].forEach(console.log); 
TypeError: Illegal invocation 

在這種情況下，bind將工作：

> [1,2,3,4,5].forEach(console.log.bind(console)); 
1 0 [ 1, 2, 3, 4, 5 ] 
2 1 [ 1, 2, 3, 4, 5 ] 
3 2 [ 1, 2, 3, 4, 5 ] 
4 3 [ 1, 2, 3, 4, 5 ] 
5 4 [ 1, 2, 3, 4, 5 ] 

但有另一種方法：注意：第二個參數爲forEach取值this用於回調：

> [1,2,3,4,5].forEach(console.log, console) 
1 0 [ 1, 2, 3, 4, 5 ] 
2 1 [ 1, 2, 3, 4, 5 ] 
3 2 [ 1, 2, 3, 4, 5 ] 
4 3 [ 1, 2, 3, 4, 5 ] 
5 4 [ 1, 2, 3, 4, 5 ] 

其在Chrome的控制檯和節點對我的作品。當然，我敢肯定，你想要什麼僅僅是價值觀，所以恐怕最好的解決辦法是，確實是：

> [1,2,3,4,5].forEach(function (e) {console.log(e)}); 
1 
2 
3 
4 
5 

無論節點的行爲是一個錯誤，或者是根本沒有的優勢事實上console.log不是由ECMA規定的是在自己的權利有趣。但不同的行爲，你必須要知道你的回調是否使用this是重要的，意味着我們必須回落到直接編碼，即使是冗長感謝關鍵字function的事實。