UTILS.
100% nel browser
🎨

Beautifier / Formattatore JavaScript

Formatta JavaScript e JSON minificati o disordinati con indentazione, spaziatura e interruzioni di riga coerenti — un formattatore scritto a mano che gira interamente nel browser.

— l'output appare qui —

Informazioni su questo strumento

Il Beautifier JavaScript riformatta JavaScript e JSON minificati, su una sola riga o indentati in modo incoerente in codice sorgente pulito e leggibile con indentazione e spaziatura uniformi. È utile per leggere una libreria in bundle, riordinare uno snippet copiato o ispezionare un blob JSON. Tutto avviene nel tuo browser — il codice viene solo riformattato come testo, mai eseguito, quindi non c'è alcun eval, alcun new Function e nulla viene caricato.

Il formattatore è un tokenizzatore scritto a mano, non un trucco con regex: analizza il sorgente in token saltando correttamente l'interno di stringhe, template literal, espressioni regolari e commenti su riga/blocco, così virgolette e barre al loro interno non vengono mai scambiate per struttura. Un classico euristico di lookbehind distingue un operatore di divisione da un literal di espressione regolare. Il flusso di token viene poi riemesso con a capo dopo '{', '[' e ';', righe dedentate prima di '}' e ']', un elemento per riga all'interno di literal di oggetti e array, e un singolo spazio attorno agli operatori e dopo le parole chiave.

Scegli un'indentazione di 2 spazi, 4 spazi o un tab, e uno stile di parentesi graffa: collassa mantiene la graffa di apertura sulla stessa riga (K&R / 1TBS), mentre espandi la sposta su una riga propria (Allman). Poiché lo strumento preserva byte per byte il contenuto di stringhe e regex, il codice riformattato è semanticamente identico all'input. Copia il risultato direttamente nel tuo editor.

Domande frequenti

Esegue o valuta il mio codice?
No. Il beautifier tokenizza soltanto e riemette il tuo sorgente come testo. Non chiama mai eval o new Function e non esegue mai il codice, quindi incollare JavaScript non attendibile o proprietario è sicuro. Tutto il lavoro rimane nel tuo browser.
Funziona anche su JSON?
Sì. JSON è un sottoinsieme della sintassi JavaScript, quindi incollare un oggetto o array JSON minificato lo riorganizza in una forma indentata, con una chiave per riga. Stringhe, numeri e strutture annidate vengono formattati allo stesso modo che in JavaScript.
Qual è la differenza tra gli stili di parentesi graffa?
Collassa (K&R / 1TBS) mantiene la graffa di apertura sulla stessa riga dell'istruzione, ad esempio 'if (x) {'. Espandi (Allman) mette la graffa di apertura su una riga propria sotto l'istruzione. Entrambi producono codice identico e valido — cambia solo il layout.
Cambierà ciò che fa il mio codice?
No. Cambiano solo spazi bianchi, indentazione e interruzioni di riga. Il contenuto di stringhe, template literal ed espressioni regolari viene preservato esattamente, quindi l'output riformattato è funzionalmente identico al sorgente originale.

Altri strumenti