Sikau

WebAssembly · Day 8 · about 55 min

Capstone: A compiler to WebAssembly

Parse arithmetic with precedence and emit real wasm bytecode.

Source in, machine code out

Write a real compiler: it parses expressions like (x + 3) * y - 4 with correct precedence (recursive descent — one function per precedence level), emits stack-machine bytecode as it goes, wraps it in a module with your buildModule, and returns a function the browser runs natively.

Recursive descent

A recursive-descent parser has one function per precedence level. expr handles + and - and calls term for its operands; term handles * and / and calls factor; factor handles numbers, variables, parentheses and unary minus. Because term finishes multiplying before expr sees a +, 2 + 3 * 4 naturally groups as 2 + (3 * 4).

function expr() {
  term();
  while (peek() === "+" || peek() === "-") {
    const op = next();
    term();
    emit(op === "+" ? 0x6a : 0x6b);
  }
}

The rest of this lesson

  • Emitting as you parseexplain
  • A real compiler in miniatureexplain
  • Code for (x + 3) * yorder
  • Parser levelmatch
  • compileExprchallenge
  • Badge quizquiz
  • WebAssembly: complete!recap

Continue this lesson free — run real code in your browser

Continue with Google

See all 8 lessons of WebAssembly