JavaScript Beautifier i formater online
Błyskawicznie formatuj, cofaj minifikację i czyść niechlujne lub skompresowane pliki JavaScript (.js / .min.js) w czasie rzeczywistym. Nasz formatyzator JS obsługujący tokeny dokładnie obsługuje funkcje strzałkowe ES6+, literały szablonów, wyrażenia regularne, pętle for, adresy URL https:// i wywołania metod łańcuchowych — i zawiera JS Minifier do kompaktowego kodu produkcyjnego uruchamianego jednym kliknięciem.
Jak upiększyć i zminimalizować JavaScript online
- Wklej swój kod: Wklej skompresowany pakiet
.min.jslub niesformatowany skrypt do edytora Input JavaScript po lewej stronie lub kliknij Load Sample, aby przetestować funkcje ES6+. - Wybierz szybkie Preset lub dostosuj opcje: Kliknij 2 Spacje (standardowe), 4 Spaces, Allman + Chain Break lub Minify (.min.js) lub dostosuj rozmieszczenie nawiasów klamrowych, odstępy warunkowe i usuwanie komentarzy w panelu po prawej stronie.
- Przegląd w czasie rzeczywistym: Sformatowane dane wyjściowe oraz liczniki znaków/linii/bloków aktualizują się automatycznie podczas pisania lub przełączania ustawień.
- Kopiuj lub pobierz: Kliknij Kopiuj clipboard lub Pobierz .js, aby zapisać
script.beautified.js(lubscript.min.js).
Wyjaśnienie opcji formatowania JavaScript
| Opcja | Co kontroluje | Przed | po |
|---|---|---|---|
| Steamersy tej samej linii (K&R) | Umieszcza otwarcie { w linii nagłówka (zaznaczone) lub w nowej linii w stylu Allmana (niezaznaczone). |
if(ok){uruchom();}else{stop();} |
if (ok) { |
| Odstęp przed warunkowym | Określa, czy pomiędzy if, for, while, switch, catch i (. |
for(let i=0;i<5;i++) |
for (niech i = 0; i < 5; i++) |
| Metody łańcucha przerwania | Dzieli łańcuchy metod płynnych (.filter().map().sort()) wzdłuż wciętych linii. |
items.filter(fn).map(fn).sort(); |
items.filter(fn) |
| Usuń komentarze | Usuwa komentarze // i /* */, pozostawiając https:// ciągi znaków i wyrażenia regularne nietknięte. |
const u = "https://a.com"; //url |
const u = "https://a.com"; |
Dlaczego warto używać formatera JavaScript obsługującego tokeny?
Formatowanie JavaScript za pomocą prostych reguł zastępowania tekstu często uszkadza prawidłowy kod, ponieważ znaki takie jak /, ; i { oznaczają różne rzeczy w zależności od kontekstu. Nasz formatyzator korzysta z dedykowanego tokenizera leksykalnego JavaScript, który rozumie:
- Stringi i literały szablonu ES6: Pojedyncze cudzysłowy (
'...'), podwójne cudzysłowy ("..."), ciągi szablonów backtick (`Hello ${name}`) i ukośniki odwrotne ze zmianą znaczenia ("C:\\Users\\") są zachowywane dosłownie. - Wyrażenia regularne a dzielenie: Odróżnia literały regex, takie jak
/^user_[0-9]+;?/iod wyrażeń dzielenia, takich jak(a + b) / 2, więc średniki lub ukośniki wewnątrz regex nigdy nie dzielą linii. for (...)Nagłówki pętli: Średniki wewnątrzfor (niech i = 0; i < n; i++)pozostają w tej samej linii nagłówka zamiast dzielić się na trzy oddzielne linie.- Bezpieczne usuwanie komentarzy: Jednowierszowe
//i wielowierszowe/* */Komentarze są tokenizowane osobno, więc adresy URL takie jak"https://api.example.com"nigdy nie są obcinane podczas usuwania komentarzy.
Często zadawane pytania
Jak cofnąć minifikację pliku .min.js online?
Wklej skompresowany kod .min.js do edytora Input JavaScript po lewej stronie. Tokenizer automatycznie rozwija instrukcje, bloki, funkcje i pętle za pomocą przejrzystych, wielowierszowych wcięć w czasie rzeczywistym.
Czy usuwanie komentarzy wpływa na adresy URL https:// lub literały regex w moim JavaScript?
Nie. Ponieważ nasz program formatujący używa tokenizatora leksykalnego zamiast naiwnego wyrażenia regularnego, // i /* */ wewnątrz ciągów w pojedynczym cudzysłowie, w podwójnych cudzysłowach, literałów szablonowych i wyrażeń regularnych (/pattern/g) nigdy nie są usuwane ani modyfikowane.
Jaka jest różnica pomiędzy klamrami K&R (ta sama linia) i Allman (nowa linia)?
Styl K&R umieszcza otwierający nawias klamrowy { w tej samej linii, co funkcja , if lub nagłówek pętli (standard w większości przewodników stylu JavaScript). Odznaczenie Nawiasy klamrowe tej samej linii przełącza na styl Allmana, umieszczając nawias otwierający na własnej nowej linii, wyrównanej z nawiasem zamykającym.
Czy za pomocą tego narzędzia mogę także wykonać minify JavaScript?
Tak. Kliknij przycisk Minify JS (lub wybierz opcję Minify (Single-Line .min.js) w panelu ustawień), aby usunąć komentarze i niepotrzebne białe znaki, zachowując jednocześnie wymagane spacje na słowa kluczowe.
Czy mój kod JavaScript został przesłany na jakiś serwer?
Nie. Całe formatowanie i minifikacja JavaScript odbywa się w 100% lokalnie w przeglądarce. Twój kod źródłowy nigdy nie opuszcza Twojego urządzenia.