Compilador de JavaScript online
Escribe JavaScript y ejecútalo al instante. La salida aparece en una consola integrada con tablas, objetos y tiempos, los errores señalan la línea exacta y los bucles descontrolados se detienen automáticamente. Comparte tu código con un enlace.
Última actualización:
El código se ejecuta en un Web Worker aislado en tu dispositivo: sin DOM (document, window), pero con JavaScript moderno completo, temporizadores, promesas, fetch y await de nivel superior.
Cómo usar Compilador de JavaScript online
- Escribe o pega JavaScript en el editor, abre un archivo .js o elige un ejemplo.
- Pulsa Ejecutar código o Ctrl + Intro. La salida de console.log y similares aparece en la consola de la derecha.
- Corrige los errores haciendo clic en el enlace de línea de un mensaje de error para saltar a esa línea en el editor.
- Detén las ejecuciones largas con el botón Detener; los bucles infinitos se detienen automáticamente al llegar al límite de tiempo.
- Comparte o guarda tu código con Copiar enlace para compartir o Descargar.
Métodos de consola que puedes usar
| Método | Qué muestra | Ejemplo |
|---|---|---|
console.log() | Valores separados por espacios; los objetos se formatean y anidan hasta 4 niveles | console.log('total', 42, {a: 1}) |
console.info() / debug() | Como log, marcado como info o atenuado | console.info('ready') |
console.warn() / error() | Líneas amarillas o rojas, contadas en la barra de estado | console.warn('low stock') |
console.table() | Arrays u objetos como tabla; lista de columnas opcional | console.table(users, ['name']) |
console.time() / timeEnd() | Milisegundos transcurridos en un bloque con etiqueta | console.time('sort') |
console.count() | Cuántas veces se alcanzó una etiqueta | console.count('retry') |
console.group() / groupEnd() | Sangra las líneas siguientes | console.group('Step 1') |
console.assert() | Una línea de error solo cuando la condición es falsa | console.assert(x > 0, 'x must be positive') |
console.dir() / trace() | Un objeto, o la pila de llamadas actual | console.trace('here') |
| Especificadores de formato | %s cadena, %d/%i entero, %f decimal, %o/%O objeto | console.log('%s is %d', 'Ann', 30) |
Cómo se ejecuta tu código
Al pulsar Ejecutar, primero se comprueba que el código no tenga errores de sintaxis. Después se carga como script clásico en un Web Worker nuevo, un hilo en segundo plano con su propio ámbito global. Cada ejecución empieza desde cero, así que las variables de una ejecución anterior nunca pasan a la siguiente. Las declaraciones let, const y function de nivel superior se comportan como en un script normal, y el código que usa await en el nivel superior se envuelve automáticamente en una función async.
Las llamadas a la consola dentro del worker se reenvían a la página junto con la línea que las produjo, y los errores no capturados se asignan a los números de línea de main.js. La página también envía al worker una señal de vida varias veces por segundo. Si el código nunca cede el control, por ejemplo en while (true) {}, la señal queda sin respuesta y el worker se termina al llegar al límite de tiempo, mientras el editor sigue respondiendo todo el tiempo.
Consejos
- Usa Ctrl + Intro (Cmd + Intro en Mac) para ejecutar sin soltar el teclado. Tab y Shift + Tab aumentan y reducen la sangría de las líneas seleccionadas.
- Haz clic en la etiqueta main.js:línea junto a cualquier línea de la consola para saltar al código que la imprimió.
- Compara algoritmos con
console.time()y ejecútalos varias veces: la primera ejecución suele ser más lenta porque el motor aún no ha optimizado el código. - Resultados de coma flotante como
0.1 + 0.2 = 0.30000000000000004son el comportamiento normal de IEEE 754, no un error del compilador. UsatoFixed()o céntimos enteros para el dinero.
Preguntas frecuentes
¿JavaScript es compilado o interpretado?
Ambas cosas, en cierto sentido. Los motores modernos como V8 (Chrome, Edge, Node.js), SpiderMonkey (Firefox) y JavaScriptCore (Safari) analizan tu código, lo ejecutan en un intérprete y compilan a código máquina las partes más usadas justo a tiempo (JIT). Esta herramienta usa el propio motor de tu navegador, así que el código se ejecuta exactamente igual que en un script de una página web.
¿Por qué document o window no están definidos?
Tu código se ejecuta en un Web Worker, un hilo aislado sin acceso a la página. Eso mantiene el editor ágil y permite detener los bucles infinitos de forma segura, pero no hay DOM. JavaScript puro, temporizadores, promesas, fetch, JSON, Math, Intl y los arrays tipados funcionan. Para probar código que modifica HTML, usa el Editor HTML.
¿Qué pasa si mi código tiene un bucle infinito?
La página sigue funcionando porque el código se ejecuta en un hilo aparte. Cuando la ejecución supera el límite de tiempo que elegiste (5 segundos por defecto), el worker se detiene y la consola explica que el código nunca hizo una pausa. También puedes pulsar Detener en cualquier momento.
¿Puedo usar await, promesas y temporizadores?
Sí. Se admite el await de nivel superior, y la ejecución sigue activa hasta que terminan todos los timeouts, intervalos, peticiones fetch y el código asíncrono principal, hasta el límite de tiempo. Los rechazos de promesas no capturados se muestran como errores.
¿Puedo importar paquetes npm o usar require?
No directamente. El código se ejecuta como un script clásico, así que las sentencias import y el require de Node.js no están disponibles. Tampoco existen las API exclusivas de Node, como fs y process. Para bibliotecas preparadas para el navegador puedes usar importScripts('https://...') con una URL completa.
¿Cómo funcionan los enlaces para compartir y mi código es privado?
El enlace para compartir guarda tu código, comprimido, después del # de la URL. Esa parte nunca se envía a un servidor, así que el código queda entre tú y las personas a las que envías el enlace. Al abrir un enlace compartido se carga el código, pero no se ejecuta hasta que pulsas Ejecutar.
¿Qué precisión tiene el tiempo de ejecución?
El tiempo mostrado se mide con performance.now() alrededor de tu script, así que incluye el análisis y la ejecución, pero no la sobrecarga de la página. Los tiempos varían entre ejecuciones y navegadores; usa console.time para partes de tu código y compara varias ejecuciones.
¿Se prueban todas las herramientas de FreeToolCabin para comprobar su calidad y precisión?
Sí. Cada herramienta del sitio pasa pruebas automáticas en navegadores reales para comprobar que el resultado es correcto y que no hay errores. Si encuentras un fallo o tienes una sugerencia, escríbenos a [email protected] y lo revisaremos.