window.console.log和console.log之間有什么區別

Question

剛接受采訪。 第一個問題問我是什么是console.log() 。 我非常自信地回答。 再次，

第二個問題是， window.console.log()和console.log()之間有什么區別。 我無言以對。 嘗試在Google和Stack Overflow中搜索。 我沒有找到這樣有用的帖子來理解它們之間的區別。

任何想法都非常感謝。

Answer 1

在普通的瀏覽器環境中，沒有區別。 console是一個全局變量，所有全局變量都是window對象的屬性。

 console.log(console.log==window.console.log) // true 

有一些注意事項，例如未在瀏覽器中運行，或者是否已重新分配控制台變量。 TJ Crowder很好地解釋了這一點。

Answer 2

如果您的意思是在默認的瀏覽器JavaScript環境中，實際上沒有提供 window和console沒有被遮蔽或重新分配。

在默認瀏覽器JavaScript環境中， window是一個全局對象，它引用全局對象，也是窗口對象。 全局對象將大多數全局變量保存為屬性（它曾經是全部，但在ES2015中已更改;由let ， const或class創建的全局變量不是全局對象的屬性）。 但是在大多數非瀏覽器環境中都不是這樣（例如，NodeJS使用global而不是window ），甚至在某些非默認瀏覽器環境中（例如Web工作者的環境，它沒有window因為它們可以'訪問窗口）。 因此，在未定義window環境中， window.console.log將失敗，而console.log不會（如果環境提供全局console ）。

為了理解這些差異，讓我們通過以下方式工作：

console.log(...)表示：

1. JavaScript引擎必須從當前執行上下文開始搜索標識符console的綁定，然后搜索下一個綁定，然后搜索下一個，直到它在全局范圍內找到它。
2. 然后它在結果對象上查找log屬性。
3. 然后它調用它

window.console.log(...)表示：

1. JavaScript引擎必須從當前執行上下文開始搜索標識符window的綁定，然后搜索下一個綁定，然后搜索下一個綁定，直到它在全局范圍內找到它。
2. 然后它在結果對象上查找console屬性。
3. 然后它在結果對象上查找log屬性。
4. 然后它調用它

例如，這是一個console被遮蔽的示例，因此console.log失敗而window.console.log工作：

 function foo() { var console = 42; try { console.log("You WON'T see this."); } catch (e) { } try { window.console.log("You WILL see this."); } catch (e) { } } foo(); 

Answer 3

console.log和window.console.log之間沒有區別。 檢查MDN 。 他們明確引用 -

可以通過屬性控制台從任何全局對象，瀏覽范圍上的Window，WorkerGlobalScope及其在工作程序中的特定變體訪問Console對象。 它作為Window.console公開，可以簡單地作為console引用。

---

除此之外，問題可能還有 -

console.log和window.console之間有什么區別。

對此的答案是 -

console.log用於記錄（如您所知）。

window.console檢查控制台是否可用（ truthy值），以便我們可以記錄下一步。（在移動瀏覽器的情況下，它們不支持調試器/控制台）

代碼中的常見模式是 -

window.console && console.log(open_date);

這基本上是短代碼 -

if( window.console ) {
    console.log( open_date );
}