Latest web development tutorials
×

JavaScript 教程

JavaScript 教程 JavaScript 簡介 JavaScript 用法 JavaScript 輸出 JavaScript 語法 JavaScript 語句 JavaScript 註釋 JavaScript 變量 JavaScript 數據類型 JavaScript 對象 JavaScript 函數 JavaScript 作用域 JavaScript 事件 JavaScript 字符串 JavaScript 運算符 JavaScript 比較 JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript 類型轉換 JavaScript 正則表達式 JavaScript 錯誤 JavaScript 調試 JavaScript 變量提升 JavaScript 嚴格模式 JavaScript 使用誤區 JavaScript 表單驗證 JavaScript 保留關鍵字 JavaScript JSON JavaScript void JavaScript 代碼規範

JS 函數

JavaScript 函數定義 JavaScript 函數參數 JavaScript 函數調用 JavaScript 閉包

JS HTML DOM

DOM 簡介 DOM HTML DOM CSS DOM 事件 DOM EventListener DOM 元素

JS 高級教程

JavaScript 對象 JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp 對象

JS 瀏覽器 BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript 彈窗 JavaScript 計時事件 JavaScript Cookies

JS 庫

JavaScript 庫 JavaScript 測試 jQuery JavaScript 測試 Prototype

JS 實例

JavaScript 實例 JavaScript 對象實例 JavaScript 瀏覽器對象實例 JavaScript HTML DOM 實例 JavaScript 總結

JS 參考手冊

JavaScript 對象 HTML DOM 對象

JavaScript 變量提升

JavaScript 中,函數及變量的聲明都將被提升到函數的最頂部。

JavaScript 中,變量可以在使用後聲明,也就是變量可以先使用再聲明。

以下兩個實例將獲得相同的結果:

實例1

x = 5 ; //變量x設置為5

elem = document.getElementById( "demo" ); //查找元素
elem.innerHTML = x; //在元素中顯示x

var x; //聲明x

嘗試一下»

實例2

var x; //聲明x
x = 5 ; //變量x設置為5

elem = document.getElementById( "demo" ); //查找元素
elem.innerHTML = x; //在元素中顯示x

嘗試一下»

要理解以上實例就需要理解"hoisting(變量提升)"。

變量提升:函數聲明和變量聲明總是會被解釋器悄悄地被"提升"到方法體的最頂部。


JavaScript 初始化不會提升

JavaScript 只有聲明的變量會提升,初始化的不會。

以下兩個實例結果結果不相同:

實例1

var x = 5 ; //初始化x
var y = 7 ; //初始化y

elem = document.getElementById( "demo" ); //查找元素
elem.innerHTML = x + " " + y; //顯示x和y

嘗試一下»

實例2

var x = 5 ; //初始化x

elem = document.getElementById( "demo" ); //查找元素
elem.innerHTML = x + " " + y; //顯示x和y

var y = 7 ; //初始化y

嘗試一下»

實例2的y輸出了undefined ,這是因為變量聲明(var y)提升了,但是初始化(y = 7)並不會提升,所以y變量是一個未定義的變量。

實例2 類似以下代碼:

var x = 5; // 初始化 x
var y;     // 声明 y

elem = document.getElementById("demo"); // 查找元素
elem.innerHTML = x + " " + y;           // 显示 x 和 y

y = 7;    // 设置 y 为 7

在頭部聲明你的變量

對於大多數程序員來說並不知道JavaScript 變量提升。

如果程序員不能很好的理解變量提升,他們寫的程序就容易出現一些問題。

為了避免這些問題,通常我們在每個作用域開始前聲明這些變量,這也是正常的JavaScript 解析步驟,易於我們理解。

Note JavaScript 嚴格模式(strict mode)不允許使用未聲明的變量。
在下一個章節中我們將會學習到"嚴格模式(strict mode)"