使用JavaScript ES6的新特性計算Fibonacci(非波拉契數列)

程序員面試系列javascript

Java面試系列-webapp文件夾和WebContent文件夾的區別?java

程序員面試系列:Spring MVC能響應HTTP請求的緣由?程序員

Java程序員面試系列-什麼是Java Marker Interface(標記接口)web

使用JDK自帶的工具jstack找出形成運行程序死鎖的緣由面試

編程面試題:編寫一個會形成數據庫死鎖的應用數據庫

JavaScript面試系列:JavaScript設計模式之橋接模式和懶加載編程

面試題:用JavaScript開發一個函數,打印非波拉契數列。json

咱們只要記住非波拉契數列的計算公式,就不難寫出來了:設計模式

F(0)=1,F(1)=1, F(n)=F(n-1)+F(n-2)閉包

我寫的JavaScript代碼以下:

var fib = function (a, b) {

   var _current = a + b;

   return {

       current: _current,
 
       next: function () {

            return fib(b, _current);

        }
  }
}

把當前這一輪的計算結果存儲到第二行的變量_current裏,並經過屬性current返回給調用者。返回的json對象除了current屬性外,還有另外一個屬性next,指向一個閉包函數調用。一旦next指向的函數再次被調用,則會再次觸發數列的計算。

var generator = fib(1,1);

// 前一行調用fib(1,1)計算1+1的結果爲2,將2存儲到_current裏經過current屬性返回,因此打印2

// 同時返回next函數,函數體爲return fib(b, _current); 此時b爲1,_current爲2

console.log(generator.current);

// 一旦執行next函數,則執行其指向的return fib(b, _current); 1 + 2 = 3

var result = generator.next();

console.log(result.current); // 打印3

若是要打印10個非波拉契數列的值,意味着我要重複調用9次fib函數,太麻煩。因而我寫了個函數把fib調用包裹起來。

這個包裹函數有兩個輸入參數,n爲但願生成非波拉契數列元素的個數,第二個參數sequence接受一個函數。

var take = function(n, sequence) {

    var result = [];

    var temp = sequence;

    for (var i = 0; i < n; i++) {

         result.push(temp.current);

         temp = temp.next();

    }

   return result;

}

如今我只須要一行語句,就能打印10個非波拉契數列的元素出來。

console.log(take(10, fib(1,1)));

採用ES6的GeneratorFunction生成非波拉契數列

ES6提供了原生GeneratorFunction的支持,語法很是有特點,關鍵字function後面緊跟一個星號。GeneratorFunction的詳細介紹參考官網:https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/function*

先看如何用GeneratorFunction這個黑科技從新實現非波拉契樹立的生成。代碼以下:

var fib_generator = function *(){

     var current = 0, next = 1;

      while(true) {

          [next, current] = [next+current, next];

          yield current;

     }

}

var fib = fib_generator();

for(var i = 0; i < 10; i++){

      console.log(fib.next().value);

}

第5行從語義上很是清晰地體現出了非波拉契數列的計算公式:

F(n)=F(n-1)+F(n-2)

然而它是包含在一個while(true)的無限循環內的,因此這段代碼是如何工做的呢?

最好的學習辦法就是單步調試。

代碼第40行到第47行,咱們使用了ES6 function*關鍵字獲得了一個"function generator"。在這個generator內部,咱們定義了一個無限循環,用於計算非波拉契數列。

第49行,咱們用()調用了這個generator,將結果存儲在變量fib裏。直到此時,function generator的實現體,即代碼41~45行尚未獲得執行。

實際上,49行的變量lib只是維護了一個指向fib_generator的ITERATOR指針。

這個ITERATOR自帶了一個名爲next的方法,是ES6的原生實現,你們看上圖調試器裏的fib.next顯示的是native code。Functiongenerator的神奇之處在於,當next方法被調用一次,則generator內部的函數體也只會執行一次。

單步執行,執行一次next方法:

注意調用棧,此時咱們已經進入fib_generator函數體內部了:

一旦在FunctionGenerator實現體內部執行到yield關鍵字,則當前計算結果做爲返回值返回給consumer。也就是說,一旦執行遇到yield,則自動從無限循環中退出。

下列簡單的循環會打印10個非波拉契數列的元素:

for(var i = 0; i < 10; i++){

     var currentResult = fib.next();

      console.log(currentResult.value);

}

從上面的代碼能看出,yield關鍵字返回一個json對象給消費者,該對象有個名爲name的屬性,包含的是具體計算的數值。Json對象的另外一個屬性名爲done,類型爲boolean,意思是這個FunctionGenerator的函數體執行是否已經結束。在個人這個例子裏,每次next調用的yield返回的Json對象的done屬性都爲false,由於個人FunctionGenerator內部是一個無限循環。

採用ES6的FunctionGenerator打印出的結果和常規寫法一致。

相信您面試的時候,若是能用ES6的FunctionGenerator完成這道題目,必定能讓面試官對您另眼相看。

我寫的程序員面試系列

Java面試系列-webapp文件夾和WebContent文件夾的區別?

程序員面試系列:Spring MVC能響應HTTP請求的緣由?

Java程序員面試系列-什麼是Java Marker Interface(標記接口)

使用JDK自帶的工具jstack找出形成運行程序死鎖的緣由

編程面試題:編寫一個會形成數據庫死鎖的應用

JavaScript面試系列:JavaScript設計模式之橋接模式和懶加載

要獲取更多Jerry的原創技術文章,請關注公衆號"汪子熙"或者掃描下面二維碼:

相關文章
相關標籤/搜索