快捷導(dǎo)航

javascript 用函數(shù)語(yǔ)句和表達(dá)式定義函數(shù)的區(qū)別詳解

更新時(shí)間：2014年01月06日 08:47:55 作者：

本篇文章主要介紹了javascript 用函數(shù)語(yǔ)句和表達(dá)式定義函數(shù)的區(qū)別。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助

使用javascript多年，寫過(guò)無(wú)數(shù)函數(shù)，今天卻才真正弄明白兩種函數(shù)定義的區(qū)別，真是悲劇，寫下這個(gè)隨筆，以時(shí)刻提醒自己要打好基礎(chǔ) ，一大把年紀(jì)了，不能繼續(xù)懵懵懂懂了。

通常我們會(huì)看到以下兩種定義函數(shù)的方式：

復(fù)制代碼代碼如下:

// 函數(shù)語(yǔ)句
function fn(str)
{
console.log(str);
};

// 表達(dá)式定義
var fnx=function(str)
{
console.log(str+ ' from fnx');
};

以前都是憑借自己手指的感覺隨心所欲使用兩者 -_- || ，今天看了js基礎(chǔ)，總算是解決了心中對(duì)他們的困惑：

兩種方式都創(chuàng)建了新的函數(shù)對(duì)象，但函數(shù)聲明語(yǔ)句的函數(shù)名是一個(gè)變量名，變量指向函數(shù)對(duì)象，和通過(guò)var聲明變量一樣，函數(shù)定義語(yǔ)句中的函數(shù)被顯示地提前到了腳本或函數(shù)的頂部，因此它們?cè)谡麄€(gè)腳本和函數(shù)內(nèi)都是可見的，但是使用var 表達(dá)式定義函數(shù)，只有變量聲明提前了，變量初始化代碼仍然在原來(lái)的位置，用函數(shù)語(yǔ)句創(chuàng)建的函數(shù)，函數(shù)名稱和函數(shù)體均被提前，所以我們可以在聲明它之前就使用它。

代碼例子如下:

復(fù)制代碼代碼如下:

console.log(typeof(fn)); // function
fn('abc'); // abc

console.log(typeof(fnx)); // undefined

    if(fnx)
        fnx('abc'); // will not execute
    else
        console.log('fnx is undefined'); // fnx is undefined

    // 函數(shù)語(yǔ)句
    function fn(str)
    {
        console.log(str);
    };

    // 表達(dá)式定義
    var fnx=function(str)
    {
        console.log(str+ ' from fnx');
    };

代碼很簡(jiǎn)單，希望和我之前一樣沒有弄明白兩者區(qū)別的同學(xué)能有所收獲。

您可能感興趣的文章:

相關(guān)文章

Bootstrap網(wǎng)頁(yè)布局網(wǎng)格的實(shí)現(xiàn)
柵格就是網(wǎng)格，本文詳細(xì)的介紹了Bootstrap網(wǎng)頁(yè)布局網(wǎng)格的原理和實(shí)現(xiàn)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-07-07
webpack5處理圖片、圖標(biāo)字體、多媒體等靜態(tài)資源文件
在 webpack5 中內(nèi)置了 file-loader、url-loader、raw-loader, 可以直接通過(guò)配置實(shí)現(xiàn)常用功能,下面就來(lái)介紹一下webpack5處理圖片、圖標(biāo)字體、多媒體等靜態(tài)資源文件的實(shí)現(xiàn)方法,感興趣的可以了解一下
2023-12-12
使用PDFJS遇到的坑及解決辦法記錄
PDF.js是由Mozilla支持的基于HTML5的PDF查看器,可以在web上解析和呈現(xiàn)PDF文件,它支持內(nèi)容檢索、頁(yè)面跳轉(zhuǎn)、文件打印等功能,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下
2024-09-09
JavaScript 閉包機(jī)制詳解及實(shí)例代碼
這篇文章主要介紹了JavaScript 閉包機(jī)制詳解及實(shí)例代碼的相關(guān)資料,需要的朋友可以參考下
2016-10-10
JavaScript事件的委托(代理)的用法示例詳解
事件委托，也叫事件代理，是JavaScript中綁定事件的一種常用技巧。就是將原本需要綁定在子元素的響應(yīng)事件委托給父元素或更外層元素，讓外層元素?fù)?dān)當(dāng)事件監(jiān)聽的職務(wù)。本文將詳細(xì)為大家介紹JavaScript事件委托的用法，需要的可以參考一下
2022-01-01
JS實(shí)現(xiàn)select選中option觸發(fā)事件操作示例
這篇文章主要介紹了JS實(shí)現(xiàn)select選中option觸發(fā)事件操作,結(jié)合實(shí)例形式總結(jié)分析了javascript針對(duì)select下拉選中option項(xiàng)觸發(fā)事件相關(guān)操作技巧,需要的朋友可以參考下
2018-07-07
js 生成密匙流腳本代碼
js 生成密匙流腳本代碼...
2007-09-09
JavaScript知識(shí)點(diǎn)整理
本文是腳本之家小編日常整理的關(guān)于javascript知識(shí)點(diǎn)，包括javascript擁有的特點(diǎn)，組成部分，數(shù)據(jù)類型等方面，對(duì)javascript知識(shí)點(diǎn)相關(guān)知識(shí)感興趣的朋友一起學(xué)習(xí)吧
2015-12-12
前端請(qǐng)求全面解析之AJAX、Axios?與?Fetch的使用詳解與代碼示例
這篇文章主要介紹了前端請(qǐng)求全面解析之AJAX、Axios?與?Fetch的使用詳解與代碼示例,AJAX是早期的異步請(qǐng)求技術(shù),FetchAPI是現(xiàn)代的基于Promise的請(qǐng)求方案,Axios是第三方庫(kù),支持自動(dòng)轉(zhuǎn)換JSON、攔截器等功能,文中通過(guò)代碼介紹的非常詳細(xì),需要的朋友可以參考下
2025-04-04
ES6新特性之函數(shù)的擴(kuò)展實(shí)例詳解
這篇文章主要介紹了ES6新特性之函數(shù)的擴(kuò)展,實(shí)例形式較為詳細(xì)的分析了ES6針對(duì)函數(shù)參數(shù)、運(yùn)算符及相關(guān)新特性的擴(kuò)展操作與注意事項(xiàng),需要的朋友可以參考下
2017-04-04