JavaScript Beautifier y formateador online

Formatee, desminifique y limpie instantáneamente JavaScript desordenado o comprimido (.js / .min.js) en tiempo real. Nuestro formateador JS con reconocimiento de token maneja con precisión funciones de flecha ES6+, literales de plantilla, expresiones regulares, bucles para , URL https:// y llamadas a métodos encadenados , e incluye un minificador JS con un solo clic para código de producción compacto.

Quick Presets:

Entrada: caracteres 0

Salida: caracteres 0

Líneas: 0

Bloques: 0

Cómo embellecer y eliminar JavaScript online

  1. Pegue su código: Pegue su paquete .min.js comprimido o script sin formato en el editor Ingrese JavaScript a la izquierda, o haga clic en Load Sample para probar las funciones de ES6+.
  2. Elija un ajuste preestablecido rápido o personalice opciones: Haga clic en 2 espacios (estándar), 4 espacios, Allman + Chain Break o Minimice (.min.js), o ajuste la ubicación de las llaves, el espaciado condicional y la eliminación de comentarios en el panel de la derecha.
  3. Revisión en tiempo real: La salida formateada y los contadores de caracteres/líneas/bloques se actualizan automáticamente a medida que escribe o alterna configuraciones.
  4. Copiar o descargar: Haga clic en Copiar al clipboard o Descargue .js para guardar script.beautified.js (o script.min.js).

Opciones de formato de JavaScript explicadas

Opción Qué controla antes después
Tirantes de la misma línea (K&R) Coloca la apertura { en la línea del encabezado (marcada) o en una nueva línea en estilo Allman (sin marcar). if(ok){ejecutar();}si no{parar();} if (ok) {
  run();
} else {
  stop();
}
Espacio antes de condicional Controla si aparece un espacio entre if, para, mientras, switch, catch y (. for(sea i=0;i<5;i++) para (sea i = 0; i < 5; i++)
Romper métodos encadenados Divide cadenas de métodos fluidos (.filter().map().sort()) en líneas sangradas. items.filter(fn).map(fn).sort(); items.filter(fn)
  .map(fn)
  .sort();
Eliminar comentarios Elimina los comentarios // y /* */ manteniendo intactas las cadenas y expresiones regulares https://. const u = "https://a.com"; // URL const u = "https://a.com";

¿Por qué utilizar un formateador de JavaScript compatible con tokens?

Formatear JavaScript con reglas simples de reemplazo de texto a menudo rompe el código válido porque caracteres como /, ; y { significan cosas diferentes según el contexto. Nuestro formateador utiliza un tokenizador léxico JavaScript dedicado que comprende:

  • Cadenas y literales de plantilla ES6: Se conservan comillas simples ('...'), comillas dobles ("..."), cadenas de plantilla de acento grave (`Hello ${name}`) y barras invertidas con escape ("C:\\Users\\"). palabra por palabra.
  • Expresiones regulares frente a división: Distingue los literales regex como /^user_[0-9]+;?/i de expresiones de división como (a + b) / 2, de modo que los puntos y comas o barras dentro de un regex nunca dividen la línea.
  • para (...)Encabezados de bucle : Los puntos y coma dentro de para (sea i = 0; i < n; i++) permanecen en la misma línea de encabezado en lugar de dividirse en tres líneas separadas.
  • Eliminación segura de comentarios: Los comentarios de una sola línea // y de varias líneas /* */ se tokenizan por separado, por lo que las URL como "https://api.example.com" nunca se truncan al eliminar comentarios.

Preguntas frecuentes

¿Cómo puedo desminificar un archivo .min.js online?

Pegue su código .min.js comprimido en el editor Input JavaScript a la izquierda. El tokenizador expande automáticamente declaraciones, bloques, funciones y bucles con una sangría limpia de varias líneas en tiempo real.

¿La eliminación de comentarios afecta las URL https:// o los literales regex en mi JavaScript?

No. Debido a que nuestro formateador utiliza un tokenizador léxico en lugar de una expresión regular ingenua, // y /* */ dentro de cadenas entre comillas simples, cadenas entre comillas dobles, literales de plantilla y expresiones regulares (/pattern/g) nunca se eliminan ni modifican.

¿Cuál es la diferencia entre el estilo de corsé K&R (misma línea) y Allman (nueva línea)?

El estilo K&R coloca la llave de apertura { en la misma línea que function, if o encabezado de bucle (el estándar en la mayoría de las guías de estilo de JavaScript). Al desmarcar Tirantes de la misma línea, cambia al estilo Allman, colocando el tirante de apertura en su propia nueva línea alineada con el tirante de cierre.

¿Puedo también minimizar JavaScript con esta herramienta?

Sí. Haga clic en el botón Minify JS (o seleccione Minify (Single-Line .min.js) en el panel de configuración) para eliminar comentarios y espacios en blanco innecesarios manteniendo intactos los espacios de palabras clave requeridos.

¿Mi código JavaScript se carga en algún servidor?

No. Todo el formateo y minificación de JavaScript se ejecuta 100% localmente en tu navegador. Su código fuente nunca sale de su dispositivo.