Invoer

Uitvoer

Wat is de JavaScript Formatter?

JavaScript drijft het web aan. Geminificeerde of rommelige JS is moeilijk te lezen en debuggen. De JavaScript Formatter voegt inspringing en regeleinden toe aan ruwe of geminificeerde code. De ECMAScript-specificatie definieert de taal.

Deze tool draait volledig in uw browser. Er wordt niets naar een server gestuurd. Plak JS of upload een bestand; ontvang geformatteerde uitvoer. Gebruik Minificeren voor productiebundels. Voor validatie, gebruik de JavaScript Validator. Alleen minificeren, gebruik de JavaScript Minifier.

Hoe deze tool te gebruiken

1

Plakken of uploaden

Plak JavaScript in het linkerpaneel of upload een .js- of .txt-bestand. Gebruik Voorbeeld om voorbeeldcode te laden. Gebruik Wissen om te resetten.

2

Controleer de uitvoer

Het rechterpaneel wordt automatisch bijgewerkt met geformatteerde code. Gebruik Minificeren voor een compacte versie voor productie.

3

Kopiëren of downloaden

Gebruik Kopiëren of Downloaden voor het resultaat. Voor JSX/React, gebruik de JSX Formatter. Voor TypeScript-conversie, gebruik JavaScript naar TypeScript.

JavaScript-opmaakvoorbeelden

Hier is een voorbeeld van het formatteren van geminificeerde JavaScript-code.

Voorbeeld: Abonneeplan-opzoekfunctie

Geminificeerde invoer:

Invoer

Geformatteerde uitvoer:

Uitvoer

Wanneer de JavaScript Formatter helpt

Bij het debuggen van geminificeerde code, het bekijken van bundles van webpack of rollup, of leren van productiescripts, maakt formatteren de structuur zichtbaar. Ideaal voor stack traces, code van derden en snelle leesbaarheidscontroles. De ECMAScript-specificatie definieert de taal. Voor obfuscated code, gebruik eerst de JavaScript Deobfuscator.

Veelgestelde vragen

Zijn mijn gegevens privé?

Ja. Formatteren vindt volledig plaats in uw browser. Geen gegevens worden naar een server gestuurd.

Formatter vs Minifier?

Formatter voegt inspringing toe voor leesbaarheid. Minifier verwijdert witruimte en opmerkingen voor kleinere bestandsgrootte. Deze tool kan beide.

Ondersteunt het ES6+?

Ja. Moderne JavaScript-syntax (pijlfuncties, classes, async/await) wordt ondersteund.

En JSX?

Voor JSX- en React-code, gebruik de JSX Formatter.

Kan het syntaxfouten repareren?

Nee. Ongeldige JavaScript toont een fout. Gebruik de JavaScript Validator om eerst de syntax te controleren.

Gerelateerde tools

Meer info: ECMAScript, MDN JavaScript, webpack, rollup, source maps, Vite, TypeScript.