JavascriptのASTについて
Abstract Syntax Treein Javascript
View Slide
Name@brn (ꫬꅿ⨳ⵃ)Occupationؿٗٝزؒٝسؒٝآص،٥ط؎ذ؍ـؒٝآص،CompanyCyberagent ،سذؙأةآؔ AI MessengerOSSContributor of V8Bloghttp://abcdef.gets.b6n.ch/Twitterhttps://twitter.com/brn227GitHubhttps://github.com/brn
What is AST?ASTהכJavascriptךفؚٗٓيػ٦أ׃穠卓欰䧭ׁ圓俑邌植׃加圓鸡ךֿה
if (x) {x = 100}
IFCONDITIONTHENBLOCKEXPRESSIONSTATEMENTASSIGNVAR PROXY (X) LITERAL (100)if(x){x = 100
Why need it?فؚٗٓيך㶵ךתת⢪ֲךכꨇ׃ְկjavascript㹋遤ׅחכ圫ղזؿؑ٦ؤָ֮կغ؎ز؝٦س欰䧭ծCFG欰䧭ծIR欰䧭ծ剑黝⻉ծetc…
How do I create it?فؚٗٓىؚٝ鎉铂חכ㛇劤涸חכ俑岀ָ㶷㖈ׅկJavascriptכEcmaInternationalָ➬圫תהגⰕ׃גְկ
Grammarsך⚥ח俑岀ָ㹀纏ׁגְل٦آָ֮ךדֿ撑ֿׅהדػ٦؟٦剅ֻֿהָדֹկ
But…ֿך俑岀㹀纏כ㛇劤涸חךתת⢪ֲךכꨇ׃ְկ
Javascript become too complexJavascriptך俑岀כַז醱꧟חזגֹגֶծ秪磏חךתתػ٦أֿׅהַָזꨇ׃ְկ
var a = /aaa|bbb/!b / 2 = 0;!!// Is it easy?!b = / 2 = 0 /!ת׆כ剣せז姻鋉邌植ַ
var a = (x, y) => x + y;!var a = (x, y);!!var a = x => x;!var a = x;!،ٗ٦ꟼ侧
var {a: b, b: c} = {b: 1, c: 2};!({a: b, b: c});!![a, b, c] = [0, 1, 2];![a, b, c];!ⴓⶴ➿Ⰵ
Parser has many state穠㽷Parserכ㣐ꆀך朐䡾⥂䭯׃זָ갹䓸גػ٦أׅ׃ַזְկ
AST Usage蕱⸤׃ג⡲♳־ASTכוֲ⢪גְךַ
In V8ASTַScope欰䧭׃ׁׅח剑穄涸חBytecode欰䧭׃ג㹋遤ׅYieldװAsync٥Awaitך圓俑JavascriptךStateMachineח㢌䳔ׅ
In BabelAST㢌䳔׃ג剑倜ךJavascriptַ植㖈ךJavascriptפ㢌䳔ׅ
In istanbulAST㢌䳔׃גぐ؝٦سח鸐麓׃⽩➰ֽ؝٦س㙵鴥
Try and play ASTEsprima⢪ֲֿהד知⽃חAST欰䧭ֿׅהָדֹתhttps://github.com/estoolsחػ٦أ׃ASTQuery׃ׅخ٦ָٕ尶㿊֮ךד鑐׃גה葺ְ
SummaryAST鍗ה鸐䌢ךفؚٗٓيדכꨇ׃ַֿהָ葿ղדֹ״ֲחז嚂׃ְךד僽ꬊ♧㔐ְֻכ鑐׃גהְְה䙼ֲ