Eksplorues AST për JavaScript

Si ta eksplorosh AST-në e një kodi JavaScript

1. Ngjit kodin te Kod JavaScript ose kliko Ngarko shembullin për të nisur nga një modul i vogël.
2. Zgjidh Llojin e burimit: Modul (import/export, modalitet strikt) për modulet ES, ose Skript (klasik) për skriptet e zakonshme që mund të përdorin veçori të modalitetit të lirshëm, si with.
3. Pema përditësohet pak pasi të ndalosh së shkruari. Kliko Analizo për ta nisur menjëherë.
4. Te Pema e sintaksës, kliko shigjetën e vogël për të hapur ose mbyllur një nyje. Kliko emrin e një nyjeje për të përzgjedhur kodin përkatës në editor; paneli Nyja e përzgjedhur tregon llojin, vetinë së cilës i përket, intervalin e karaktereve, rreshtin dhe kolonën, vetitë e thjeshta (emri, operatori, vlera origjinale…) dhe tekstin burimor.
5. Funksionon edhe në drejtimin e kundërt: kliko kudo në kod, lëviz kursorin me tastierë ose përzgjidh një pjesë kodi, dhe nyja më e thellë që e përmban hapet dhe theksohet në pemë.
6. Hap JSON ESTree për të parë pemën e plotë si JSON, me ose pa Përfshi pozicionet (start, end, loc), pastaj Kopjo-je ose Shkarko JSON.

Numëruesit tregojnë numrin e Nyjeve, Thellësinë maksimale të pemës dhe numrin e Instruksioneve të nivelit të lartë.

Çfarë është një pemë e sintaksës abstrakte?

Para se një motor JavaScript, një linter ose një bundler të bëjë çfarëdo me kodin tënd, ai e analizon tekstin në një pemë nyjesh. Çdo nyje ka një type (VariableDeclaration, CallExpression, Identifier…) dhe nyje fëmijë të ruajtura në veti me emër. Për total += size; merr një ExpressionStatement me expression një AssignmentExpression me operatorin +=, një identifikues left me emrin total dhe një identifikues right me emrin size. Kllapat, pikëpresjet dhe komentet zhduken: pema ruan vetëm strukturën që ka rëndësi, prandaj quhet abstrakte.

Ky mjet përdor Acorn, analizuesin e vogël dhe të shpejtë që qëndron pas shumë mjeteve JavaScript, me ecmaVersion: "latest". Rezultati ndjek ESTree, formatin e përbashkët që prodhohet edhe nga Espree (ESLint) dhe që kuptohet nga shumica e mjeteve të transformimit të kodit. Njohja e llojeve të sakta të nyjeve është thelbësore kur shkruan një rregull ESLint, një codemod për Babel ose jscodeshift, një shtesë për Prettier ose çdo skript që analizon kod.

Pozicionet, intervalet dhe eksporti JSON

Çdo nyje ka start dhe end, zhvendosjet e karakterit të parë dhe të karakterit pas të fundit në burim, si dhe një objekt loc me rreshta (që nga 1) dhe kolona. Në JSON, kolonat fillojnë nga 0, si në daljen e Acorn; paneli Nyja e përzgjedhur i shfaq nga 1, si shumica e editorëve. Hiq shenjën te Përfshi pozicionet (start, end, loc) për të marrë një JSON më të lehtë, më të përshtatshëm për krahasim mes dy versioneve të kodit.

Disa vlera nuk mund të shkruhen në JSON: shprehjet e rregullta kanë "value": null (vetia regex ruan modelin dhe flamujt), ndërsa literalet BigInt shkruhen si vargje, siç rekomandon specifikimi ESTree.

Kufijtë dhe privatësia

Kodi analizohet në shfletuesin tënd dhe nuk ekzekutohet kurrë e nuk dërgohet askund: analizuesi vetëm e lexon tekstin. Hyrja kufizohet në një milion karaktere. Pemët shumë të mëdha vizatohen sipas kërkesës, nga një grup fëmijësh në herë, dhe një JSON që është shumë i madh për t’u shfaqur mund të shkarkohet prapë. JSX dhe TypeScript nuk janë JavaScript standard, ndaj Acorn i raporton si gabime sintakse.