iT邦幫忙

2021 iThome 鐵人賽

DAY 7
0
自我挑戰組

開始入坑網頁吧!系列 第 7

JavaScript 偽裝命名空間(Facking NameSpace)

  • 分享至 

  • xImage
  •  

命名空間(NameSpace)

A container for variables and functions, typically to keep variables and functions with the same name separate.
就是一個裝著變數與函數的容器,用來使相同名稱的變數或函數不會互相干擾(避免命名衝突)。

但是JavaScript沒有命名空間,但是我們可以利用物件來解決這個問題
EX:下面是在全域空間的兩個同名變數

var name = 'Ivy';
var name = 'Joanna';

console.log(name); //Joanna

都是全域物件,下面的會覆寫上面的。

而在JavaScript用物件可以幫助我們使兩變數不衝突,也就是我們用物件當容器。
EX:這裡建立兩個物件

var p1 = {};
var p2 = {};

p1.name = 'Ivy';
p2.name = 'Joanna';

console.log(p1.name); //Ivy 

p1 與 p2 這兩個變數變成容器,而不會使裏面的變數因為同樣名稱而衝突。

當然我們也可以用物件實體語法來建立p1 p2 (可以看上一篇)

var p1 = {name:'Ivy'};
var p2 = {name:'Joanna'};

console.log(p1.name); //Ivy 

檢查命名衝突

我們可能使用別人寫的程式檔案或是忘了自己之前寫好的的程式而導致命名衝突,
例如:
var aa=aa || {name:'Joanna'};
不知道aa 的變數名有沒有用過,所以檢查,如果已經用過,就給前面用過的的aa,如果還沒,就是{name:'Joanna'}。

例如這是 Todo.html


<script type="text/javascript"src="Todo.js"></script>
<script type="text/javascript">
    var aa=aa||{name:'uu'}
	console.log(aa.name)
</script>
</body>
</html>

這是Todo.js

var aa={name:'ii'}

如此console出來是 ii, 沒有被覆蓋。

參考:
yehyeh's Notepad
js-tutorials Namespaces in JavaScript


上一篇
物件的建構與物件實體語法
下一篇
很像JavaScript 的 JSON
系列文
開始入坑網頁吧!30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言