Let's explain what a closure is by writing a JavaScript interpreter in JavaScript.

Try it here: https://tonicdev.com/npm/the-super-tiny-interpreter

This project is still a work in progress, but feel free to poke around and check out the unit tests.

The goal of this project is not to make a spec-compliant or blazing-fast interpreter. The goal, however, is to interpret a tiny subset of JavaScript features in super-easy-to-read™ code.

1. Numbers, Booleans, null, and undefined

12 // Numeric Literal
true // Boolean Literal
null // Null Literal
undefined // Do you know that `undefined` is actually an identifier? Paul Irish calls shadowing it the "Asshole Effect".

2. Variable, a.k.a. Identifier

foo

3. Binary Operators

+, -, *, /, ==, ===, !=, !==, <, <=, >, >=

4. Unary Operators

!, -

5. Conditional Expression, a.k.a. the ternary operator

test ? consequent : alternate

6. Arrow Function Expression

• Notice that we didn't implement the traditional function syntax. Arrow functions FTW!

(x) => x + 1

(x) => {
  const y = x + 100;
  return y * y;
}

7. Call Expression

foo(1, 2, 3)

8. Variable Declaration Statement

• Notice that we only support const for now and there's NO mutation (assignment) in our language.
  • That means we can initialize stuff once and only once
  • And of course const foo; is not valid JavaScript
• If you are familiar with Scheme/OCaml, then const LHS = RHS behaves just like a letrec.

const foo = 12;

const fact = (x) => x < 2 ? 1 : x * fact(x - 1);