我的JS筆記 -- 函數(shù)


函數(shù)是由事件驅(qū)動(dòng)的或者當(dāng)它被調(diào)用時(shí)執(zhí)行的可重復(fù)使用的代碼塊,在JS中定義函數(shù)的方式有兩種:函數(shù)聲明和函數(shù)表達(dá)式。

區(qū)分函數(shù)聲明和表達(dá)式最簡(jiǎn)單的方法是看function關(guān)鍵字出現(xiàn)在聲明中的位置(不僅僅是一行代碼, 而是整個(gè)聲明中的位置)。如果function是聲明中的第一個(gè)詞,那么就是一個(gè)函數(shù)聲明,否則就是一個(gè)函數(shù)表達(dá)式。

// 函數(shù)聲明
function f1() {
    //
}

// 函數(shù)表達(dá)式
var f2 = function () {
    //
}

// 函數(shù)表達(dá)式
(function () {
    //
})()

函數(shù)聲明會(huì)提升,但函數(shù)表達(dá)式不會(huì)。聲明提升在執(zhí)行上下文。

function f() {
    console.log(1);
}
f(); // 1
var f = function () {
    console.log(2);
}
f(); // 2

因?yàn)楹瘮?shù)聲明會(huì)提升,所以不能非函數(shù)的代碼塊中聲明函數(shù),比如if。

// 下面代碼的原始意圖是不聲明函數(shù)f,但是由于f的提升,導(dǎo)致if語(yǔ)句無(wú)效,所以上面的代碼不會(huì)報(bào)錯(cuò)
if (false) {
    // 這樣聲明因?yàn)閕f不是塊級(jí)作用域,那么函數(shù)會(huì)提升,不論if如何判斷f()都會(huì)生效
    function f1() {
        console.log(1);
    } 
}
f1(); // 1
    

// 要達(dá)到在條件語(yǔ)句中定義函數(shù)的目的,只有使用函數(shù)表達(dá)式
if (false) {
    var f2 = function () {
        console.log(2);
    }
}
f2(); // TypeError: f2 is not a function

但我在測(cè)試時(shí)發(fā)現(xiàn)新版火狐、Chrome、IE11都不會(huì)在if中提升函數(shù)聲明,但I(xiàn)E11以下版本會(huì),所以為避免出錯(cuò),盡量在if等非函數(shù)代碼塊中使用函數(shù)表達(dá)式。

函數(shù)傳遞參數(shù)

JS中所有函數(shù)的參數(shù)都是按值傳遞的。

var a = 1;
function f1(arg) {
    arg = 2;
    console.log(arg); //2,參數(shù)如果是基本類(lèi)型是按值傳遞,傳遞的是參數(shù)的副本,操作不影響原變量
}
f1(a);
console.log(a); // 1

var obj = {
    a: 1
};
function f2(arg) {
    arg.value = 2;
    console.log(arg.value); //2,傳遞對(duì)象的時(shí)候,傳遞對(duì)象的引用的副本,改變參數(shù)會(huì)改變?cè)瓍?shù)
}
f2(obj);
console.log(obj.a) // 2
    
var obj2 = {
    value: 1
};
function f3(arg) {
    arg = { // 函數(shù)內(nèi)部重寫(xiě)參數(shù),這下變量引用的就是一個(gè)局部變量
        a: 2
    };
    console.log(arg.a); //2,傳遞引用參數(shù)副本,但是又重新給參數(shù)賦值,切斷原來(lái)的引用,所以原有引用為改變
}
f3(obj2);
console.log(obj2.a) // 1

函數(shù)屬性

函數(shù)屬性包括:length和prototype

length,函數(shù)的length屬性是只讀屬性,函數(shù)定義時(shí)的形參個(gè)數(shù)即通常也是函數(shù)調(diào)用時(shí)期望傳入函數(shù)的參數(shù)個(gè)數(shù)。

function add(a, b) {
    return a + b;
}
add.length // 2,函數(shù)聲明時(shí)形參長(zhǎng)度

prototype,每個(gè)函數(shù)都包含一個(gè)prototype屬性,這個(gè)屬性是指向一個(gè)對(duì)象的引用,這個(gè)對(duì)象稱(chēng)為“原型對(duì)象”。每個(gè)函數(shù)都包含不同的原型對(duì)象。當(dāng)函數(shù)用做構(gòu)造函數(shù)時(shí),新創(chuàng)建的對(duì)象會(huì)從原型對(duì)象上繼承屬性。

函數(shù)內(nèi)部屬性:arguments和this

arguments,arguments是一個(gè)類(lèi)數(shù)組對(duì)象,包含傳入函數(shù)的所有參數(shù),arguments的主要用途是保存函數(shù)參數(shù)。

function add(a, b) {
    return arguments[0] + arguments[1];
}
add(1, 2); // 3

this,this引用的是函數(shù)據(jù)以執(zhí)行的環(huán)境對(duì)象,關(guān)于this請(qǐng)點(diǎn)這里this

var a = {
    name: 'a',
    sayName: function () {
        console.log(this.name);
    }
};
a.sayName(); // 'a'

函數(shù)方法

每個(gè)函數(shù)都包含兩個(gè)非繼承而來(lái)的方法:apply()和call()。這兩個(gè)方法的用途都是在特定的域中調(diào)用函數(shù),其真正強(qiáng)大之處在于能夠擴(kuò)充函數(shù)賴(lài)以運(yùn)行的作用域,ES5又新增bind()方法。

關(guān)于apply、call和bind請(qǐng)點(diǎn)這里this

因?yàn)楹瘮?shù)也是對(duì)象,所以函數(shù)也有toString()方法,返回函數(shù)的字符串形式。

匿名函數(shù)

函數(shù)聲明必須要有標(biāo)識(shí)符名稱(chēng),但函數(shù)表達(dá)式可以不寫(xiě)標(biāo)識(shí)符,這樣的函數(shù)稱(chēng)為匿名函數(shù)。

// 匿名函數(shù)賦值給變量
var f = function () {
    //
}

// 匿名函數(shù)自執(zhí)行,自執(zhí)行后內(nèi)部聲明的局部變量和函數(shù)會(huì)被銷(xiāo)毀
(function () {
    //
})()    

// 匿名函數(shù)不會(huì)自執(zhí)行,會(huì)報(bào)錯(cuò),這是因?yàn)檫@是一個(gè)函數(shù)聲明,函數(shù)聲明后邊不能跟圓括號(hào),函數(shù)表達(dá)式后邊可以跟圓括號(hào)
function () {
    // 
}()

更多文章在 這里 ,覺(jué)得不錯(cuò)希望點(diǎn)個(gè) star

最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

  • 在js中,函數(shù)本身屬于對(duì)象的一種,因此可以定義、賦值,作為對(duì)象的屬性或者成為其他函數(shù)的參數(shù)。函數(shù)名只是函數(shù)這個(gè)對(duì)象...
    bjhu電net閱讀 608評(píng)論 0 5
  • 第5章 引用類(lèi)型(返回首頁(yè)) 本章內(nèi)容 使用對(duì)象 創(chuàng)建并操作數(shù)組 理解基本的JavaScript類(lèi)型 使用基本類(lèi)型...
    大學(xué)一百閱讀 3,667評(píng)論 0 4
  • JavaScript 函數(shù)定義 JavaScript 使用關(guān)鍵字 function 定義函數(shù)。函數(shù)可以通過(guò)聲明定義...
    鹿守心畔光閱讀 528評(píng)論 0 1
  • 函數(shù)聲明和函數(shù)表達(dá)式有什么區(qū)別 (*)解析器會(huì)率先讀取函數(shù)聲明,并使其在執(zhí)行任何代碼之前可以訪問(wèn);函數(shù)表達(dá)式則必須...
    coolheadedY閱讀 445評(píng)論 0 1
  • 謝自己邀。 即將大學(xué)畢業(yè),我想好好回答一下這個(gè)問(wèn)題,作為一個(gè)很多人眼中的“學(xué)霸”,如果說(shuō)我能在什么方面比較有發(fā)言權(quán)...
    盧小健閱讀 281評(píng)論 0 0

友情鏈接更多精彩內(nèi)容