然並卵：BF 科普 & BF 解釋器的 JS 實現

最近在 Codewars上作練習，某道題的內容是實現一個 brainFuck（簡稱BF語言） 解釋器（c/python/js等等都可）。動手實踐的過程仍是頗有趣的，中間也遇到了各類各樣的問題，最終經過測試，代碼也比較接近目前的 JS 高分 solution。這篇文章準備聊聊相關的一些知識和實現的細節。

「腦洞大開」的語言 —— BF 簡介

BrainFuck（後文以簡寫BF指代），單是名字就很容易讓人腦洞大開，有種不可描述的「哲學」韻味。因此若是你忍不住 google 一下相關圖片的話，你會可能搜到相似下面的圖片：

畫面是否是已經很生動了？

BF 字面上的含義已經暗示了這是一種不太直觀和容易閱讀的語言，固然，在當下也不會是一種通用語言。她屬於 Esolang（全稱 Esoteric programming language，直譯：深奧的編程語言） 的範疇。

BF誕生於上世紀30年代，曾運用於早期的 PC（Amiga），想詳細瞭解的童鞋能夠瀏覽 維基百科。

BF 在當下有什麼應用場景呢？

我想，對一個吃瓜羣衆來講，瞭解了它，對寫做 逼格 和 腦力 的提高是頗有用的。BF 具備極簡主義（搞設計的童鞋的不妨瞭解下下）和功能齊全（圖靈徹底）的特色，旨在爲用戶帶來困惑和挑戰，豐富勞動人民的業餘生活。

8 種運算符及其操做

BF 做爲一種極簡的計算機語言，僅有8種運算符，分別爲: < > + - , . [ ]，其功能對照以下表所示：

指令	含義
<	指針減一（指針左移）
>	指針加一（指針右移）
+	指針指向的字節的值加一（當前單元的數值+1）
-	指針指向的字節的值減一（當前單元的數值-1）
,	輸入內容到指針指向的單元（輸入一個字符，將其ASCII碼保存到當前指針所指單元）
.	將指針指向的存儲單元的內容做爲字符輸出（將ASCII碼輸出爲字符）
[	若是指針指向的存儲單元爲零，向後跳轉到對應的 ] 指令處
]	若是指針指向的存儲單元不爲零，向前跳轉到對應的 [ 指令處

BF基於一個簡單的機器模型，除了八個指令，這個機器還包括：一個以字節爲單位、被初始化爲零的數組、一個指向該數組的指針(初始時指向數組的第一個字節)、以及用於輸入輸出的兩個字節流。

對 BF 比較有意思的比擬能夠是這樣的：

1. 若是把機器內存當作是一個無限長的「小火車」（相似於Array或List的數據結構）,每一個車箱（存儲單元）裏面的貨物默認都是數字 0，列車上僅有一個列車員（數據指針）；
2. <> 至關於列車員在車箱間進行移動，只有當列車員在某節車箱時，才能對車箱的貨物進行操做；
3. +- 至關於列車員對當前所在車箱的貨物進行增減；
4. , 至關於列車在裝貨，列車員將當前所在車箱的貨物替換爲貨運站輸入的單批次貨物（一個字符的ASCII碼）；
5. . 會將當前車箱裏的貨物名稱（單個字符）輸出來；
6. [] 至關於列車員在知足條件的兩節車箱間來回移動；

這裏要注意的是，數組的每一個單元都是一個字節大小；- 命令容許溢出，它能夠用 255 個 + 命令來代替。例如，當某個存儲單元的值爲 255 時，其執行指令 + 的結果爲 0。相似的， 0 執行指令 - 的結果爲 255.

與通用語言的類比

據此，BF的運算符與通用語言的類好比下（以C語言爲例）：

BrainFuck	C
<	--ptr;
>	++ptr;
+	++*ptr;
-	--*ptr;
,	*ptr = getchar();
.	putchar(*ptr);
[	while (*ptr) {
]	}

BF 解釋器的 JS 函數實現

代碼奉上：

function brainLuck(code, input) {             // @1
  const inputChars = input.split('');         // @2

  const codes = code.split('');               // @3
  let codeIdx = 0;

  const arr = [];                             // @4
  let arrIdx = 0;
  let outputStr = '';                         // @5

  while (codeIdx < code.length) {             // @6
    const ops = codes[codeIdx];

    const handleLeftBracket = () => {         // @7
      if (~~arr[arrIdx] === 0) {
        let cnt = 1;

        while (cnt) {
          codeIdx++;
          if (codes[codeIdx] === '[') {
            cnt += 1;
          }
          if (codes[codeIdx] === ']') {
            cnt -= 1;
          }
        }
      }
    };

    const handleRightBracket = () => {        // @8
      if (~~arr[arrIdx] !== 0) {
        let cnt = 1;

        while (cnt) {
          codeIdx--;
          if (codes[codeIdx] === ']') {
            cnt += 1;
          }
          if (codes[codeIdx] === '[') {
            cnt -= 1;
          }
        }
      }
    };

    switch (ops) {                            // @9
      case '>':
        arrIdx += 1;
        break;
      case '<':
        arrIdx -= 1;
        break;
      case '+':
        arr[arrIdx] = (~~arr[arrIdx] + 1) % 256;
        break;
      case '-':
        arr[arrIdx] = (~~arr[arrIdx] || 256) - 1;
        break;
      case ',':
        const iptChar = inputChars.shift();
        arr[arrIdx] = iptChar ? iptChar.charCodeAt(0) : arr[arrIdx];
        break;
      case '.':
        outputStr += String.fromCharCode(arr[arrIdx]);
        break;
      case '[':
        handleLeftBracket();
        break;
      case ']':
        handleRightBracket();
        break;
    }

    codeIdx++;                               // @10
  }

  return outputStr;                          // @11
}

實現思路闡述（與代碼中註釋的序號對應）：

(1) 咱們實現了一個函數 brainLuck 用以模擬 BF 語言的解釋執行，函數 brainLuck 的用例以下：

const code = ',+[-.,+]';
const input = 'Parksben' + String.fromCharCode(255);

const output = brainLuck(code, input);
console.log(output); // -> 'Parksben'

(2) 將輸入的字符串切割爲單個字符，暫存進數組 inputChars；

(3) 將 BF 程序切割爲單個操做符，方便遍歷每一個指令，用 codeIdx 做爲下標進行遍歷；

(4) 聲明一個數組 arr 用以模擬機器內存，過程產生的數值存儲到此數組中；

(5) 用字符串 outputStr 存儲程序的輸出；

(6) 遍歷 BF 運算符，對不一樣指令進行相應的操做；

(7) 方法 handleLeftBracket，用以匹配到與當前 [ 對應的 ]（經過操做下標 codeIdx）；

(8) 方法 handleRightBracket，用以匹配到與當前 ] 對應的 [（經過操做下標 codeIdx）；

(9) 用以處理不一樣指令的 switch 語句；

(10) codeIdx 加一，以向前遍歷 codes；

(11) 程序輸出；

延伸閱讀

Brainfuck: a Programming Language or a Joke?

丹尼爾·克里斯托法尼的一些 BF 實例

深奧的編程語言 - 維基百科