JavaScript-formatter
Laat een script inspringen zodat je het kunt lezen, volledig in je browser. Een regeleinde dat jij hebt geschreven wordt nooit verwijderd.
Draait volledig in je browser. Er wordt niets geüpload, gelogd of opgeslagen.
Plak een geminificeerd of slecht ingesprongen script en lees het zoals het hoort. De opmaak gebeurt in je browser, en aan de code verandert niets behalve de witruimte.
Hoe het werkt
Het script wordt in stukken gesplitst — commentaar, strings, template literals, reguliere expressies, getallen, namen, operatoren, haakjes en accolades — en daarna opnieuw geschreven. Een blok krijgt eigen regels en één niveau inspringing, een statement krijgt een regel, en een objectliteral die over meerdere regels loopt krijgt één item per regel.
Een regeleinde dat jij hebt geschreven wordt nooit verwijderd, en dat is de regel waaruit al het andere volgt. In JavaScript kan het einde van een regel een statement beëindigen — automatische puntkomma-invoeging — dus twee regels samenvoegen kan veranderen wat een programma doet, of verhinderen dat het geparseerd wordt. Regeleinden worden alleen toegevoegd: rond de accolades van een blok, na de puntkomma van een statement, tussen de items van een object en tussen een sluitende accolade en het woord waarmee het volgende statement begint. Geen daarvan kan een betekenis veranderen.
Een regel die de broncode midden in een statement heeft afgebroken — een reeks aanroepen, een lange voorwaarde, de takken van een conditionele expressie — springt één niveau in ten opzichte van de regel erboven, zodat hij als deel daarvan blijft lezen.
Voorbeelden
| Geval | Invoer | Resultaat |
|---|---|---|
| Een functie op één regel geschreven | function add(a,b){const total=a+b;return total} | function add(a, b) { const total = a + b; return total } |
Veelgestelde vragen
Wordt mijn code ergens naartoe gestuurd?
Nee. De formatter is JavaScript dat op deze pagina draait. Er wordt niets geüpload, niets gelogd en niets opgeslagen: je kunt de netwerkverbinding verbreken en de tool blijft werken.
Voegt hij de puntkomma's toe die ik ben vergeten?
Nee. Een puntkomma die niet geschreven is, is soms een puntkomma die niet geschreven moet worden, en die gevallen onderscheiden vraagt om een parser en niet om een opmaakronde. De formatter laat die kwestie met rust: hij voegt nooit een puntkomma toe en verwijdert nooit een regeleinde, dus code die zonder puntkomma's is geschreven blijft precies hetzelfde werken.
Minificeert hij ook?
Nee, en dat is een keuze en geen vergeetachtigheid. Minificeren betekent hernoemen, herschrijven en beslissen welke regeleinden betekenis hebben: drie oordelen die deze tool juist bestaat om niet te vellen. Vergis je je in een ervan, dan breekt een programma op een manier die je pas in productie merkt.
Begrijpt hij TypeScript of JSX?
Gedeeltelijk, en eerlijk gezegd. Beide worden gelezen als de tokens die ze zijn, dus er gaat niets verloren en haakjes en accolades blijven netjes genest, maar een type-annotatie en een tag zijn geen dingen waarvan de opmaak de vorm kent. Verwacht een redelijk resultaat, niet een idiomatisch.
Vertelt hij me of mijn script geldig is?
Nee. Hij heeft geen grammatica, dus dat kan hij niet: hij weet waar een stuk code ophoudt en het volgende begint, en dat is genoeg om een bestand op te maken en niet genoeg om het te beoordelen. Een bestand dat hij helemaal niet kan lezen — een string, commentaar of template literal die niet wordt afgesloten — wordt geweigerd in plaats van omgevormd tot iets wat er aannemelijk uitziet.
Goed om te weten
- De uitvoer bevat precies de stukken die de invoer bevatte. Er wordt niets toegevoegd, niets weggehaald en niets herschikt: alleen de witruimte ertussen verschuift.
- Een schuine streep is ofwel een deling ofwel het begin van een reguliere expressie, en geen tokenizer kan zonder grammatica zeker weten welke. Deze beslist op basis van het vorige token, en leest een literal die over een regeleinde zou moeten lopen als deling, want een reguliere expressie kan er geen bevatten. Een verkeerde gok kost netheid en verder niets, want alle stukken worden gekopieerd zoals ze geschreven zijn.
- Een template literal komt teken voor teken terug, van backtick tot backtick. De witruimte erin is de tekst die je pagina zal tonen, dus daar mag de formatter niet aankomen.
- De opmaak is deterministisch: hetzelfde script met dezelfde optie geeft altijd dezelfde uitvoer, en een al opgemaakt script opnieuw opmaken verandert niets.