快捷導(dǎo)航

Javascript中的高階函數(shù)介紹

更新時(shí)間：2015年03月15日 10:15:42 投稿：junjie

這篇文章主要介紹了Javascript中的高階函數(shù)介紹,本文講解了什么是高階函數(shù)、Javascript的高階函數(shù)、還原高階函數(shù)、高階函數(shù)使用實(shí)例等內(nèi)容,需要的朋友可以參考下

這是一個(gè)有趣的東西，這或許也在說(shuō)明Javascript對(duì)象的強(qiáng)大。我們要做的就是在上一篇說(shuō)到的那樣，輸出一個(gè)Hello,World，而輸入的東西是print('Hello')('World')，而這就是所謂的高階函數(shù)。

高階函數(shù)

高階看上去就像是一種先進(jìn)的編程技術(shù)的一個(gè)深?yuàn)W術(shù)語(yǔ)，一開(kāi)始我看到的時(shí)候我也這樣認(rèn)為的。

Javascript的高階函數(shù)

然而，高階函數(shù)只是將函數(shù)作為參數(shù)或返回值的函數(shù)。以上面的Hello,World作為一個(gè)簡(jiǎn)單的例子。

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

var Moqi = function(p1){

    this.add = function (p2){

        return p1 + ' ' + p2;

    };

    return add;

};

我們便可以這樣使用這個(gè)函數(shù)

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

console.log(Moqi('Hello')('World'));

或許這個(gè)過(guò)程有點(diǎn)混亂，看看詳細(xì)一點(diǎn)的。

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

> typeof Moqi('Hello')

<- "function"

> Moqi('Hello')

<- function (p2){

        return p1 + ' ' + p2;

    }

也就是說(shuō)實(shí)際上Moqi('Hello')是一個(gè)函數(shù)，Moqi('Hello')

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

> var m = Moqi('Hello')        

 > m('World')

 > "Hello,World"

從上面的情況來(lái)看，高階函數(shù)可以使代碼更簡(jiǎn)潔、高效。自然而然地我們也可以創(chuàng)建一個(gè)函數(shù)，以便于:

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

 > Moqi('Hello')('World')('Phodal')

 > "Hello,World Phodal"

于是就有了這樣一個(gè)函數(shù)

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

var Moqi = function(p1){

    return  function (p2){

        return function(p3){

            return p1 + ',' + p2 + ' ' +p3;

        }

    };

};

還原高階函數(shù)

越來(lái)越復(fù)雜，需要引入高階函數(shù)抽象的信號(hào)是出現(xiàn)重復(fù)或者相似的代碼。然后，我們先一步步還原到之前的函數(shù)：

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

var Moqi = function(p1){

     this.add =  function (p2){

        return function(p3){

            return p1 + ',' + p2 + ' ' +p3;

        }

    };

    return this.add;

};

接著再創(chuàng)建一個(gè)新的函數(shù)

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

var Moqi = function(p1){

     this.add =  function (p2){

        this.add1 = function(p3){

            return p1 + ',' + p2 + ' ' +p3;

        };

        return this.add1;

    };

    return this.add;

};

使用javascript中的call方法，就會(huì)有：

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

var Moqi = function(p1){
var self = this;

    function fd(p2) {
        this.add1 = function (p3) {
            return p1 + ',' + p2 + ' ' + p3;
        };
    }

    self.add = function (p2){
        fd.call(this, p2);
        return this.add1;
    };
    return self.add;
};

高階函數(shù)實(shí)例

上面的例子只是為了好玩，下面的例子是真正的運(yùn)用。

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

add = function(a,b){
return a + b;
};

function math(func,array){
return func(array[0],array[1]);
}

console.log(math(add,[1,2]));

> math(add,[1,2])
< 3

在上面的例子中傳進(jìn)去的add是一個(gè)參數(shù)，而在return的時(shí)候剛是一個(gè)函數(shù)。如在jQuery中有一個(gè)函數(shù)用于

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

// Convert dashed to camelCase; used by the css and data modules

// Microsoft forgot to hump their vendor prefix (#9572)

camelCase: function( string ) {

    return string.replace( rmsPrefix, "ms-" ).replace( rdashAlpha, fcamelCase );

},

也是這樣的運(yùn)用，可見(jiàn)高階函數(shù)對(duì)于掌握好JS的重要。。

您可能感興趣的文章: