API的最佳表現形式

SmallBoyO 發布于2019-08-19 18:46 / 2310人閱讀

摘要：從一般的編程理論中也明確闡述，類變量或稱為數據應該用訪問方法如和進行封裝，以保證數據的完整性和一致性。當類變量或稱數據只能通過類函數訪問時，正好符合中的類定義。

引言

Werner Vogels在主題演講上簡要敘述了Lambda設計思路的由來。

Vogels首先拋出一個問題：什么是云計算的根本（primitives）？

答案：云計算是一個執行環境。

Vogels再拋出第二個問題：什么是應用的根本？

答案：函數（functions，即業務邏輯的載體）+數據（data，即跟業務相關的輸入與輸出），以及這兩者之間的交互——即事件（events。常見的事件如增加、變更、刪除等）。

換言之，對于一個應用來說，除了functions、data、events這三個東西是根本之外，其他無論什么代碼和框架，無非都是膠水或者UI罷了。

既然如此，理想的情況是用最少的時間寫膠水，將做多的時間投入到應用的核心當中。

而最常見的膠水代碼，就是觸發器（trigger）：當發生一個事件（event）時，執行某個函數（function），輸出新的數據（data）。Vogels以Excel表單為例：在一個表單當中，一個單元格數值的變更，觸發總和列對應單元格數值的變更，就是一個事件觸發函數將新的變量納入計算得出新的數值的過程。這個過程是自動的，還可以是并發的，即一處變更同時觸發多個函數。

基于這個思路，AWS做了Lambda服務。

從編程語言角度審視Vogels的觀點

在編程語言中，函數（functions）＋數據（data）＋事件（events）的有機組合就是類（class）。在ES6中、類（class）的主體只能包含方法，不能包含數據屬性。從一般的編程理論中也明確闡述，類變量或稱為數據（data）應該用訪問方法（如getter和setter）進行封裝，以保證數據的完整性和一致性。

Vogels以Excel表單舉例，說明當數據（data）變化后，觸發函數執行；更多人會用react的stats舉例，當數據（data）變化后，觸發DomTree刷新。這是受數據驅動編程的影響？我只能理解為流派之爭。怎么著你都得寫個listener吧？listener也是函數！

回到正題，既然應用的本質都是一個類（class），當然最好的API接口也是一個類（class）。當類變量或稱數據（data）只能通過類函數訪問時，正好符合ES6中的類（class）定義。ES6中的類（class）只包含類函數（functions），其中一部分函數（functions）被其它程序直接調用，另一個部分函數（functions）被事件激活調用。

API類（class）是單例對象（singleton object）

你new與不new，API單例對象都在那里，不增也不減。

這里借用scala語言中對單例對象的敘述：“類和單例對象間的一個差別是，單例對象不帶參數，而類可以。因為你不能用new關鍵字實例化一個單例對象，你沒機會傳遞給它參數。每個單例對象都被作為由一個靜態變量指向的虛構類：synthetic class的一個實例來實現，因此它們與Java靜態類有著相同的初始化語法。Scala程序特別要指出的是，單例對象會在第一次被訪問的時候初始化?！?/p>

與Java語言一樣，在ES6中也沒有單例對象（singleton object）的定義方法。而要記住的是對每一個調用接口的程序而言，實現的接口（API）類是個單例對象。

API類（class）三個基本問題（直接上結論）

跨域訪問－支持

瀏覽器中調用－支持

nodejs中調用－支持

編寫第一個接口API類 - HelloWorld.es6

class HelloWorld {
    constructor() {
        this.greeting = "Hello World!";
    }
    welcome(callback) {
        callback(null, this.greeting);
    }
}

export default HelloWorld;

使用babel轉成ES5

$ babel HelloWorld.es6 -o HelloWorld.js

現在要把你寫好的class發布出去了！

# npm install nodeway -g
# nodeway --class HelloWorld.js --host 0.0.0.0 --port 8080 --docs . &

這句的意思是啟動一個Web Server，把HelloWorld.js發布出去。好了，現在剩下的就是測試了。

編寫測試程序 index.html




    
    HelloWorld

用瀏覽器訪問你寫的這個index.html文件，就可以看到你發布成功了。

在HelloWorld.es6實現事件（events），需要增加兩個函數emit和on。（這段只是原理性展示，實際代碼不要這樣寫）

class HelloWorld {
    constructor() {
        this.greeting = "Hello World!";
        // 以下是新添加代碼，6秒發一個"again"事件
        this.events = {};
        setInterval(() => {
            this.emit && this.emit("again", null, this.greeting);
        }, 6000);
        // 以上是新添加代碼
    }
    // 以下是新添加代碼
    on(eventName, fn) {
        this.events[eventName] = fn;
    }
    emit() {
        let args = Array.from(arguments),
            fn = this.events[args.shift()];
        fn && fn.apply(this, args);
    }
    // 以上是新添加代碼
    welcome(callback) {
        callback(null, this.greeting);
    }
}

export default HelloWorld;

一點基礎知識－ ES6原型鏈

為了不暴露emit代碼，將其放到函數on中（參考ES6原型鏈）。

class HelloWorld {
    constructor() {
        this.greeting = "Hello World!";
        // 以下是新添加代碼，6秒發一個"again"事件
        this.events = {};
        setInterval(() => {
            this.emit && this.emit("again", null, this.greeting);
        }, 6000);
        // 以上是新添加代碼
    }
    // 以下是新添加代碼
    on(eventName, fn) {
        this.events[eventName] = fn;
        this.constructor.prototype.emit ||
        (this.constructor.prototype.emit = function() {
            let args = Array.from(arguments),
                fn = this.events[args.shift()];
            fn && fn.apply(this, args);
        });
    }
    // 以上是新添加代碼
    welcome(callback) {
        callback(null, this.greeting);
    }
}

export default HelloWorld;

修改測試程序 index.html，實現事件（events）。




    
    HelloWorld

看執行結果吧！

GPU云服務器云服務器表現形式 api設計的最佳實踐內存故障的表現 linux硬盤損壞的表現

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/79990.html

2017年2月份前端資源分享

平日學習接觸過的網站積累，以每月的形式發布。2017年以前看這個網址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉換...

lily_wang 2019-06-27 16:28 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網站積累，以每月的形式發布。2017年以前看這個網址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉換...

chengjianhua 2019-08-29 12:35 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網站積累，以每月的形式發布。2017年以前看這個網址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉換...

Anonymous1 2019-08-20 16:31 評論0 收藏0
2017年2月份前端資源分享

平日學習接觸過的網站積累，以每月的形式發布。2017年以前看這個網址：http://www.kancloud.cn/jsfron... 1. Javascript 前端生成好看的二維碼十大經典排序算法(帶動圖演示) 為什么知乎前端圈普遍認為H5游戲和H5展示的JSer 個人整理和封裝的YU.js庫|中文詳細注釋|供新手學習使用擴展JavaScript語法記錄 - 掉坑初期工具漢字拼音轉換...

dreamtecher 2019-08-01 16:51 評論0 收藏0
最佳實踐

摘要：什么是重構字面上的理解重新組織結構為什么要重構原來的結構是什么樣子的有什么問題函數邏輯結構條件判斷循環操作包含關系集合關系非關系可擴展性差新的變化不能被靈活處理對象強耦合可復用性差重復代碼多性能消耗太多隨著技術發展新的好特性如何重構知道問題什么是重構? 字面上的理解: 重新組織結構為什么要重構? 原來的結構是什么樣子的?有什么問題? 1. 函數邏輯結構[條件判斷、循環操作]: 包...

iamyoung001 2019-08-22 17:21 評論0 收藏0