Turning Your Code Inside Out

@aleksandrasays

www.aleksandra.codes

whoami

- open-source engineer at
- 🧗‍♂️
- org of Wrocław

previously
-            .js Maintainer
-           

@aleksandrasays

www.aleksandra.codes

www.github.com/beerose

  1. Why bother?

  2. The spec for a new language

  3. The implementation

  4. Interpreters, compilers, everything in between

The plan for today

The talk's goal

Why is it worth knowing how languages work?

Let's say...

You need a custom lint rule

You want to enhance your IDE

You need a custom DSL

Some people, when confronted with a problem, think
“I know, I'll use regular expressions.”  Now they have two problems.

— Jamie Zawinski

Interpreted or Compiled?

V8 Ignition

Let's talk

about grammars

I did visited Berlin
Your so talented at playing you’re piano.
let add = (a, b) {
  a + b
}

add(1, 2)
asda

Text

<bedtime-routine> ::= <bottoms> <top> <slippers>
<bottoms>         ::= "Bottoms"
<top>             ::= "Top"
<slippers>        ::= "Slippers"

Regular grammar

<Palindrome> ::= <Empty> | <Char> | <Char> <Palindrome> <Char>
<Empty>      ::= ε
<Char>       ::= "a" | "b" | "c" | ... | "z"

Context-free grammar

      <Palindrome>

    r <Palindrome> r

  r a <Palindrome> a r

r a d <Palindrome> d a r

Regular grammars: what comes next depends on  the previous step

 

Context-free grammars: what comes next doesn't depend on the previous step

There's a long road from code's inception to its execution

<Program> ::= <Expression> '\n' <Program> | EOF

<Expression> ::= <FunctionExpression> | <VariableDeclaration> | <AssignmentExpression>

<AssignmentExpression> ::= <AdditiveExpression> '=' <AssignmentExpression> | <AdditiveExpression>

<AdditiveExpression> ::= <MultiplicativeExpression> ('+' <MultiplicativeExpression> | '-' <MultiplicativeExpression>)*

<MultiplicativeExpression> ::= <PowerExpression> ('*' <PowerExpression> | '/' <PowerExpression>)*

<PowerExpression> ::= <Term> ('**' <Term>)*

<Term> ::= <FunctionCall> | <NumericLiteral> | <Identifier> | <UnaryExpression> | '(' <Expression> ')'

<UnaryExpression> ::= '-' <Term>

<VariableDeclaration> ::= 'let' <Identifier> '=' <Expression>

<FunctionExpression> ::= '(' <Parameters> ')' '=>' <Body>

<FunctionCall> ::= <Identifier> '(' <Arguments> ')'

<Body> ::= <Expression> | '{' <ExpressionSequence> '}'

<ExpressionSequence> ::= <Expression> '\n' <ExpressionSequence> | ε

<Parameters> ::= <Identifier> (',' <Identifier>)* | ε

<Arguments> ::= <Expression> (',' <Expression>)* | ε

<Identifier> ::= [a-zA-Z_][a-zA-Z0-9_]*

<NumericLiteral> ::= [0-9]+('.'[0-9]+)?

?

let add = (a, b) => {
  a + b
}

add(1, 2) // == 3

Let's dive into the code!

Thank you!

@aleksandrasays

www.aleksandra.codes

meet.js: Turning Your Code Inside Out

By Aleksandra Sikora

meet.js: Turning Your Code Inside Out

  • 1,238