JavaScript 變數範圍及閉包第1/2頁_javascript技巧

執行個體一：

複製代碼 代碼如下:

<script type="text/javascript">
var i = 1;
// 彈出內容為 1 true 的提示框
alert(window.i + ' ' + (window.i == i));
</script>

分析：
在全域定義的變數其實就是 window 對象的屬性。
上面的例子可以看到，我們定義全域變數的同時，window 對象會產生一個相應的屬性，如何讓我們的代碼避免產生這個屬性呢，看下面的例子。
執行個體二：

複製代碼 代碼如下:

<script type="text/javascript">
var document = 1;
window.onload = function(){
alert(document);
}
// 彈出內容為 1 的提示框
alert(window.document);
</script>

這種情況是我們不想看到的，我們可以這麼做：

複製代碼 代碼如下:

<script type="text/javascript">
function test(){
var document = 1;
window.onload = function(){
alert(document);
}
}
test();
// 彈出內容為 [object] 的提示框
alert(window.document);
</script>

為了使代碼更加簡潔，我們可以這樣：

複製代碼 代碼如下:

<script type="text/javascript">
(function(){
var document = 1;
window.onload = function(){
alert(document);
}
})();
// 彈出內容為 [object] 的提示框
alert(window.document);
</script>

分析：
這種運行匿名方法的形式，在 JavaScript 的主流架構中經常見到，這樣做可以避免產生不必要的 window 對象的屬性，減少衝突的可能。
執行個體三：

複製代碼 代碼如下:

<script type="text/javascript">
(function(){
if('1' == '1'){
var i = 1;
}
// 彈出內容為 1 的提示框
alert(i);
})();
</script>

分析：
變數的範圍是整個函數，不是{}塊。
執行個體四：

複製代碼 代碼如下:

<script type="text/javascript">
var i = 1;
// 彈出內容為 1 的提示框
alert(i);
var i = 2;
// 彈出內容為 2 的提示框
alert(i);
</script>

分析：
一個變數可以被重新定義，這個看起來有些怪，因為在很多其他語言裡這樣是行不通的。
執行個體五：

複製代碼 代碼如下:

<script type="text/javascript">
function test(){
i = 1;
}
test();
// 彈出內容為 1 的提示框
alert(window.i);
</script>

分析：
如果對一個沒有初始化的變數進行賦值操作，那麼這個變數會作為全域變數。

當前1/2頁  12下一頁閱讀全文