JavaScript中變量提升與函數提升經典實例分析
本文實例講述了JavaScript中變量提升與函數提升。分享給大家供大家參考,具體如下:
從兩個實例說起:
eg1:
var i; console.log(i); // 2
eg2:
console.log(i); // undefined var i = 2;
1、提升
變量和函數聲明從它們在代碼中出現的位置被提升到了最上面。
注意:
只有聲明本身會被提升,而賦值操作不會被提升。
變量會提升到其所在函數的最上面,而不是整個程序的最上面。
函數聲明會被提升,但函數表達式不會被提升:
func1(); // Uncaught TypeError: func1 is not a function
func2(); // Uncaught ReferenceError: func2 is not defined
var func1 = function func2() { ... };
JavaScript中的ReferenceError和TypeError:
① ReferenceError:引用錯誤。JavaScript引擎查詢變量時,若在作用域里沒有找到該變量,JavaScript引擎就會拋出一個ReferenceError。
② TypeError:類型錯誤。當在作用域中找到了某變量引用,然后讓該變量去做力所不能及的事情時,如引用它一個不存在的屬性,或將非函數的變量用作函數引用,JavaScript引擎就會拋出一個TypeError。
2、函數優(yōu)先
函數聲明和變量聲明都會被提升,但是需要注意的是函數會先被提升,然后才是變量。
func(); // 1
var func;
function func() {
console.log(1);
}
func = function() {
console.log(2);
}
運行結果:輸出1而不是2
理由:var func;盡管出現在function func()之前,但它是重復的聲明,會被忽略,因為函數聲明會被提升到普通變量之前。上述代碼等價于:
function func() {
console.log(1);
}
func(); // 1
func = function() {
console.log(2);
}
盡管重復的聲明會被忽略掉,但出現在后面的函數聲明還是可以覆蓋前面的:
func(); // 3
function func() {
console.log(1);
}
func = function() {
console.log(2);
}
function func() {
console.log(3);
}
一個普通塊內部的函數聲明通常會被提升到其所在作用域的頂部,提升過程不會被條件判斷所控制:
func(); // 2
var flag = true;
if (flag)
function func() { console.log(1); }
else
function func() { console.log(2); }
注意:盡量避免在塊內聲明函數,在JavaScript未來的版本中上述行為可能會發(fā)生改變。
更多關于JavaScript相關內容可查看本站專題:《JavaScript常用函數技巧匯總》、《javascript面向對象入門教程》、《JavaScript錯誤與調試技巧總結》、《JavaScript數據結構與算法技巧總結》及《JavaScript數學運算用法總結》
希望本文所述對大家JavaScript程序設計有所幫助。
相關文章
JavaScript中字符串(string)轉json的2種方法
這篇文章主要介紹了JavaScript中字符串(string)轉json的2種方法,兩種方法分別是使用js函數eval()和、使用jquery.parseJSON()方法,需要的朋友可以參考下2015-06-06
javascript中apply和call方法的作用及區(qū)別說明
本篇文章主要是對javascript中apply和call方法的作用及區(qū)別進行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-02-02
javascript類型系統(tǒng) Array對象學習筆記
這篇文章主要介紹了javascript類型系統(tǒng)之Array對象,整理關于Array對象的學習筆記,感興趣的小伙伴們可以參考一下2016-01-01
js利用prototype調用Array的slice方法示例
這篇文章主要介紹了如何利用js的prototype調用Array的slice方法,需要的朋友可以參考下2014-06-06

