快捷導(dǎo)航

javascript 兩種聲明函數(shù)的方式的分析

更新時(shí)間：2017年02月08日 10:06:24 投稿：lqh

這篇文章主要介紹了javascript 兩種聲明函數(shù)的方式的分析的相關(guān)資料,需要的朋友可以參考下

javascript 聲明函數(shù)

JavaScript有兩種聲明函數(shù)的方式，一個(gè)是函數(shù)表達(dá)式定義函數(shù)，也就是我們說的匿名函數(shù)方式，一個(gè)是函數(shù)語句定義函數(shù)，下面看代碼：

/*方式一*/
var FUNCTION_NAME = function() { /* FUNCTION_BODY */};
/*方式二*/
function FUNCTION_NAME () { /* FUNCTION_BODY */};

區(qū)別一

方式一的聲明方式是先聲明后使用

方式二的聲明方式可以先調(diào)用，后聲明

/*方式一:
 *先聲明后使用
 */

//f1();這里調(diào)用就會出錯(cuò) 
var f1 = function () {
     alert("var方式");
}
f1();//這里使用才正確

/*方式二:
 *可以先使用后聲明
 */

f2(); //這里調(diào)用可以正常執(zhí)行 
function f2 () {
     alert("function方式");
}
f2();//這里調(diào)用可以正常執(zhí)行

區(qū)別二

//方式一
var FUNCTION_NAME = function() { /* FUNCTION_BODY */};
/*
這種方式,編譯后變量聲明 FUNCTION_NAME 會“被提前”了，但是他的賦值（也就是FUNCTION_BODY）并不會被提前。匿名函數(shù)只有在被調(diào)用時(shí)才被初始化。
*/
//方式二
function FUNCTION_NAME () { /* FUNCTION_BODY */}; 
/*
這種方式， 編譯后 函數(shù)聲明 和 賦值 都會被提前。
即函數(shù)聲明過程在整個(gè)程序執(zhí)行之前的預(yù)處理就完成了，所以只要處于同一個(gè)作用域，就可以訪問到，即使在定義之前調(diào)用它也可以。
*/

下面看一個(gè)例子：

function f() {
 alert('1');
}

f(); // 彈窗內(nèi)容是：2

function f() {
 alert ('2');
}

運(yùn)行時(shí) f() 執(zhí)行的是alert (‘2');主要原因是JavaScript 函數(shù)聲明的“提前”行為，簡而言之，就是Javascript允許我們在變量和函數(shù)被聲明之前使用它們，而第二個(gè)定義覆蓋了第一種定義。換句話說，上述代碼編譯之后相當(dāng)于：

function f() {
 alert('1');
}

function f() {
 alert ('2');//申明前置了，但因?yàn)檫@里的申明和賦值在一起，所以一起前置
}

f(); // 彈窗內(nèi)容是：2

下面再看一個(gè)例子：

var f= function() {
 alert('1');
}

f(); // 彈窗內(nèi)容是：1

function f() {
 alert ('2');
}

這里就是我們期待的behavior，這段程序編譯之后相當(dāng)于：

var f; //申明前置了
function f() {
 alert('1');
}

f(); // 彈窗內(nèi)容是：1

function f() {
 alert ('2');
}

最后再看一個(gè)例子：

f(); //第一次調(diào)用函數(shù) 彈窗內(nèi)容是：2

var f= function() {
 alert('1');
}

f(); //第二次調(diào)用函數(shù) 彈窗內(nèi)容是：1

function f() {
 alert ('2');
}
f(); //第三次調(diào)用函數(shù) 彈窗內(nèi)容是：1

看到結(jié)果大家應(yīng)該都明白了吧。

感謝閱讀，希望能幫助到大家，謝謝大家對本站的支持！

您可能感興趣的文章: