JS中函數(shù)的重要性

這次給大家?guī)鞪S中函數(shù)的重要性，使用JS中函數(shù)的注意事項有哪些，下面就是實戰(zhàn)案例，一起來看一下。

既然是對象，那么它就可以：

1. 通過字面量創(chuàng)建

2. 賦值給變量，數(shù)組元素和其他對象的屬性（property）

3. 作為參數(shù)傳遞給函數(shù)

4. 作為函數(shù)的返回值

5. 含有能被動態(tài)創(chuàng)建和賦值的屬性

除了上述對象的功能，函數(shù)區(qū)別其它對象之處是能被調(diào)用。

在JS中，存在變量提升。當(dāng)一個變量通過var聲明之后，會立即被提升至當(dāng)前作用域頂部（let 和 const 聲明的變量則不會）。例如：

1 function a() {2 console.log(b);3 var b = 10;4 }5 a(); //undefined

上面這段代碼的運行結(jié)果為undefined。原因是，當(dāng)b變量通過var聲明后，發(fā)生了變量提升，立即被提升至當(dāng)前作用域頂部（注意，提升是在聲明之后立即發(fā)生，此時b還未被定義！），此時的“當(dāng)前作用域”就是函數(shù)a的作用域。因此，上面的代碼其實是這樣的：

1 function a() {2 var b; //變量的聲明被提升至當(dāng)前作用域頂部3 console.log(b);4 b = 10;5 }6 a();

變量b的聲明被提升至第二行（提升的只是聲明），且此時b沒有被賦值，因此代碼繼續(xù)執(zhí)行至第三行console.log(b)時，就輸出了undefined。

而JS除了變量提升外，還存在“函數(shù)提升”。同理，函數(shù)也會被提升，只不過，函數(shù)不僅僅是聲明的提升，而是“整體提升”。請看下面的代碼：

1 function a() {2 b();3 function b() {4 console.log("yes!");5 }6 }7 a(); //yes!

此時可以正常執(zhí)行函數(shù)b。這正是因為函數(shù)被提升，而且是“整體提升”，所以b()才能正常執(zhí)行。這段代碼其實等價于：

1 function a() {2 function b() {3 console.log("yes!");4 }5 b();6 }7 a(); //yes!

需要注意的是，只有普通形式聲明的函數(shù)才能被提升！例如：

1 function a() {2 b();3 var b = function() { //字面量聲明的函數(shù)4 console.log("yes!");5 }6 }7 a(); //報錯

這里的匿名函數(shù)是通過字面量聲明的，所以不存在函數(shù)提升，結(jié)果就會報錯。

但是，當(dāng)變量和函數(shù)同時被聲明時，誰提升得更優(yōu)先呢？

在JS中，函數(shù)之所以被稱為“一等公民”，其中一個原因就是它比變量更有優(yōu)先級，在發(fā)生提升時，函數(shù)會提升至作用域的最頂部！例如：

1 function a() {2 var b = 10;3 function b () {4 console.log("yes！");5 }6 console.log(b);7 console.log(typeof b);8 }9 a(); //10 number

在這段代碼中，變量b的聲明被提升，但作為“一等公民”的函數(shù)卻被提升到變量b的聲明之上。在執(zhí)行代碼階段，10賦值給b，因此輸出結(jié)果，b是10，類型變成了number。

相信看了本文案例你已經(jīng)掌握了方法，更多精彩請關(guān)注Gxl網(wǎng)其它相關(guān)文章！

推薦閱讀：

微信小程序怎么實現(xiàn)數(shù)據(jù)雙向綁定

JavaScript之優(yōu)化DOMWebpack模塊的使用

聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com