 |
| 圖片來源：JavaScript 101 |
在前兩篇文章中我們說明了在JavaScript中如何建立物件（[筆記] JavaScript中的物件建立(Object) - Part 1、[筆記] JavaScript中的物件建立(Object) - Part 2），在這篇文章中，我們則是會簡單說明如何運用物件。
我們先來看這段程式碼，複習一下：
想想看，如果我執行這段程式的話，呼叫出來的結果會是「你好」還是「Hello」？為什麼呢？
答案是Hello。
為什麼呢？因為JavaScript在解析程式的時候，會先建立好定義的變項名稱（即，greet），並把它存在記憶體中，這時候greet的變項已經被建立，而值則是"undefined"，接著JavaScript才會去逐行執行程式，greet的值就從undefined-->你好-->Hello，有了如下的變化，因此最後呼叫出來的結果會是Hello（參考：[筆記] 談談Javascript 中的 Hoisting）。
使用物件來達到namespace的效果
Namespace簡單來說是指一個包含了許多變項和函式的空間。
如同上述的例子，因為這兩個變項一樣都叫做greet，可是一個是中文，一個是英文，因為變項名稱一樣的關係，它並沒有辦法區分哪個給中文用的，哪個是給英文用的。在其它的程式語言中，有些可以透過namespace（名稱空間）來達到這樣的效果，可是在JavaScript中，並沒有Namespace這樣的功能，然而，我們可以透過物件的概念來達到類似namespace的效果（faking namespace）。
實際的做法上，我們可以寫出如下的程式碼：
我們把分別建立Chinese和English這兩個物件，然後在裡面我們可以套用一樣的變項名稱greet，在呼叫的時候，只需要選擇你是針對哪一個物件裡面的greet去做呼叫就可以了！
這樣做有一個很重要的好處，就是當我們很多人在編輯一份文件時，假設A同事建立了一個函式名稱叫SayHI，很不幸的，B同事也建立了一個名稱相同的函式或變項，這時候就麻煩了，因為後面的會把前面的給覆蓋掉，這時候如果我們能妥善利用JavaScript中物件來做為namespace的使用，就可以避免變項名稱重覆所造成的問題。
其他應用物件時可能碰到的問題
這裡我們可能突然想到Hello只是英文裡面打招呼的一種方式，所以我們想要把greet放在greetings裡面，像是這樣子：
這樣做是很直覺的方式，但是結果會發生錯誤：
上面的訊息顯示"Cannot set property 'greet' of undefined"，意思是說，我們想要設置一個屬性是greet，可是這個屬性要設置的地方目前還是"undefined"。
之所以會這樣，是因為我們還沒告訴JavaScript，english當中greetings這個屬性的值是什麼，所以greetings建立後，預設的值是undefined，也就是像這樣：
這也就是為什麼我們沒辦法建立"greet"這個屬性(property)，因為english.greetings並不是一個物件！
為了要能夠順利執行程式，我們要先宣告english.greetings是一個物件，這樣它才可以建立「名稱─值」配對在裡面，也就是我們才能再進一步給它屬性。
這時候程式就能順利執行。
或者我們也可以利用object literal syntax的方式，像是這樣：
這樣子的話，程式一樣可以順利執行。
→回到此系列文章目錄
0 意見:
張貼留言