Entrada

Salida

¿Qué es el formateador JavaScript?

Acabas de recibir un JavaScript de 2.000 caracteres en una sola línea de una API de terceros, o estás depurando un bundle de producción — completamente ilegible. Para eso existe esta herramienta. El formateador JavaScript añade sangría, saltos de línea y espaciado correctos para que la estructura quede clara en segundos. La documentación MDN JavaScript es la referencia del lenguaje, y la especificación ECMAScript define sus bases. Herramientas como Prettier y ESLint hacen esto en pipelines CI — pero cuando necesitas formatear ahora mismo, aquí lo haces. Todo corre en tu navegador; ningún código sale de tu computadora. webpack y Rollup producen salidas minificadas que querrás formatear para depurar.

Esta herramienta se ejecuta por completo en tu navegador. No se envía nada a ningún servidor. Pega JS o sube un archivo; obtén salida formateada. Usa Minificar para bundles de producción. Para validar, usa Validador JavaScript. Solo para minificar, usa Minificador JavaScript.

Cómo usar esta herramienta

1

Pegar o subir

Pega JavaScript en el panel izquierdo o sube un archivo .js o .txt. Usa Ejemplo para cargar código de muestra. Usa Borrar para restablecer.

2

Revisa la salida

El panel derecho se actualiza automáticamente con el código formateado. Usa Minificar para una versión compacta de producción.

3

Copiar o descargar

Usa Copiar o Descargar para obtener el resultado. Para JSX/React, usa Formateador JSX. Para conversión a TypeScript, usa JavaScript a TypeScript.

Ejemplos de formateo JavaScript

Aquí hay un ejemplo de formateo de código JavaScript minificado.

Ejemplo: búsqueda de plan de suscriptor

Entrada minificada:

Entrada

Salida formateada:

Salida

Cuándo ayuda el formateador JavaScript

Al depurar código minificado, revisar bundles de webpack o rollup, o aprender de scripts de producción, el formateo hace visible la estructura. Ideal para trazas de pila, código de terceros y comprobaciones rápidas de legibilidad. La especificación ECMAScript define el lenguaje. Para código ofuscado, usa primero Desofuscador JavaScript.

Preguntas frecuentes

¿Mis datos son privados?

Sí. El formateo se ejecuta por completo en tu navegador. No se envían datos a ningún servidor.

¿Formateador o minificador?

El formateador añade sangría para legibilidad. El minificador elimina espacios y comentarios para reducir el tamaño. Esta herramienta puede hacer ambas cosas.

¿Admite ES6+?

Sí. Se admite la sintaxis moderna de JavaScript (funciones flecha, clases, async/await).

¿Y JSX?

Para código JSX y React, usa Formateador JSX.

¿Puede corregir errores de sintaxis?

No. El JavaScript inválido mostrará un error. Usa Validador JavaScript para comprobar la sintaxis primero.

Herramientas relacionadas

Más información: ECMAScript, MDN JavaScript, webpack, rollup, source maps, Vite, TypeScript.