Tuesday, February 22, 2022

astexplorer.net: AST tool

AST explorer 

fkling/astexplorer: A web tool to explore the ASTs generated by various parsers. @GitHub


acornjs/acorn: A small, fast, JavaScript-based JavaScript parser

AST syntax comes from Mozilla API (leak)

tsc (TypeScript compiler) can parse and generate both JS and TS code

Using the Compiler API · microsoft/TypeScript Wiki

import * as ts from 'typescript';
const printer: ts.Printer = ts.createPrinter();
const sourceFile: ts.SourceFile = ts.createSourceFile(
  'test.ts', 'const x  :  number = 42', ts.ScriptTarget.ES2015, true, ts.ScriptKind.TS
);
console.log(printer.printFile(sourceFile))

Quick look at the TypeScript Compiler API - BLS29 SHOW & TELL WITH CHAU TRAN - YouTube

function add2 (x) { return x + 2 }

acorn =>

{
  "type": "Program",
  "start": 0,
  "end": 34,
  "body": [
    {
      "type": "FunctionDeclaration",
      "start": 0,
      "end": 34,
      "id": {
        "type": "Identifier",
        "start": 9,
        "end": 13,
        "name": "add2"
      },
      "expression": false,
      "generator": false,
      "async": false,
      "params": [
        {
          "type": "Identifier",
          "start": 15,
          "end": 16,
          "name": "x"
        }
      ],
      "body": {
        "type": "BlockStatement",
        "start": 18,
        "end": 34,
        "body": [
          {
            "type": "ReturnStatement",
            "start": 20,
            "end": 32,
            "argument": {
              "type": "BinaryExpression",
              "start": 27,
              "end": 32,
              "left": {
                "type": "Identifier",
                "start": 27,
                "end": 28,
                "name": "x"
              },
              "operator": "+",
              "right": {
                "type": "Literal",
                "start": 31,
                "end": 32,
                "value": 2,
                "raw": "2"
              }
            }
          }
        ]
      }
    }
  ],
  "sourceType": "module"
}


function add2 (x: number): number { return x + 2 }

tsc => 

{
  "pos": 0,
  "end": 50,
  "flags": 0,
  "modifierFlagsCache": 0,
  "transformFlags": 33,
  "kind": 294,
  "statements": [
    {
      "pos": 0,
      "end": 50,
      "flags": 0,
      "modifierFlagsCache": 0,
      "transformFlags": 1048609,
      "parent": "[Circular ~]",
      "kind": 248,
      "name": {
        "pos": 8,
        "end": 13,
        "flags": 0,
        "modifierFlagsCache": 0,
        "transformFlags": 0,
        "parent": "[Circular ~.statements.0]",
        "kind": 78,
        "escapedText": "add2"
      },
      "parameters": [
        {
          "pos": 15,
          "end": 24,
          "flags": 0,
          "modifierFlagsCache": 0,
          "transformFlags": 1,
          "parent": "[Circular ~.statements.0]",
          "kind": 159,
          "name": {
            "pos": 15,
            "end": 16,
            "flags": 0,
            "modifierFlagsCache": 0,
            "transformFlags": 0,
            "parent": "[Circular ~.statements.0.parameters.0]",
            "kind": 78,
            "escapedText": "x"
          },
          "type": {
            "pos": 17,
            "end": 24,
            "flags": 0,
            "modifierFlagsCache": 0,
            "transformFlags": 1,
            "parent": "[Circular ~.statements.0.parameters.0]",
            "kind": 143
          }
        }
      ],
      "type": {
        "pos": 26,
        "end": 33,
        "flags": 0,
        "modifierFlagsCache": 0,
        "transformFlags": 1,
        "parent": "[Circular ~.statements.0]",
        "kind": 143
      },
      "body": {
        "pos": 33,
        "end": 50,
        "flags": 0,
        "modifierFlagsCache": 0,
        "transformFlags": 1048608,
        "parent": "[Circular ~.statements.0]",
        "kind": 227,
        "statements": [
          {
            "pos": 35,
            "end": 48,
            "flags": 0,
            "modifierFlagsCache": 0,
            "transformFlags": 1048608,
            "parent": "[Circular ~.statements.0.body]",
            "kind": 239,
            "expression": {
              "pos": 42,
              "end": 48,
              "flags": 0,
              "modifierFlagsCache": 0,
              "transformFlags": 0,
              "parent": "[Circular ~.statements.0.body.statements.0]",
              "kind": 213,
              "left": {
                "pos": 42,
                "end": 44,
                "flags": 0,
                "modifierFlagsCache": 0,
                "transformFlags": 0,
                "parent": "[Circular ~.statements.0.body.statements.0.expression]",
                "kind": 78,
                "escapedText": "x"
              },
              "operatorToken": {
                "pos": 44,
                "end": 46,
                "flags": 0,
                "modifierFlagsCache": 0,
                "transformFlags": 0,
                "parent": "[Circular ~.statements.0.body.statements.0.expression]",
                "kind": 39
              },
              "right": {
                "pos": 46,
                "end": 48,
                "flags": 0,
                "modifierFlagsCache": 0,
                "transformFlags": 0,
                "parent": "[Circular ~.statements.0.body.statements.0.expression]",
                "kind": 8,
                "text": "2",
                "numericLiteralFlags": 0
              }
            }
          }
        ],
        "multiLine": false
      }
    }
  ],
  "endOfFileToken": {
    "pos": 50,
    "end": 50,
    "flags": 0,
    "modifierFlagsCache": 0,
    "transformFlags": 0,
    "parent": "[Circular ~]",
    "kind": 1
  },
  "fileName": "astExplorer.tsx",
  "text": "function add2 (x: number): number { return x + 2 }",
  "languageVersion": 99,
  "languageVariant": 1,
  "scriptKind": 4,
  "isDeclarationFile": false,
  "hasNoDefaultLib": false,
  "bindDiagnostics": [],
  "pragmas": {},
  "referencedFiles": [],
  "typeReferenceDirectives": [],
  "libReferenceDirectives": [],
  "amdDependencies": [],
  "nodeCount": 15,
  "identifierCount": 4,
  "identifiers": {},
  "parseDiagnostics": [],
  "path": "astExplorer.tsx",
  "resolvedPath": "astExplorer.tsx",
  "originalFileName": "astExplorer.tsx",
  "imports": [],
  "moduleAugmentations": [],
  "ambientModuleNames": []
}

No comments: