js知識(shí)梳理5：關(guān)于函數(shù)的要點(diǎn)梳理(1)

付倫發(fā)布于2019-08-26 12:16 / 1932人閱讀

摘要：構(gòu)造函數(shù)調(diào)用會(huì)使用新創(chuàng)建的對(duì)象作為調(diào)用上下文。函數(shù)的參數(shù)相關(guān)可選形參當(dāng)傳入的實(shí)參比函數(shù)聲明時(shí)指定的形參數(shù)量要少，剩下的形參都將設(shè)置為值實(shí)參多則會(huì)自動(dòng)省略。它們的第一個(gè)實(shí)參是要調(diào)用函數(shù)的母對(duì)象，它是調(diào)用上下文，函數(shù)體內(nèi)通過(guò)引用它。

寫在前面

注：這個(gè)系列是本人對(duì)js知識(shí)的一些梳理，其中不少內(nèi)容來(lái)自書籍:Javascript高級(jí)程序設(shè)計(jì)第三版和JavaScript權(quán)威指南第六版，感謝它們的作者和譯者。有發(fā)現(xiàn)什么問(wèn)題的，歡迎留言指出。

1.函數(shù)聲明和函數(shù)表達(dá)式

函數(shù)聲明具有聲明提前/聲明提升的特性，這一點(diǎn)和變量的聲明特性相似，執(zhí)行代碼之前會(huì)先讀取函數(shù)聲明和變量聲明，意味著可以把函數(shù)聲明放在調(diào)用它的語(yǔ)句后面，但變量聲明肯定最好不要這樣，因?yàn)槌０殡Sundefined問(wèn)題。

函數(shù)聲明的函數(shù)名稱和函數(shù)體都提前，而函數(shù)表達(dá)式只是變量聲明提前（而變量的初始化代碼仍然在原來(lái)的位置）。

2.函數(shù)調(diào)用

構(gòu)成函數(shù)主體的代碼定義時(shí)并不會(huì)執(zhí)行，調(diào)用函數(shù)時(shí)才會(huì)執(zhí)行，有4中方式調(diào)用函數(shù)：

作為函數(shù)

作為方法

作為構(gòu)造函數(shù)

通過(guò)call()和apply()方法間接調(diào)用

①作為函數(shù)調(diào)用的注意點(diǎn)，嚴(yán)格模式下調(diào)用上下文是undefined，所以通常不使用this關(guān)鍵字，②作為方法調(diào)用的話調(diào)用上下文就是方法所在的對(duì)象，this關(guān)鍵字引用著該對(duì)象。③而嵌套函數(shù)不會(huì)從調(diào)用它的函數(shù)中繼承this，如果想訪問(wèn)外部的this，可以用變量保存this的值。④構(gòu)造函數(shù)調(diào)用會(huì)使用新創(chuàng)建的對(duì)象作為調(diào)用上下文。

3.函數(shù)的參數(shù)相關(guān)

可選形參

當(dāng)傳入的實(shí)參比函數(shù)聲明時(shí)指定的形參數(shù)量要少，剩下的形參都將設(shè)置為undefined值（實(shí)參多則會(huì)自動(dòng)省略）。所以在合適的場(chǎng)景就可以選擇使用可選形參：

function getPropertyNames(o, /* optional */ a) {
    if(a=== undefined) a=[];
    for(var prop in o) a.push(prop);
    return a;
}
var arr = [1,2];
//[1, 2, "x", "y"]
console.log(getPropertyNames({x:1,y:2},arr));
//["x", "y"]
console.log(getPropertyNames({x:1,y:2}));

注意點(diǎn)：需要將可選形參放在形參列表的最后，并在函數(shù)定義是使用注釋強(qiáng)調(diào)形參是可選的。

實(shí)參對(duì)象arguments

在函數(shù)體內(nèi)，標(biāo)識(shí)符arguments是指向?qū)崊?duì)象的引用，它是一個(gè)類數(shù)組對(duì)象，可以通過(guò)數(shù)字下標(biāo)訪問(wèn)傳入的實(shí)參值，這樣函數(shù)就可以操作任意數(shù)量的實(shí)參：

function getMaxValue(/* ... */) {
    var max = arguments[0];
    for(var i=0,len=arguments.length;imax){
            max = arguments[i];
        }
    }
    return max;
}
console.log(getMaxValue(4,2,1,8,10));//10

將對(duì)象屬性用作實(shí)參:當(dāng)一個(gè)函數(shù)的形參過(guò)多（比如超過(guò)3個(gè)），調(diào)用時(shí)記住實(shí)參的正確順序不容易。這時(shí)可以把形參寫成一個(gè)對(duì)象，就沒(méi)有參數(shù)順序的影響了，而且還可以在取值的時(shí)候使用||符號(hào)設(shè)置默認(rèn)值。當(dāng)然，形參不多就不需這樣做，效率會(huì)低一些。

在每個(gè)形參左邊使用類似/*array*/的類型注釋。在函數(shù)體內(nèi)應(yīng)該要有實(shí)參類型檢查的邏輯，在傳入非法值時(shí)報(bào)錯(cuò)。

自定義函數(shù)屬性：函數(shù)是一種特殊的對(duì)象，所以在適當(dāng)?shù)臅r(shí)候可以給函數(shù)定義屬性，比如函數(shù)需要一個(gè)“靜態(tài)變量”：

//階乘
function factorial(n) {
    if(isFinite(n) && n>0 && n==Math.round(n)){
        if(!(n in factorial)) factorial[n] = n * factorial(n-1);
        return factorial[n];
    }
    else return NaN;
}
factorial[1] = 1;
console.log(factorial([5]));//120

4.作為命名空間的函數(shù)

為了不污染全局空間，常用定義匿名函數(shù)并立即在單個(gè)表達(dá)式中調(diào)用的方式：

var extendFun = (function () {
    //函數(shù)體
}());

5.call()、apply()和bind()

call()和apply()

call()和apply()是函數(shù)的方法，通過(guò)調(diào)用方法的形式來(lái)簡(jiǎn)介調(diào)用函數(shù)，我們之前介紹繼承的時(shí)候，有一個(gè)地方是借用超類型的構(gòu)造函數(shù)，就是使用了call。它們的第一個(gè)實(shí)參是要調(diào)用函數(shù)的母對(duì)象，它是調(diào)用上下文，函數(shù)體內(nèi)通過(guò)this引用它。

call除了第一個(gè)參數(shù)之后的參數(shù)就是要傳給函數(shù)的值：

function logMsg(x,y,z) {
    console.log(x+"/"+y+"/"+z);
}
//打印2/4/6
logMsg.call({},2,4,6);

而apply除了第一個(gè)參數(shù)以外，提供一個(gè)數(shù)組用于傳給函數(shù)：

function logMsg(x,y,z) {
    console.log(x+"/"+y+"/"+z);
}
//打印8/10/12
logMsg.apply({},[8,10,12]);

apply的數(shù)組參數(shù)可以是真實(shí)數(shù)組，也可以是類數(shù)組對(duì)象，比如可以把當(dāng)前函數(shù)的arguments數(shù)組直接傳入：

function logMsg(x,y,z) {
    console.log(x+"/"+y+"/"+z);
}
function wantToLog(a,b,c) {
    logMsg.apply({},arguments);
}
//打印1/2/3/4
wantToLog(1,2,3);

bind()

這個(gè)方法主要作用是將函數(shù)綁定至某個(gè)對(duì)象，除了第一個(gè)實(shí)參以外，其他的實(shí)參會(huì)傳入到函數(shù)里面：

function f(y,z) {
    console.log("y:"+y);//y:4
    console.log("z:"+z);//z:2
    return this.x + y + z;
}
var g = f.bind({x:3},4);
console.log(g(2));//3+4+2=9
//這里面綁定了this和y