Soy un completo principiante en JavaScript. Solo quiero llamar a la función llamada seconONe() justo después de que la función firstOne() complete su ejecución. al decir esto, quiero decir que la función dos llamará cuando el valor de ese p1 sea 4 (en este caso); Puedo lograrlo llamando a la función setTimeout(). pero ¿y si no sé cuántos se necesitan para ejecutar { el primero() }?
// getting DOM element const p1 = document.getElementById(`one`); const p2 = document.getElementById(`two`); const p3 = document.getElementById(`three`); // first function function firstOne() { for (let i = 0; i < 5; i++) { setTimeout(() => { p1.innerHTML = i; }, i * 1000); } } // second function function seconOne() { for (let i = 0; i < 5; i++) { setTimeout(() => { p2.innerHTML = i; }, i * 1000); } }Una posible solución es trabajar con promesas . Más información sobre las promesas aquí .
ejemplo de trabajo
var p1 = 1; var p2 = 2; var p3 = 3; const firstPromise = new Promise((resolve, reject) => { for (let i = 0; i < 5; i++) { setTimeout(() => { p1 = i; }, i * 1000); } resolve() }); const secondPromise = new Promise((resolve, reject) => { for (let i = 0; i < 5; i++) { setTimeout(() => { p2 = i; }, i * 1000); } resolve() }); //run first promise console.log("First promise called") firstPromise .then((response) => { console.log("First promise done") //run second promise after first promise succeed console.log("Second promise called") secondPromise .then((response) => console.log("Second promise done")) })Tu pregunta no es infantil en absoluto. Lo que deberá comprender son las devoluciones de llamada y los controladores de promesas. Esto solo le dice a JavaScript que espere hasta que se complete una tarea para ejecutar la siguiente tarea.
firstOne().then(() => secondOne())poner si condición en su función firstOne.
const p1 = document.getElementById(`one`); const p2 = document.getElementById(`two`); const p3 = document.getElementById(`three`); // first function function firstOne() { for (let i = 0; i < 5; i++) { setTimeout(() => { if(i == 4){ seconOne(); }else{ p1.innerHTML = i; } }, i * 1000); } } // second function function seconOne() { for (let i = 0; i < 5; i++) { setTimeout(() => { p2.innerHTML = i; }, i * 1000); } }