problemas - se requiere javascript para iniciar sesión

Pieza de JavaScript ejecutada o no ejecutada si el script anterior falla

Question

Acabo de conocer un hecho importante sobre la ejecución de javascript en caso de que se produzca un error. Antes de empezar a sacar conclusiones de esto, será mejor que verifique si tengo razón.

Dada una página HTML que incluye 2 scripts:

<script src="script1.js" />
<script src="script2.js" />

script1:

doSomething();

script2:

doSomeOtherThing();

Esto efectivamente resulta en un solo script que se procesa como una unidad:

doSomething();
doSomeOtherThing();

En particular, si doSomething lanza un error, la ejecución se interrumpe. ''script2'' nunca se está ejecutando.

Esta es mi "Lección 1" : se podría pensar que, dado que se trata de un archivo incluido por separado, no está afectado por script1. Pero es. => ver "actualización tardía" a continuación

Ahora, si cambiamos el script2 de la siguiente manera (suponiendo que hemos incluido jQuery en algún lugar arriba):

$(document).ready({ doSomeOtherThing(); });

y coloque el script antes de script2:

<script src="script2.js" />
<script src="script1.js" />

El orden de ejecución sigue siendo, efectivamente, ''doSomething ()'' seguido (en algún momento) por ''doSomeOtherThing ()''.

Sin embargo se ejecuta en dos "unidades":

• doSomething se ejecuta temprano como parte del script java del documento
• doSomeOtherThing se ejecuta cuando se procesa el evento document.ready.

Si doSomeOtherThing lanza una excepción, no romperá la segunda "unidad" de procesamiento.

(Me abstengo de usar el término thread porque considero que todas las secuencias de comandos normalmente se ejecutan con el mismo hilo, o más precisamente esto puede depender del navegador).

Por lo tanto, mi Lession 2 : aunque un error de JavaScript puede impedir que se ejecuten los scripts posteriores, no detiene el bucle de eventos.

Conclusión 1

$(document).ready() hace un gran trabajo en la definición de trozos de código JavaScript que deben ejecutarse de manera independiente en cualquier otro script en el futuro.

O, en otras palabras: si tiene un fragmento de JavaScript y desea asegurarse de que se ejecute incluso si fallan otros scripts, colóquelo dentro de $(document).ready() .

Esto sería nuevo para mí, ya que solo habría usado el evento si la secuencia de comandos dependiera de que el documento esté completamente cargado.

Conclusión 2

Yendo un paso más allá, podría ser una buena decisión de arquitectura envolver todos los scripts dentro de $(document).ready() para asegurarse de que todos los scripts estén en "cola" para su ejecución. En el segundo ejemplo anterior, si se incluyó script2.js después de script1.js como en el ejemplo 1:

<script src="script1.js" />
<script src="script2.js" />

Un error en script1.js evitaría que doSomeOtherThing() incluso se registrara, porque la función $(document).ready() no se ejecutaría.

Sin embargo, si script1.js también usara $(document).ready() , eso no sucedería:

$(document).ready(function() { doSomething(); });
$(document).ready(function() { doSomeOtherThing(); });

Ambas líneas serían ejecutadas. Luego, más adelante, el bucle de eventos ejecutaría doSomething que se rompería, pero doSomeOtherThing no se vería afectado.

Una razón más para hacerlo sería que el subproceso que muestra la página puede volver tan pronto como sea posible, y el bucle de eventos puede usarse para desencadenar la ejecución del código.

Crítica / Preguntas:

• ¿Estaba equivocado?
• ¿Cuáles son las razones que hacen que sea necesario ejecutar un fragmento de código inmediatamente , es decir, no incluirlo en el evento?
• ¿Impactaría significativamente el rendimiento?
• ¿Hay otra / mejor manera de lograr lo mismo en lugar de usar el evento de preparación del documento?
• ¿Se puede definir el orden de ejecución de los scripts si todos los scripts simplemente registran su código como un controlador de eventos? ¿Se ejecutan los controladores de eventos en el orden en que se registraron?

Esperamos cualquier comentario útil!

Última actualización:

Como señaló briguy37 correctamente, mi observación debe haber sido errónea en primer lugar. ("Estaba equivocado - si!"). Tomando su sencillo ejemplo, puedo reproducirlo en todos los navegadores principales e incluso en IE8, script2 se ejecuta incluso si script1 produce un error.

La gran respuesta de Still @ Marcello ayuda a comprender mejor los conceptos de las pilas de ejecución, etc. Parece que cada uno de los dos scripts se ejecuta en una pila de ejecución separada.

Answer 1

La forma en que JS maneja los errores, depende de la forma en que JS esté procesando el script. No tiene nada (o poco) que ver con hilos. Por lo tanto, primero debe pensar cómo funciona JS a través de su código.

En primer lugar, JS leerá cada archivo / bloque de secuencia de comandos de forma secuencial (en este punto, su código se verá como texto).

Than JS comienza a interpretar los bloques de texto y los compila en un código ejecutable. Si se encuentra un error de sintaxis, JS deja de compilar y pasa al siguiente script. En este proceso, JS maneja cada secuencia de comandos / archivos como una entidad separada, es por eso que los errores de sintaxis en la secuencia de comandos 1 no necesariamente interrumpen la ejecución de la secuencia de comandos 2. El código se interpretará y compilará, pero no se ejecutará en este punto, por lo tanto throw new Error comando de throw new Error no rompería la ejecución.

Después de compilar todos los archivos / bloques de secuencias de comandos, JS recorre el código (comenzando con el primer archivo / bloque de código en su código) y construye una llamada pila de ejecución (función a función de llamadas b función d y c ... ) y ejecutándolo en el orden dado. Si en algún punto se produce un error de procesamiento o se lanza mediante programación ( throw new Error(''fail'') ), se detiene toda la ejecución de esa pila y JS vuelve al principio al principio de esa pila y comienza con la ejecución de la pila. siguiente pila posible.

Dicho esto, la razón por la que su función de carga aún se ejecuta después de un error en script1.js, no ocurre debido a un nuevo hilo o algo, simplemente es porque un evento crea una pila de ejecución por separado, JS puede saltar, después del error en la pila de ejecución anterior happend.

Llegando a sus preguntas:

¿Cuáles son las razones que hacen que sea necesario ejecutar un fragmento de código inmediatamente, es decir, no incluirlo en el evento?

Le aconsejaría que no tenga ningún código llamado "de inmediato" en su aplicación web. La mejor práctica es tener un único punto de entrada en su aplicación que se llame dentro de un evento onload

$(document).ready(function () {App.init()});

Sin embargo, esto no tiene nada que ver con el manejo de errores o algo así. El manejo de errores en sí mismo debe hacerse definitivamente dentro de su código con cualquiera de los condicionales if(typeof myValue !== ''undefined'') o los bloques try / catch / finally, donde puede esperar errores potenciales. Esto también le da la oportunidad de intentar una segunda forma dentro del bloque catch o manejar con gracia el error finalmente.

Si puede crear su aplicación impulsada por un evento (no por razones de manejo de errores, por supuesto), hágalo. JS es un lenguaje impulsado por eventos y puede sacar el máximo provecho de él, al escribir código impulsado por eventos ...

¿Impactaría significativamente el rendimiento?

Un enfoque impulsado por un evento podría hacer que mi aplicación tenga un mejor rendimiento y que sea más sólida al mismo tiempo. El código impulsado por eventos puede ayudarlo a reducir la cantidad de lógica de procesamiento interno, solo tiene que ingresar.

¿Hay otra / mejor manera de lograr lo mismo en lugar de usar el evento de preparación del documento?

Como se mencionó anteriormente: probar / atrapar / finalmente

¿Se puede definir el orden de ejecución de los scripts si todos los scripts simplemente registran su código como un controlador de eventos? ¿Se ejecutan los controladores de eventos en el orden en que se registraron?

Si registra el mismo evento en el mismo objeto, se conserva el orden.

Answer 2

No estoy seguro de los errores de sintaxis, pero puede usar try {} catch(e) {} para detectar los errores y mantener el resto del código en ejecución.

NO se ejecutará hasta el final

var json = ''{"name:"John"''; // Notice the missing curly bracket }
// This probably will throw an error, if the string is buggy
var obj = JSON.parse(json);
alert(''This will NOT run'');

Correrá hasta el final

var json = ''{"name:"John"''; // Notice the missing curly bracket }
// But like this you can catch errors
try {
var obj = JSON.parse(json);
} catch (e) {
// Do or don''
}
alert(''This will run'');

ACTUALIZAR

Solo quería mostrar cómo asegurarme de que el resto del código se ejecute en caso de que se produzca el error.

¿Cuáles son las razones que hacen que sea necesario ejecutar un fragmento de código inmediatamente, es decir, no incluirlo en el evento?

Actuación. Cada evento de este tipo llena la cola de eventos. No es que duela mucho, pero simplemente no es necesario ... ¿Por qué trabajar un poco más tarde, si se puede hacer ahora? Por ejemplo, la detección del navegador y esas cosas.

¿Impactaría significativamente el rendimiento?

Si haces esto muchas veces por segundo, entonces sí.

¿Hay otra / mejor manera de lograr lo mismo en lugar de usar el evento de preparación del documento?

Sí. Ver el ejemplo anterior.

¿Se puede definir el orden de ejecución de los scripts si todos los scripts simplemente registran su código como un controlador de eventos? ¿Se ejecutan los controladores de eventos en el orden en que se registraron?

Sí, estoy bastante seguro de que lo son.

Answer 3

Su primera suposición de que se ejecutan como un script es incorrecta. Script2 aún se ejecutará incluso si Script1 produce un error. Para una prueba simple, implemente la siguiente estructura de archivos:

-anyFolder
--test.html
--test.js
--test2.js

Los contenidos de test.html:

<html>
<head>
<script type="text/javascript" src="test.js"></script>
<script type="text/javascript" src="test2.js"></script>
</head>
</html>

Los contenidos de test.js:

console.log(''test before'');
throw(''foo'');
console.log(''test after'');

Los contenidos de test2.js:

console.log(''test 2'');

La salida al abrir test.html (en la consola):

test before test.js:1
Uncaught foo test.js:2
test 2 

Desde esta prueba, puede ver que test2.js aún se ejecuta a pesar de que test.js produce un error. Sin embargo, test.js deja de ejecutarse después de que se ejecuta en el error.