天天看點

JavaScript深入淺出第2課:函數是一等公民是什麼意思呢?

摘要: 聽起來很炫酷的一等公民是啥?

《JavaScript深入淺出》系列:

看到一篇講JavaScript曆史的

文章

裡面提到:JavaScript借鑒Scheme語言,将函數提升到"一等公民"(first class citizen)的地位。

一等公民這個名字聽起來很高大上,但是也相當晦澀,這個與翻譯也沒什麼關系,因為first class citizen很多人包括我也不知所雲。

JavaScript函數是一等公民,是什麼意思呢?我來與大家探讨一下,抛磚引玉。

一等公民的定義

根據維基百科,程式設計語言中一等公民的概念是由英國計算機學家

Christopher Strachey

提出來的,時間則早在上個世紀60年代,那個時候還沒有個人電腦,沒有網際網路,沒有浏覽器,也沒有JavaScript。

大概很多人和我一樣,沒聽說過Christopher Strachey,并且他也隻是提出了一等公民的概念,沒有給出嚴格的定義。

關于一等公民,我找到一個權威的定義,來自于一本書

《Programming Language Pragmatics》

,這本書是很多大學的程式語言設計的教材。

In general, a value in a programming language is said to have first-class status if it can be passed as a parameter, returned from a subroutine, or assigned into a variable.

也就是說,在程式設計語言中,一等公民可以作為函數參數,可以作為函數傳回值,也可以指派給變量。

例如,字元串在幾乎所有程式設計語言中都是一等公民,字元串可以做為函數參數,字元串可以作為函數傳回值,字元串也可以指派給變量。

對于各種程式設計語言來說,函數就不一定是一等公民了,比如

Java 8之前的版本

對于JavaScript來說,函數可以指派給變量,也可以作為函數參數,還可以作為函數傳回值,是以JavaScript中函數是一等公民。

函數作為函數參數

回調函數(callback)是JavaScript異步程式設計的基礎,其實就是把函數作為函數參數。例如,大家常用的setTimeout函數的第一個參數就是函數:

setTimeout(function() {
    console.log("Hello, Fundebug!");
}, 1000);           

JavaScript函數作為函數參數,或者說回調函數,作為實作異步的一種方式,大家都寫得多了,其實它還有其他應用場景。

Array.prototype.sort()

在對一些複雜資料結構進行排序時,可以使用自定義的比較函數作為參數:

var employees = [
    { name: "Liu", age: 21 },
    { name: "Zhang", age: 37 },
    { name: "Wang", age: 45 },
    { name: "Li", age: 30 },
    { name: "zan", age: 55 },
    { name: "Xi", age: 37 }
];

// 員工按照年齡排序
employees.sort(function(a, b) {
    return a.age - b.age;
});

// 員工按照名字排序
employees.sort(function(a, b) {
    var nameA = a.name;
    var nameB = b.name;
    if (nameA < nameB) {
        return -1;
    }
    if (nameA > nameB) {
        return 1;
    }
    return 0;
});           

這樣寫看起來沒什麼大不了的,但是對于JavaScript引擎來說就省事多了,因為它不需要為每一種資料類型去實作一個排序API,它隻需要實作一個排序API就夠了,至于數組元素大小怎麼比較,交給使用者去定義,使用者如果非得說2大于1,那也不是不可以。

換句話說,如果Array.prototype.sort()隻能實作簡單資料(比如Number與String)的排序的話,那它就太弱了,正因為可以使用函數作為參數,使它的功能強大了很多。

順便提一下,實作一個Array.prototype.sort(),可不是什麼簡單的事情,大家可以看看

V8是怎樣實作數組排序的

将函數指派給變量

JavaScript是可以定義匿名函數的,當我們定義有名字的函數時,通常是這樣寫的:

function hello() {
    console.log("Hello, Fundebug!");
}           

當然,也可以将函數指派給變量:

var hello = function() {
    console.log("Hello, Fundebug!");
};

console.log(typeof hello); // 列印 function           

可知,hello變量的類型是"function"。

在其他的一些

First-class function

的定義中,還要求函數可以儲存到其他資料結構,比如數組和對象中,這一點JavaScript也是支援的。

In computer science, a programming language is said to have first-class functions if it treats functions as first-class citizens. This means the language supports passing functions as arguments to other functions, returning them as the values from other functions, and assigning them to variables or storing them in data structures.

函數可以儲存到Object中,就意味着函數成為了Object的方法。我在

《JavaScript深入淺出第1課:箭頭函數中的this究竟是什麼鬼?》

中提過,當函數作為Object的方法被調用時,它的this值就是該Object,這1點與Java等面向對象語言是一緻的。是以JavaScript在沒有

Class

之前,就在一定程度上是支援面向對象程式設計的,當然比較弱。

var person = {
    name: "Wang Lei",
    age: 40,
    greeting: function() {
        console.log(`Hello! My Name is ${this.name}.`);
    }
};

console.log(person.age); // 列印 40
person.greeting(); // 列印 Hello! My Name is Wang Lei.           

函數作為函數傳回值

通常來講,函數的傳回值比較簡單,比如數字、字元串、布爾值或者Object。由于JavaScript函數是第一公民,是以我們也可以在函數中傳回函數。

function sayHello(message) {
    return function() {
        console.log(`Hello, ${message}`);
    };
}

var sayHelloToFundebug = sayHello("Fundebug!");
var sayHelloToGoogle = sayHello("Google!");

sayHelloToFundebug(); // 列印Hello, Fundebug!
sayHelloToGoogle(); // 列印Hello, Google!           

當我們調用sayHello函數時,它傳回值sayHelloToFundebug實際是一個函數,我們需要調用所傳回的sayHelloToFundebug函數,它才會執行,列印對應的資訊:"Hello, Fundebug!"。

我猜這個地方有人會擡杠,因為示例代碼沒有必要這麼寫,因為有更簡單的寫法:

function sayHello(message) {
    console.log(`Hello, ${message}`);
}

sayHello("Fundebug!"); // 列印Hello, Fundebug!
sayHello("Google!"); // 列印Hello, Google!           

但是這隻是一個簡單的示例,在一些複雜的實際場景中,在函數傳回函數還是很有用的。下面給大家一個簡單的示例。

我們Fundebug在

微信小程式BUG監控插件

的時候,把不同

API

的定義拆分在不同的檔案,但是這些API需要共享一些全局屬性,比如使用者的

個性化配置

。微信小程式是沒有全局變量window的,就算是網頁端有window其實最好也不要用,會污染全局作用域。這時候該怎麼辦?給大家看看定義

fundebug.test()

是怎樣定義的吧:

function defineTestApi(config) {
    function testApi(name, message) {
        const event = {
            type: "test",
            apikey: config.apikey,
            name: name || "Test",
            message: message || "Hello, Fundebug!"
        };
        sendToFundebug(event);
    }
    return testApi;
}           

我們使用了一個外層函數defineTestApi來共享全局配置對象config,函數中定義的testApi函數則通過return傳回。

這裡其實也用到了閉包,因為defineTestApi函數執行結束之後,testApi函數仍然可以使用config變量,是以config變量的生命周期超越了defineTestApi函數。關于閉包的詳細介紹,我會在這個系列的後續文章中介紹。

是以,在函數中傳回函數,還是很有用的。

開發者對待每一個技術點,比如閉包,應該保持謙卑,不要覺得這個也沒有用,那個也沒有用,其實隻是你還沒遇到使用場景而已。關于這一點,大家可以看看我的部落格

《聊聊我的第一篇10萬+,同時反駁某些評論》

函數為第一公民是函數式程式設計的基礎

函數為第一公民的3個特性我都介紹了,它們确實讓JavaScript更加強大,然後呢?JavaScript的騷操作大家見得多了,也不會覺得有什麼神奇之處。

其實,函數是第一公民,與大家都聽過的函數式程式設計有着密切的關系。

First-class functions are a necessity for the functional programming style, in which the use of higher-order functions is a standard practice. 

也就是說,函數為第一公民是函數式程式設計的必要條件。higher-order functions,即高階函數,就是使用函數作為參數的函數,它在函數式程式設計中很常見。

至于什麼是函數式程式設計,不是我一句話能講清楚的,這可以一直聊到計算機的開山鼻祖圖靈。要知後事如何,請聽下回分解。

關于JS,我打算開始寫一個系列的部落格,大家還有啥不太清楚的地方?不妨留言一下,我可以研究一下,然後再與大家分享一下。也大家歡迎添加我的個人微信(KiwenLau),我是

Fundebug

的技術負責人,一個對JS又愛又恨的程式員。

參考

關于Fundebug

專注于JavaScript、微信小程式、微信小遊戲、支付寶小程式、React Native、Node.js和Java線上應用實時BUG監控。 自從2016年雙十一正式上線,Fundebug累計處理了10億+錯誤事件,付費客戶有陽光保險、核桃程式設計、荔枝FM、掌門1對1、微脈、青團社等衆多品牌企業。歡迎大家

免費試用

版權聲明

轉載時請注明作者

以及本文位址:

https://blog.fundebug.com/2019/06/25/javascript-first-class-function/

繼續閱讀