[JS奇怪的世界]No.3 全域環境與全域物件

全域環境與全域物件

「全域環境」的觀念與「執行環境」也有一定的關係,一般來講當程式一開始執行時,都是在「全域環境」下,而這環境也是別人所寫好的一個程式,一個 「Global」 而這個環境包裝著我們所準備執行的程式與正在執行的程式,一般來講我們還沒撰寫程式之前都會有一個叫做預設執行環境(基礎執行環境)的東西。

首先先開啟瀏覽器,並開啟開發者工具(通常 F12 就可以打開)然後試著在 console (控制台)頁面輸入 window,此時你應該會看到這個樣子。

window

圖片上這些東西就是所謂的預設執行環境,也就是所謂的「全域環境」也可以稱為「全域執行環境」。

也因為它被稱為「全域」執行環境,所以它代表著我們可以在任何一個地方取用它並使用它。

那「全域執行環境」做了什麼?「全域執行環境」做了兩件事情 ↓

  • 全域物件 (注意前面已經說過,物件只是名稱與值的配對)
  • 非常特殊的變數 this

JavaScript 在預設執行環境下替我們建立了這兩個神奇的東西,所以我們在前面 F12 輸入 window 才可以看到很多東西。

window 就是一個物件,不相信?我在重打一次不展開內容給你看。

window

這樣可以知道 window 就是一個物件,這是一個非常重要的基礎觀念。

那如果我打 this 呢?

this

可以發現 this 就是目前的「全域執行環境」 (window)

所以 「全域執行環境」 與 「名稱/值」 組合是有關係的,由上面這些範例我們可以知道 this = windowthis 參照到 window

這一堂課也再一次強調不要把 JavaScript 想的太複雜,只要我們所撰寫的程式碼或變數不在函數 (function) 時,就是在「全域執行環境」。

那我們來驗證一下觀念吧!如果我們試著寫一些東西來看看會發生什麼事情 ↓

1
2
3
4
5
var a = 'Hello World!';

function say(){
var b = 'Tom';
}

輸入完之後我們來看看 a 被建立在哪裡。

變數 a

我們可以發現 var a,被建立在 window下,那 say() 呢?

函數 say

我們都可以看到變數 asay() 被建立在「全域執行環境」下,但是如果你認真看你會發現 say() 裡面的 b 不見了,那因為我們的 var b = 'Tom'; 還沒被「編譯器」給執行,所以裡面就會是空的,因為函數 say() 的執行環境還沒被建立起來。

圖源

JavaScript 全攻略:克服 JS 奇怪的部分

0%