Formattatore di Codice Gratuito: Abbellisci JavaScript, Python, HTML e Altro

Che cos'è un formattatore di codice?

Un formattatore di codice è uno strumento che riscrive il codice sorgente con rientri, interruzioni di riga e spaziatura uniformi, senza modificarne il funzionamento. Questo formattatore di codice viene eseguito in un browser web. Supporta 12 linguaggi di programmazione, tra cui JavaScript, Python, HTML e CSS.

Come funziona questo formattatore di codice

Lo strumento usa un insieme diverso di regole per ogni linguaggio. Nessuno di questi costruisce un albero sintattico completo del codice, tranne JSON.

JSON viene analizzato con il parser JSON integrato nel browser e poi riscritto con un rientro di due spazi. Se il JSON non è valido, lo strumento segnala un errore e non mostra alcun risultato.
JavaScript, TypeScript, Java, C, C++ e C# condividono lo stesso formattatore. Il codice viene analizzato carattere per carattere, tenendo traccia di parentesi graffe, parentesi tonde e punti e virgola. Ogni { avvia un nuovo blocco rientrato, mentre ogni } o ; termina una riga. I commenti e le stringhe tra virgolette vengono copiati senza modifiche. Questo formattatore non aggiunge spazi intorno agli operatori o dopo le virgole che mancavano nel codice originale: ricostruisce solo le interruzioni di riga e i rientri.
Python legge il rientro già presente in ogni riga e lo ricostruisce con quattro spazi per livello, secondo le stesse regole di annidamento usate dal linguaggio Python. Non divide le righe lunghe, non aggiunge righe vuote e non inserisce spazi attorno agli operatori: normalizza soltanto la profondità del rientro di ogni riga.
CSS rimuove le interruzioni di riga e gli spazi vuoti superflui, quindi inserisce un'interruzione di riga dopo ogni { e ; e prima di ogni }.
HTML e XML inseriscono un'interruzione di riga e due spazi di rientro per ogni livello di tag annidati, riconoscendo tag standard autochiudenti come <br>, <img> e <input>.
SQL converte in maiuscolo un insieme fisso di parole chiave, come SELECT, FROM, WHERE, JOIN e ORDER BY, e inizia una nuova riga prima di ogni clausola principale.

Poiché solo il percorso JSON analizza effettivamente l'input, nessuno degli altri formattatori rileva errori di sintassi come una parentesi mancante o una stringa non chiusa. Riformattano qualunque testo venga fornito, anche se non sarebbe eseguibile.

Linguaggi supportati

Linguaggio	Estensione di file tipica	Larghezza del rientro
JavaScript	.js	2 spazi
TypeScript	.ts	2 spazi
HTML	.html	2 spazi
CSS	.css	2 spazi
Python	.py	4 spazi
Java	.java	4 spazi
C	.c	4 spazi
C++	.cpp	4 spazi
C#	.cs	4 spazi
SQL	.sql	interruzioni di riga per clausola
JSON	.json	2 spazi
XML	.xml	2 spazi

Come formattare il codice

Selezionare un linguaggio di programmazione dal menu a discesa.
Incollare il codice non formattato nella casella di input.
Selezionare «Formatta codice».
Copiare il risultato formattato dalla casella di output.

La formattazione avviene interamente nel browser. Il codice non viene mai inviato a un server.

Esempio di formattazione JavaScript

Prima della formattazione:

1function add(a, b) {
2    if (a > 0) { return a + b; }
3    return 0;
4}
5

Dopo la formattazione:

1function add(a, b) {
2  if (a > 0) {
3    return a + b;
4  }
5  return 0;
6}
7

Il formattatore ha spostato il codice contenuto in { } su una propria riga rientrata e ha normalizzato il rientro a due spazi per livello. Ha lasciato esattamente com'erano gli spazi intorno a a > 0 e a + b, perché erano già presenti.

Esempio di formattazione Python

Prima della formattazione:

1def calculate_average(numbers):
2  if len(numbers) == 0:
3    return 0
4  total = sum(numbers)
5  return total / len(numbers)
6

Dopo la formattazione:

1def calculate_average(numbers):
2    if len(numbers) == 0:
3        return 0
4    total = sum(numbers)
5    return total / len(numbers)
6

Il codice originale usava due spazi per ogni livello di rientro. Il formattatore ha ricostruito il rientro di ogni riga con quattro spazi per livello, in linea con i quattro spazi per livello di rientro indicati nella PEP 8, la guida di stile ufficiale di Python. Ha mantenuto ogni riga nello stesso ordine e non ha toccato la spaziatura all'interno delle righe.

Perché è importante formattare il codice

Un rientro incoerente rende più difficile vedere dove termina una funzione, un ciclo o una condizione. Il codice modificato da più persone spesso finisce per avere una combinazione di rientri con tabulazioni e spazi, oppure righe che non si allineano al blocco di appartenenza. Passarlo attraverso un formattatore dà a ogni file la stessa struttura visiva, rendendo più rapida la consultazione e più facile individuare una parentesi fuori posto.

Limitazioni

Dimensione dell'input: lo strumento accetta fino a 50.000 caratteri di codice. Un input più lungo viene rifiutato con un messaggio di errore prima dell'inizio della formattazione.
Nessun controllo della sintassi per la maggior parte dei linguaggi: solo l'input JSON viene analizzato e convalidato. Il codice negli altri 11 linguaggi viene riformattato così com'è, anche se contiene una parentesi mancante o una stringa non chiusa. In questo caso il risultato potrebbe avere rientri errati invece di essere segnalato come errore.
Nessuna modifica alla spaziatura degli operatori: i formattatori per JavaScript, TypeScript e i linguaggi della famiglia C riorganizzano solo le interruzioni di riga e i rientri. Non inseriscono uno spazio intorno a +, =, !== o dopo una virgola se non era già presente.
PHP non è supportato: la selezione di un linguaggio non supportato restituisce il codice senza modifiche.

Domande frequenti

Questo strumento controlla il codice per individuare errori di sintassi? Solo per JSON. L'input JSON viene analizzato, quindi un JSON non valido produce un messaggio di errore. Il codice negli altri linguaggi supportati viene riformattato senza verificarne la validità sintattica.

Invia il mio codice a un server? No. La formattazione viene eseguita interamente nel browser usando JavaScript. Il codice non viene caricato né memorizzato in alcun luogo.

Qual è la quantità massima di codice che può formattare? 50.000 caratteri. Incollarne di più produce un errore prima dell'inizio della formattazione.

Aggiungerà gli spazi mancanti intorno agli operatori o dopo le virgole? No, per JavaScript, TypeScript, Java, C, C++ e C#. Questi formattatori ricostruiscono solo i rientri e le interruzioni di riga intorno a parentesi graffe e punti e virgola; copiano il resto di ogni riga così come è stato scritto.

Quale rientro utilizza? Due spazi per JavaScript, TypeScript, HTML, CSS, JSON e XML. Quattro spazi per Python, Java, C, C++ e C#.

Perché il mio codice appare quasi uguale dopo la formattazione? Se l'input usava già una spaziatura coerente e un solo stile di parentesi, il formattatore ricostruisce soprattutto i rientri, quindi il cambiamento può essere minimo. È più utile con codice che presenta rientri misti o che è stato minimizzato su pochissime righe.

Riferimenti

MDN Web Docs (Mozilla). JSON.stringify(). Riferimento di JSON.stringify() — un argomento numerico space imposta il numero di spazi usati per ogni livello di rientro.
Python Software Foundation. The Python Language Reference: Lexical analysis. Analisi lessicale di Python: il rientro — gli spazi iniziali stabiliscono il livello di rientro di ogni riga, che raggruppa le istruzioni.
Python Software Foundation. PEP 8: Style Guide for Python Code. PEP 8 — "Use 4 spaces per indentation level."

Formattatore di Codice Gratuito: Abbellisci JavaScript, Python, HTML e Altro