/
Las promesas son uno de esos temas que te recomienda ver más de una vez porque te van a volar la cabeza más a futuro. Te dejo el curso de asincronismo en JavaScript para que lo puedas entender mejor y te prometo que estos ejercicios se volverán más sencillos... o no 😉
/
Después del gif tendrás la solución explicada a este ejercicio 👇
!cat
Explicación 📖
Ahora sí, aquí tienes la explicación
exportfunctionsendEmail(email, subject, body){// De entrada empezamos retornando una promesa// La cual nos provee de resolve y reject dependiendo si hay éxito en estareturnnewPromise((resolve, reject)=>{// Primero validamos que todos los aspectos del email estén disponiblesif(email && subject && body){// De ser así, creamos un timeout para "enviar" el email// Recuerden hacer uso de window para que las pruebas pasenwindow.setTimeout(()=>{// Dentro del timeout definimos un objeto con// todos los datos recibidosconst emailInfo ={ email, subject, body,};// Y lo pasamos a la resolución exitosa de la promesa// Para que esto sea "enviado" después de 2 segundosresolve(emailInfo);},2000);}else{// En caso de faltar algún dato, lanzamos un error indicándoloreject(newError("Hacen falta datos para poder enviar el correo"));}});}
Creo que al menos esta promesa es fácil de entender sin la explicación, de igual manera, te invito a que compartas tu solución y nos dejes cualquier duda que tengas respecto a esta solución o problema 💪
Pregunta: ¿No debería estar el IF dentro del Timeout? ¿Como está puesto el error se ejecutaría después de 2 sg?
En el ejemplo 2 de la guía indica que el mensaje de error tendría que ser "después de 2 segundos"
Me parece o la solución planteada no cumple esto....
Aquí mi solución.
En el mensaje de error también se muestra qué campos faltan.
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈const emailBlock ={ email, subject, body };returnnewPromise((resolve, reject)=>{if(email && subject && body){window.setTimeout(()=>resolve(emailBlock),2000);}else{const missing =Object.keys(emailBlock).filter(item=> emailBlock[item]==false);if(missing.length==1){reject(newError(`Falta el campo ${missing[0]} para enviar el mensaje`));}else{reject(newError(`Faltan los campos ${newIntl.ListFormat('es').format(missing)} para enviar el mensaje`));}}});}
De este video aprendí que Intl.ListFormat().format() devuelve una cadena con los elementos del arreglo según el lenguaje. Para el español agrega (por defecto) la conjunción "y" antes del último elemento.
estuvo bueno el playground!
*
*
*
*
*
*
*
*
*
exportfunctionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(!email ||!subject ||!body){reject(newError("Faltan campos por rellenar"))}else{window.setTimeout(()=>{const result ={ email, subject, body };resolve(result);},2000);}});}
Mi solucion con algunos** cositas extras**:
Operador ternario
filter(Boolean)
"[email, subject, body].filter(Boolean).length == 3" es una comprobación que verifica si se han rellenado los campos necesarios. La función "filter" elimina cualquier valor falso de la lista de campos (como si alguno de los campos fuera null, undefined, o una cadena vacía) y si hay tres elementos, significa que se han rellenado los campos necesarios.
Tambien use el operador ternario para hacer el codigo en menos lineas.
En cada reto aprendo un montón.
<import{ doTask1, doTask2, doTask3 }from'./tasks';exportfunctionrunCode(){returnnewPromise((resolve, reject)=>{if(!email ||!subject ||!body){reject(newError("Hacen falta campos para enviar el email"));}elseif(!/\S+@\S+\.\S+/.test(email)){reject(newError("El correo electrónico proporcionado no es válido"));}setTimeout(()=>{resolve({ email, subject, body });},2000);});}>
Resolviendo promesas... :)
functionsendEmail(email, subject, body){// Tu código aquí 👈const mail ={ email, subject, body
}returnnewPromise((resolve, reject)=>{for(let prop in mail){if(mail[prop].trim()==""){window.setTimeout(()=>{reject(newError("Error: Hacen falta campos para enviar el email"))},2000);}}window.setTimeout(()=>{resolve(mail);},2000);});}
¿Cuál es el error en mi code? El error que me arroja la consulta es de los 3 rejects que tiene qeu arrojar...pero aquí si estoy validando
functionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(email !==null&& subject !==null&& body !==null){window.setTimeout(()=>{resolve({email: email,subject: subject,body: body
})},2000);}else{if(email ===null|| subject ===null|| body ===null){//setTimeout(() => {reject(newError("Error: Hacen falta campos para enviar el email"));//}, 2000);}}})}
Respondiendome a mi mismo, en vez de null se ponía ""...pero ¿eso no es igual a null?
Hola @ricardo999
Realmente no, son valores diferentes y aquí con un pequeño meme te lo explico
Para este ejemplo en particular estamos obteniendo los valores de un input, los input por default aunque no tengan un valor escrito tienen el value como un string vacío ("") que es como en el meme, que este caso el 0 sería el string vacío.
Espero te sea de ayuda mi comentario :D
Por que de esta manera mi código no pasó la primera prueba pero si todas las demás?
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈returnnewPromise((resolve, reject)=>{if(email ===""|| subject ===""|| body ===""){reject(newError("Hacen falta campos para enviar el email"));}else{window.setTimeout(resolve({ email, subject, body,}),2000);}})}
Pero de esta manera si pasó todos los tests
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈returnnewPromise((resolve, reject)=>{if(email ===""|| subject ===""|| body ===""){reject(newError("Hacen falta campos para enviar el email"));}else{window.setTimeout(()=>{const emailInfo ={ email, subject, body,};resolve(emailInfo);},2000);}})}
Tengo esa pequeña duda, gracias
¡Hola Felipe!
/
Ambas soluciones funcionan, el detalle con la segunda es que omitiste la función anonima, aquí te la pongo como arrow function (() =>)
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈returnnewPromise((resolve, reject)=>{if(email ===""|| subject ===""|| body ===""){reject(newError("Hacen falta campos para enviar el email"));}else{// Justo después del setTimeuout ponemos la función anonimawindow.setTimeout(()=>resolve({ email, subject, body,}),2000);}})}
Espero te sea de ayuda :D
¿Por qué debo usar el namespace de window para ejecutar el setTimeout?
porque asi esta programado para que cuando corran las pruebas en esta interfaz, la funcion se ejecute correctamente
Es la forma en la que el probador puede acceder a este método de la ventana del navegador.
Mi solución
exportfunctionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(!email ||!subject ||!body)reject(newError("Error: Hacen falta campos para enviar el email"));window.setTimeout(()=>{resolve({ email, subject, body });},2000);});}
Este es un escudo anti spoiler
.
.
.
.
.
.
.
.
.
.
.
.
.
Toma tu tiempo en crear buenas validaciones, ahí esta la clave en este código.
Mi aporte:
Prometeme que no te rendirás
Pero si no cumples tu promesa, te dejo mi solución
functionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(email !==""&& subject !==""&& body !==""){window.setTimeout(()=>{resolve({email: email,subject: subject,body: body
})},2000);}else{if(email ===""|| subject ===""|| body ===""){reject(newError("Error: Hacen falta campos para enviar el email"));}}})}
Only running in console:
functionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{const arrayResponse ={email, subject, body};if(!email ||!subject ||!body){setTimeout(()=>{reject(newError("Hacen falta campos para enviar el email"));},2000);}else{setTimeout(()=>{resolve(arrayResponse);},2000);}});}Input after 2seconds://Promise ResolvedsendEmail("test@mail.com","Nuevo reto","Únete a los 30 días de JS").then((result)=>console.log(result)).catch((error)=>console.log(error));//Promise RejectedsendEmail("test@mail.com","","Únete a los 30 días de JS").then((result)=>console.log(result)).catch((error)=>console.log(error));Output after 2seconds:{email:'test@mail.com',subject:'Nuevo reto',body:'Únete a los 30 días de JS'}Error:Hacen falta campos para enviar el email
Aporte de mi solucion!
.
.
.
.
.
.
.
.
.
.
.
🛡️🛡️🛡️Escudo anti spoilers🛡️🛡️🛡️
Promesas
!Spoiler Shield
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈returnnewPromise((resolve, reject)=>{if(email !=""&& subject !=""&& body !=""){setTimeout(()=>{resolve({ email, subject, body,});},2000);}else{setTimeout(()=>{reject(newError("Hacen falta campos para enviar el email"));},2000);}});}
Mi solución:
exportfunctionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(email ==""|| subject ==""|| body ==""){reject(newError("Error: Hacen falta campos para enviar el email"))}else{window.setTimeout(()=>resolve({email: email,subject: subject,body: body,}),2000)}})}
mi solución:
🪄
🪄
🪄
🪄
🪄
🪄
🪄
exportfunctionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{setTimeout(()=>{if(email && subject && body){resolve({ email, subject, body,})}else{reject(newError("Error: Hacen falta campos para enviar el email"))}},2000)})}
exportfunctionsendEmail(email, subject, body){// Tu código aquí 👈returnnewPromise((resolve, reject)=>{if(email && subject && body){window.setTimeout(()=>{resolve({email, subject, body})},2000);}else{reject(newError("Datos incompletos para enviar correo"));return;}});}
Mi solución pequeñita 💚
exportfunctionsendEmail(email, subject, body){returnnewPromise((resolve, reject)=>{if(!email ||!subject ||!body){reject(newError("Error: Hacen falta campos para enviar el email"))return;}window.setTimeout(()=>{resolve({email, subject, body})},2000)})}
exportfunctionsendEmail(email, subject, body){const message ="Hacen falta campos para enviar el email";constMILLISECONDS=2000;const falsyValues =[null,""];let mail ={ email, subject, body }const rejectCondition = falsyValues.includes(email)|| falsyValues.includes(subject)|| falsyValues.includes(body);returnnewPromise((resolve, reject)=> rejectCondition ?reject(newError(message)):window.setTimeout(()=>resolve(mail),MILLISECONDS))}