Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is JavaScript AST, how to play with it?

Abstract Syntax Tree.. I always heard that compile to SpiderMonkey AST on Github.
So, is that a actual standard of JS syntax tree? And there's V8, is V8 using the same kind of AST?

How can I play with that?

like image 905
jiyinyiyong Avatar asked Apr 21 '13 04:04

jiyinyiyong


People also ask

What is JavaScript AST?

An AST is the result of parsing code. For JavaScript, an AST is a JavaScript object containing a tree representation of your source. Before we use it, we have to create it. Depending on the code we are parsing, we choose the appropriate parser. Here since the code is ES5-compatible, we can choose the acorn parser.

How do you execute an AST?

To build an ast from code stored as a string, use ast. parse() . To turn the ast into executable code, pass it to compile() (which can also compile a string directly).

What is AST Explorer?

A web tool to explore the ASTs generated by various parsers. Syntax highlighting. Code Parser.

What is TypeScript AST?

The AST is a data structure to represent the structure of your source file in a format readable by machines. Indeed, if I throw the above example in the TypeScript AST Viewer I get immediate access to the AST.


1 Answers

1.You can take a look at AST explorer. An online tool to explore the ASTs generated by more than 10 parsers. It is a good tool to learn AST tree of a language.
AST explorer source at Github.com.

enter image description here


2.Also you can paste your js code into JavaScript AST visualizer and click "show ast" button, you will see the AST visully.

demo js code:

function foo(d) {   d += 3;     return d+999 } function bar(d) {     return d*100 } 

js ast demo

like image 193
cuixiping Avatar answered Sep 18 '22 15:09

cuixiping