Esploratur AST tal-JavaScript
Waħħal JavaScript u esplora s-siġra sintattika astratta tiegħu (ESTree, bl-Acorn) fil-brawżer tiegħek. Ikklikkja n-nodi u esporta l-AST bħala JSON.
- Nodi
- –
- Fond massimu
- –
- Istruzzjonijiet ta’ livell għoli
- –
Ikklikkja fuq nodu biex tagħżel il-kodiċi tiegħu. Ikklikkja jew mexxi l-kursur fil-kodiċi biex issib in-nodu tiegħu.
Agħżel nodu fis-siġra jew ikklikkja fil-kodiċi.
- Tip
- Proprjetà
- Firxa (offsets tal-karattri)
- Pożizzjoni
- Proprjetajiet
- Sors tan-nodu
JSON ESTree
Kif tesplora AST tal-JavaScript
- Waħħal il-kodiċi tiegħek f’Kodiċi JavaScript, jew ikklikkja Tella’ l-eżempju biex tibda minn modulu żgħir.
- Agħżel it-Tip ta’ sors: Modulu (import/export, modalità strett) għall-moduli ES, jew Script (klassiku) għal scripts ordinarji li jistgħu jużaw karatteristiċi tal-modalità mhux stretta bħal
with. - Is-siġra tiġi aġġornata mument wara li twaqqaf tikteb. Ikklikkja Analizza biex tħaddimha minnufih.
- Fis-Siġra sintattika, ikklikkja fuq il-vleġġa żgħira biex tiftaħ jew tagħlaq nodu. Ikklikkja fuq isem nodu biex tagħżel il-kodiċi korrispondenti fl-editur: il-pannell Nodu magħżul juri t-tip tiegħu, il-Proprjetà li jappartjeni lilha, il-Firxa (offsets tal-karattri), il-linja u l-kolonna, il-proprjetajiet sempliċi tiegħu (isem, operatur, valur mhux ipproċessat…) u t-test tas-sors tiegħu.
- Jaħdem ukoll bil-maqlub: ikklikkja kullimkien fil-kodiċi, mexxi l-kursur bil-keyboard jew agħżel biċċa kodiċi, u n-nodu l-aktar fond li jinkludiha jinfetaħ u jiġi enfasizzat fis-siġra.
- Iftaħ JSON ESTree biex tara s-siġra kollha bħala JSON, bi jew mingħajr Inkludi l-pożizzjonijiet (start, end, loc), imbagħad Ikkopja jew Niżżel JSON.
Il-kontaturi juru n-numru ta’ Nodi, il-Fond massimu tas-siġra u n-numru ta’ Istruzzjonijiet ta’ livell għoli.
X’inhi siġra sintattika astratta?
Qabel ma magna tal-JavaScript, linter jew bundler ikunu jistgħu jagħmlu xi ħaġa bil-kodiċi tiegħek, huma janalizzaw it-test f’siġra ta’ nodi. Kull nodu għandu type (VariableDeclaration, CallExpression, Identifier…) u nodi tfal maħżunin fi proprjetajiet bl-isem. Għal total += size; tikseb ExpressionStatement li l-expression tiegħu hija AssignmentExpression bl-operatur +=, identifikatur left total u identifikatur right size. Il-parentesi, is-semikolons u l-kummenti jisparixxu: is-siġra żżomm biss l-istruttura li jkollha importanza, u għalhekk jissejjaħ astratt.
Din l-għodda tuża l-Acorn, il-parser żgħir u veloċi wara ħafna għodod tal-JavaScript, b’ecmaVersion: "latest". L-output isegwi l-ESTree, il-format komuni li jipproduċi wkoll l-Espree (ESLint) u li jifhmu l-biċċa l-kbira tal-għodod tat-trasformazzjoni tal-kodiċi. Li tkun taf it-tipi eżatti tan-nodi huwa essenzjali meta tikteb regola ESLint, codemod tal-Babel jew tal-jscodeshift, plugin tal-Prettier jew kwalunkwe script li janalizza l-kodiċi.
Pożizzjonijiet, firxiet u esportazzjoni JSON
Kull nodu għandu start u end, l-offsets tal-ewwel karattru u tal-aħħar karattru plus wieħed fis-sors, u oġġett loc bil-linji (mill-1) u l-kolonni. Fil-JSON, il-kolonni jibdew minn 0 bħal fl-output tal-Acorn; il-pannell Nodu magħżul juri l-kolonni mill-1, bħal ħafna editors. Neħħi l-marka minn Inkludi l-pożizzjonijiet (start, end, loc) biex tikseb JSON eħfef li huwa aktar faċli tqabbel bejn żewġ verżjonijiet tal-kodiċi.
Xi valuri ma jistgħux jinkitbu bħala JSON: l-literals tal-espressjonijiet regolari jieħdu "value": null (il-proprjetà regex tagħhom iżżomm il-mudell u l-flags) u l-literals BigInt jinkitbu bħala strings, kif tirrakkomanda l-ispeċifikazzjoni ESTree.
Limiti u privatezza
Il-kodiċi jiġi analizzat fil-brawżer tiegħek u qatt ma jiġi esegwit jew mibgħut x’imkien: il-parser jaqra biss it-test. L-input huwa limitat għal miljun karattru. Is-siġar kbar ħafna jitfasslu fuq talba, lott ta’ tfal kull darba, u JSON kbir wisq biex jidher minn qabel xorta jista’ jitniżżel. JSX u TypeScript mhumiex JavaScript standard, għalhekk l-Acorn jirrapporthom bħala żbalji tas-sintassi.
Mistoqsijiet frekwenti
Għaliex nieħu “Żball tas-sintassi fil-linja 1, kolonna 1”?
Il-kodiċi mhuwiex JavaScript validu għat-tip ta’ sors magħżul. Il-messaġġ jagħti l-linja, il-kolonna u l-ispjegazzjoni tal-Acorn. Kawża komuni hija import jew export meta jkun magħżul Script (klassiku), jew annotazzjonijiet TypeScript u JSX, li l-Acorn ma janalizzax.
X’inhi d-differenza bejn Modulu u Script?
Il-moduli dejjem huma f’modalità strett, jippermettu import, export u await ta’ livell għoli, u jipprojbixxu with jew literals ottali. L-scripts huma l-modalità klassika ta’ <script>. Is-siġra tirreġistra l-għażla wkoll fil-proprjetà sourceType tan-nodu Program.
Il-kodiċi jiġi esegwit?
Le. L-analiżi sempliċement tbiddel it-test f’struttura ta’ data. Xejn ma jiġi evalwat, ebda funzjoni ma tissejjaħ u ma ssir ebda talba tan-netwerk, għalhekk huwa sigur li tispezzjona kodiċi li ma tafdax jew saħansitra malizzjuż.
Il-kummenti jidhru fis-siġra?
Le. L-ESTree ma jwaħħalx il-kummenti man-nodi, għalhekk mhumiex parti mis-siġra, imma xorta tista’ tarahom fit-test tas-sors tan-nodu fil-pannell Nodu magħżul.
Liema verżjoni tal-JavaScript hija appoġġjata?
L-Acorn huwa impostat fuq l-aħħar verżjoni tal-ECMAScript li jaf, li tinkludi optional chaining, nullish coalescing, BigInt, class fields u metodi privati, await ta’ livell għoli, flags tal-espressjonijiet regolari bħal v, u sintassi reċenti oħra.
Għodod relatati
- Formatter u minifier tal-JavaScript Ibbewtifika JavaScript minimizzat, minimizzah bit-Terser, jew iċċekkja s-sintassi tiegħu bil-linja u l-kolonna eżatta ta’ kull żball. Jaħdem lokalment.
- Dijagramma Railroad tar-Regex Ibdel espressjoni regolari JavaScript f’dijagramma railroad ċara b’gruppi, alternattivi, loops u lookarounds, imbagħad esportaha bħala SVG jew PNG.
- Formatter u validatur tal-JSON Formatter u validatur tal-JSON b’xejn li jibbewtifika, jimminimizza u jiċċekkja l-JSON fil-brawżer tiegħek, b’żbalji tas-sintassi bil-linja u l-kolonna.