JavaScript Beautifier и форматтер онлайн
Мгновенно форматируйте, разминируйте и очищайте беспорядочный или сжатый JavaScript (.js / .min.js) в реальном времени. Наш форматировщик JS с поддержкой токенов точно обрабатывает стрелочные функции ES6+, шаблонные литералы, регулярные выражения, циклы for, URL-адреса https:// и вызовы связанных методов, а также включает JS Minifier, запускаемый одним щелчком мыши, для компактного производственного кода.
Как украсить и отменить минимизацию JavaScript онлайн
- Вставьте свой код: Вставьте сжатый пакет
.min.jsили неформатированный скрипт в редактор Input JavaScript слева или нажмите Загрузить образец, чтобы протестировать функции ES6+. - Выберите быстрый Preset или настройте параметры: Нажмите 2 Пробела (стандартные), 4 Пробелов, Allman + разрыв цепи или Minify (.min.js) или точная настройка размещения фигурных скобок, условного интервала и удаления комментариев на правой панели.
- Просмотр в реальном времени: Форматированный вывод и счетчики символов/строк/блоков обновляются автоматически по мере ввода или переключения настроек.
- Скопировать или загрузить: Нажмите Копировать в clipboard или Загрузите .js, чтобы сохранить
script.beautified.js(илиscript.min.js).
Объяснение параметров форматирования JavaScript
| Вариант | Что он контролирует | До | После |
|---|---|---|---|
| Однолинейные раскосы (K&R) | Размещает открытие { в строке заголовка (отмечено) или на новой строке в стиле Allman (отмечено не отмечено). |
if(ok){run();}else{stop();} |
if (ок) { |
| Пробел перед условным выражением | Определяет, появляется ли пробел между if, for, while, switch, catch и (. |
for(let i=0;i<5;i++) |
for (пусть i = 0; i < 5; i++) |
| Методы разрыва цепочки | Разбивает цепочки свободных методов (.filter().map().sort()) по строкам с отступом. |
items.filter(fn).map(fn).sort(); |
items.filter(fn) |
| Удалить комментарии | Удаляет комментарии // и /* */, сохраняя при этом строки и регулярные выражения https:// нетронутыми. |
const u = "https://a.com"; // URL |
const u = "https://a.com"; |
Зачем использовать форматтер JavaScript с поддержкой токенов?
Форматирование JavaScript с помощью простых правил замены текста часто нарушает допустимый код, поскольку такие символы, как /, ; и {, означают разные вещи в зависимости от контекста. Наш форматтер использует специальный лексический токенизатор JavaScript, который понимает:
- Strings и литералы шаблонов ES6: Одинарные кавычки (
'...'), двойные кавычки ("..."), строки шаблона обратной кавычки (`Hello ${name}`) и экранированные обратные косые черты. ("C:\\Users\\") сохранены дословно. - Регулярные выражения и разделение: Отличает литералы regex, такие как
/^user_[0-9]+;?/i, от выражений разделения, таких как(a + b) / 2, поэтому точки с запятой или косые черты внутри regex никогда не разделяют строку. for (...)Заголовки циклов: Точки с запятой внутриfor (пусть i = 0; i < n; i++)остаются в одной строке заголовка, а не разбиваются на три отдельные строки.- Безопасное удаление комментариев: Однострочные комментарии
//и многострочные комментарии/* */маркируются отдельно, поэтому URL-адреса типа"https://api.example.com"никогда не обрезаются при удалении комментариев.
Часто задаваемые вопросы
Как отменить минимизацию файла .min.js онлайн?
Вставьте сжатый код .min.js в редактор Input JavaScript слева. Токенизатор автоматически расширяет операторы, блоки, функции и циклы с помощью чистых многострочных отступов в реальном времени.
Влияет ли удаление комментариев на URL-адреса https:// или литералы regex в моем JavaScript?
Нет. Поскольку наш форматтер использует лексический токенизатор, а не простое регулярное выражение, // и /* */ внутри строк с одинарными кавычками, строк с двойными кавычками, литералов шаблонов и регулярных выражений (/pattern/g) никогда не удаляются и не изменяются.
В чем разница между брекетами K&R (той же линии) и брекетами Allman (новой линии)?
Стиль K&R размещает открывающую фигурную скобку { на той же строке, что и function, if или заголовок цикла (стандарт в большинстве руководств по стилю JavaScript). Снятие флажка с Same-line скобки переключается на стиль Allman, размещая открывающую скобку на отдельной новой строке, совмещенной с закрывающей скобкой.
Могу ли я также использовать minify JavaScript с помощью этого инструмента?
Да. Нажмите кнопку Minify JS (или выберите Minify (Single-Line .min.js) на панели настроек), чтобы удалить комментарии и ненужные пробелы, сохранив при этом необходимые пробелы для ключевых слов.
Загружен ли мой код JavaScript на какой-либо сервер?
Нет. Все форматирование и минификация JavaScript выполняются на 100% локально в вашем браузере. Ваш исходный код никогда не покидает ваше устройство.