¿Cómo forzar la ejecución secuencial de Javascript?
Solo he encontrado respuestas bastante complicadas que involucran clases, controladores de eventos y devoluciones de llamadas (lo que me parece un enfoque un tanto molesto). Creo que las devoluciones de llamada pueden ser útiles, pero parece que no puedo aplicarlas en el contexto más simple. Vea este ejemplo:
<html>
<head>
<script type="text/javascript">
function myfunction() {
longfunctionfirst();
shortfunctionsecond();
}
function longfunctionfirst() {
setTimeout('alert("first function finished");',3000);
}
function shortfunctionsecond() {
setTimeout('alert("second function finished");',200);
}
</script>
</head>
<body>
<a href="#" onclick="javascript:myfunction();return false;">Call my function</a>
</body>
</html>
En esto, la segunda función se completa antes que la primera función; ¿Cuál es la forma más sencilla (o existe una?) para forzar a la segunda función a retrasar la ejecución hasta que se complete la primera función?
---Editar---
Así que ese fue un ejemplo de basura, pero gracias a David Hedlund, veo con este nuevo ejemplo que de hecho es sincrónico (¡además de bloquear mi navegador en el proceso de prueba!):
<html>
<head>
<script type="text/javascript">
function myfunction() {
longfunctionfirst();
shortfunctionsecond();
}
function longfunctionfirst() {
var j = 10000;
for (var i=0; i<j; i++) {
document.body.innerHTML += i;
}
alert("first function finished");
}
function shortfunctionsecond() {
var j = 10;
for (var i=0; i<j; i++) {
document.body.innerHTML += i;
}
alert("second function finished");
}
</script>
</head>
<body>
<a href="#" onclick="javascript:myfunction();return false;">Call my function</a>
</body>
</html>
Como mi problema REAL fue con jQuery e IE, tendré que publicar una pregunta aparte sobre eso si no puedo llegar a ninguna parte por mi cuenta.