A Stepper for a Functional JavaScript Sublanguage

The first two chapters of the introductory computer science textbook Structure and Interpretation of Computer Programs, JavaScript Adaptation (SICP JS), use a subset of JavaScript called Source §2. The book introduces the reduction-based “substitution model” as a first mental model for the evaluation of Source §2 programs. To support the learner in adopting this mental model, we built an algebraic stepper—a tool for visualizing the evaluation of Source §2 programs according to the model. As a sublanguage of JavaScript, Source §2 differs from other purely functional programming languages by using a statement-oriented syntax, with statement sequences, return statements, and block-scoped declarations. For the purpose of this tool description, we distill these distinguishing features—along with explicit recursion—into a Source §2 sublanguage that we call Source §0, and focus on a stepper for this language. We formalize the substitution model of Source §0 as a lambda-calculus-style reduction semantics that handles explicit recursion by term graph rewriting and faithfully implements the JavaScript specification, when restricted to that language. Our implementation of the stepper represents term graphs by persistent data structures that maximize sharing and enable random access to all steps. This work presents the first reduction-based semantics for a JavaScript sublanguage and the first algebraic stepper for a language with return statements and block-scoped declarations. The tool supports the learner with step-level explanations, redex highlighting, and function-level skipping and can also be used for teaching the applicative-order-reduction lambda calculus.