Promesas

nominado a profesor del año junto con leonidas!!

IsraelAcetori

solo a ti te creo las promesas

WSJedp

Las promesas son una sintaxis mas elegante y legible de realizar callbacks, creando así un código mucho más escalable y entendible para todas las personas.
Una promesa al final no deja de ser un callback, solo que, con la novedad de tener estados, las promesas cuentan con 3 estados, resuelta, en progreso y en fallo.
Para utilizar una promesa solo debemos de instanciar una nueva, una promesa en si es una función que recibe dos parámetros, resolve y reject, que son los dos estados de una promesa.
Utilizamos resolve para retornar el valor deseado cuando una función se ejecute y utilizamos reject para cuando una función retorna un valor no deseado.
New Promise( (resolve, reject) => {
…code
If(code === true){
resolve(correctValue);
}else {
Reject(wrongValue);
}
});
Para poder obtener los valores que retorna una función debemos utilizar su propiedad .then, esta propiedad es una función que recibe un callback el cual tendrá como parámetro el valor retornado con resolve o reject.
Siempre que usemos una promesa además de realizar la propiedad .then debemos invocar la propiedad .catch, la cual es un callback que recibe como parámetro el error ocurrido en caso de haber sucedió uno.

myPromise(‘Parameter’)
.then( data => console.log(data) )
.catch( err => console.log(err) );

Roberto Shirásago Domínguez

Alejandro Giraldo Londoño

RESUMEN:

Las promesas vienen de los callbacks, pero las promesas lo que hacen es dar un estado.
Las promesas son una “clase” global que podemos llamar de donde sea, nuestras funciones devuelvan promesas
Promise(), la diferenia entre promises y callbacks es la capacidad de anidar promesas. Formando una cadena de promesas.
Es muy útil para visualizar código asíncrono de manera síncrona.



function hola(nombre) {
    return new Promise(function (resolve, reject) {
        setTimeout(function () {
            console.log('Hola, '+ nombre);
            resolve(nombre);
        }, 1500);
    });
    
}

function hablar(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Bla bla bla bla...');
            //resolve(nombre);
            reject('Hay un error');
        }, 1000);
    });
}

function adios(nombre) {
    return new Promise( (resolve, reject) => {
        setTimeout(function() {
            console.log('Adios', nombre);
            resolve();
        }, 1000);
    });
}

// ---

console.log('Iniciando el proceso..');
hola('Alejandro')
    .then(hablar)
    .then(hablar)
    .then(hablar)
    .then(hablar)
    .then(adios)
    .then((nombre) => {
        console.log('Terminado el proceso');
    })
    .catch(error => { // Hace parte de a sintaxis de las promesas puedo captar los reject
        console.error('Ha habido un error:');
        console.error(error);
    })

Cristobal Vega

“Recuerda, esto es nodejs, es com Mad Max, todo puede fallar”. 💻

Christian Andres Moreno Ceballos

https://www.youtube.com/watch?v=5XyzLfPBpZs

Bueno antes de que comience el video quiero recomendar este canal dé YouTube, me parece de los mejores junto con el buen Sasha

abustamante

Les comparto el código de la clase.

Promesas, forma de trabajar con asincronia, las promesas pueden tene run estado, resultas, no resuletas, fallar.
Son una clase global.
Las promesas se pueden ir anidados.
Siempre que se use un THEN, debe ser acompañado de un manejador de errores CATCH.
Ejemplo del mismo código con promesas pero se obtiene el mismo resultado en consola.

//funciones
//se crea una promesa que indica el estado del proceso.
//en vez de devolver callback se usara promesa
function hola(nombre){
    return new Promise(function(resolve,reject){
        setTimeout(function(){
            console.log('hola, '+nombre);
            resolve(nombre);
        },1000);
    });
}
function hablar(nombre) {
    return new Promise((resolve,reject)=>{
        setTimeout(function () {
            console.log('bla bla bla bla...');
            resolve(nombre);
        },1000);
    });
}
function adios(nombre) {
    return new Promise((resolve,reject)=>{
        setTimeout(function () {
            console.log('adios',nombre);
            resolve(nombre);
        },1000);
    });
}

//lo que se ejecutara....
console.log('Iniciando el Proceso...')
hola('Alexis')
    .then(hablar)
    .then(hablar)
    .then(hablar)
    .then(hablar)
    .then(adios)

    .then((nombre)=>{
        console.log('Terminando Proceso');
    })

//cualquier hilo de ejcucion lo llevará al catch para ejecutar su funcion
//console
    .catch(error =>{
        console.error('ha habido un error');
        console.error(error);
    })```

Patricio Manuel Ugarte

Cada vez que veo las Promesas flipo en colores. Son súper simples y tienen un potencial enorme. Después de algún tiempo de verlas y practicarlas logro entenderlas cuando las veo aplicadas. Pero aún me cuesta horrores entender cuándo usarlas y hacerlo bien. A seguir practicando 😄

Cristina Sharai Garcia Rubio

hice el ejercicio con funciones recursivas, funciona pero no se que tan optimo sea por si le quieren echar un ojo

const nombre = process.env.NOMBRE || 'Extraño'
const TIME = 1000
const repeticiones = 4

const hola = (Nombre)=> {
      return new Promise((resolve, reject)=>{
            setTimeout( () => {
                  console.log('hola, ' + Nombre)
                  resolve(nombre)
            },TIME)
      })
      
}
const hablar = (nombre) => {
      return new Promise((resolve, reject) => {
            setTimeout(() => {
                  console.log('Bla bla bla bla ....')
                  resolve(nombre)
            },TIME)
      })
}
const adios = (nomb) => {
      return new Promise( (resolve,reject) =>{
            setTimeout( () => {
                  console.log('Adios ' + nomb + '....')
                  resolve(nomb)
            },TIME)
      })
}
const conversacion = (nombre, repeticion) =>{
      return new Promise((resolve, reject) => {
            if(repeticion>0){
                  setTimeout( () =>{
                        conversacion(nombre, --repeticion)
                              .then(hablar(nombre))
                              .catch(error => {
                                    console.error('ah habido un error')
                                    console.error(error)
                              })
                  }, TIME)
            }else{
                  setTimeout(()=>{
                        adios(nombre)
                        .then(() => {
                              console.log("terminado el proceso")
                        })
                        .catch(error => {
                              console.error('ah habido un error')
                              console.error(error)
                        })
                  },TIME)
            }
      })
}

console.log("inciando el proceso...")
hola(nombre)
      .then(conversacion(nombre,repeticiones))
      .catch(error => {
            console.error('ah habido un error')
            console.error(error)
      })

Ricardo Rito Anguiano

5 cursos y no entendia del todo las promesas, llega este profe y a la primera :v

David Antonio Garcia Saaib

Cabe mencionar que para acceder al nombre en adios
el param se debe mandar a traves de todos las promesas

hola('Adranuz')
  .then(hablar)
  .then(hablar) 
  .then(hablar)
  .then(hablar)
  .then(adios)
  .then((nombre)=> {
    console.log('Proceso terminado')
  })
  .catch (error=> {
    console.log('Ocurrio un error')
    console.error(error)
  })

Joel Eduardo Sánchez Herrera

Manejar callbacks puede ser un infierno, para evitarlo se crearon las promesas, que son como callbacks pero cambiaron un concepto. Agregaron el estado, pueden estar resueltas, no resueltas, pendientes o fallar.

Lo que haremos es que nuestras funciones en vez de ejecutar cosas mejor devuelvan la promesa y quien las llame esten pendientes del estado y lo que pasa.

return new Promise((resolve, reject) => {});

Lo que va a tener es un callback, ya que al final siempre es una funcion asincrona. Esta funcion recibe dos parametros, resolve y reject. Nos van a permitir resolver la promesa o si detectamos un error lo que se va a detener. Ya no ejecutaremos un callback, en vez de eso mandaremos RESOLVE. Nuestra funcion de hola quedaria:

const hola = (nombre) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(`Hola ${nombre}`);
      resolve(nombre);
    }, 1500);
  });
};

Ahora para ejecutar nuestro metodo podriamos usar:

console.log("Iniciando el proceso");
hola("Carlos")
	.then((nombre) => {
  console.log("terminado el proceso");
});

Donde veremos que al solucionarle mandaremos por then el parametro qie mandamos desde el inicio y este se ejecutara. La diferencia es que podemos ir anidando promesas, opor ejemplo, el metodo adios vamos a retornar una promesa:

const adios = (nombre) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log(`Adios, ${nombre}`);
      resolve();
    }, 1000);
  });
};

Ahora para que esta se pueda llamar usamos:

hola("Carlos")
  .then(adios)
  .then((nombre) => {
    console.log("terminado el proceso");
  });

Ahora podremos trabajar con nuestras funciones de forma mucho mas sencilla. ya que si solo queremos pasar el valor y no utilizarlo podemos usar:

console.log("Iniciando el proceso");
hola("Carlos")
  .then(hablar)
  .then(adios)
  .then((nombre) => {
    console.log("terminado el proceso");
  });

Y ya cada que queramos hablar solo tenemos que duplicar el hablar y asi podremos ver de forma mas legible todo.

Pero que pasa si tenemos un error? Pues para eso tenemos el REJECT donde por si falla podemos decirle que mande los parametros al error:

const hablar = (nombre) => {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("Bla Bla bla");
      //   resolve(nombre);
      reject("Hay Un error");
    }, 1000);
  });
};

Y ahora pondremos un catch que estara para asegurarse de que nuestro programa no falle y si falla recibir el error

console.log("Iniciando el proceso");
hola("Carlos")
  .then(hablar)
  .then(adios)
  .then((nombre) => {
    console.log("terminado el proceso");
  })
  .catch((error) => {
    console.error(error);
  });

Siempre que hagamos un THEN o hagamos una promesa tenemosq ue tener un catch para evitar que se propague y este se detenga y se envie a produccion. Todo puede fallar pero siempre con tus THEN y usar CATCH PARA SOBREVIVIR

lizardojara

Siempre promesas ❤️

David Andres Vargas

El then de una promesa puede recibir dos parametros: onSuccess y onError, pero tengan en cuenta para el examen que como solo se explico que se pasaba uno, entonces la respuesta sera UNO.

Diego Alejandro Cifuentes Arango

Primera ves tocando el backends despues de un buen tiempo con el fronted, aquí voy !

Fullstack MERN COÑOO !!!

Sebastián Mera

Todos los cursos de éste excelente profesor, necesitamos más!!

Jorge Eliecer Rangel Jimenez

function hello(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("hello", name);
      // resolve();
      reject("Error");
    }, 1500);
  });
}

function speaks(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("bla bla bla...");
      resolve(name);
    }, 1000);
  });
}

function bye(name) {
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      console.log("bye", name);
      resolve();
    }, 1000);
  });
}

/** Execute */
console.log("Init process...");
hello("George")
  .then(speaks)
  .then(speaks)
  .then(speaks)
  .then(speaks)
  .then(bye)
  .then(() => console.log("End process"))
  .catch((error) => console.log("Error", error));

Alexander Nova Arevalo

I love Async/await, ahhh y tambien las promesas 😛

Carmen Álvarez M.

De todas las explicaciones en el camino del JS Challenge, acerca de este tema, me quedo con esta 😃

Nicolás Posa

Promesas: Tenemos que pensar las promesas como valores que aun no conocemos. Es la promesa de que ahi va a haber un valor cuando una acción asincrona suceda y se devuelva.

Santiago López Daza

Ahora entiendo lo que me pasó, no le puse catch a las promesas de ella v;

Abner Pérez Rodríguez

Aparte de los métodos .then y .catch existe .finally que ejecutara hasta el final lo que se le pase por parámetro, sin importar si se resuelve o si falla la promesa.
Ejemplo:

Sin finally:

hola(‘Abner’)
  .then(hablar)
  .then(hablar)
  .then(adios)
  .then((nombre)=>{
    console.log(‘Proceso terminado’);
  })
  .catch(error =>{
    console.error(‘ha habido un error’);
    console.error(error);
  })

Con finally:

hola(‘Abner’)
  .then(hablar)
  .then(hablar)
  .then(adios)
  .catch(error =>{
    console.error(‘ha habido un error’);
    console.error(error);
  })
  .finally(()=>{
    console.log(‘Proceso terminado’);
  })

Resultado resuelto:

Iniciando el proceso…
Hola, Abner
Bla Bla Bla …
Bla Bla Bla …
Adios, Abner
Proceso terminado

Resultado fallado:

Iniciando el proceso…
Hola, Abner
Bla Bla Bla …
Ha habido un error: Hay un error
Proceso terminado

Jose Manuel Montaño Saenz

Promesas

Si nos encontramos con un callback hell debemos refactorizarlo y esto implica cambiar su sintaxis, en este caso con promesas resolveremos el problema.

function despertar(nombre) {
  return new Promise((resolve, reject) => {
    if(true) {
          setTimeout(() => {
      console.log(`${nombre} desperto`);
      resolve(nombre);
    }, 1000);
    } else {
      reject(new Error(`${nombre} no desperto`))
    }
  });
};

const vivio = (nombre) => {
  return new Promise((resolve, reject) => {
    if(true) {
      setTimeout(() => {
        console.log('Hicimos toda clase de cosas');
        resolve(nombre)
      }, 1000)      
    } else {
      reject( new Error(`${nombre} no hizo nada =(`))
    }
  })
};

function dormir(nombre) {
  return new Promise((resolve, reject) => {
    if(true) {
      resolve(nombre);
    } else {
      reject(new Error(`${nombre} no se ha dormido`));
    }
  })
};

despertar("Manuel")
  .then(vivio)
  .then(vivio)
  .then(dormir)
  .then(() => {
  console.log("Termino");
})
  .catch(error => {
    console.error(`Algo fallo ${error}`)
  });

Lo que hicimos en el código anterior es crear una función que retorna una promesa la cual recibe dos parametro que son resolve y reject, resolve es igual a promesa resuelta y reject la promesa falló.

luego hacemos el llamado de la función inicial que es despertar("Manuel") y dentro ponemos el argumento. A continuación con los .then() llamamos las otras promesas necesarias y por ultimo capturamos los posibles errores con el fin de no propagarlo.

Edwin Alexis Hernandez Vazquez

Llevo meses aprendiendo cosas nuevas con Js,soy un novato y es la primera vez que alguén explica claramente este tema de las promesas y asincronismo.

You are the best ❤️

Carlos Enrique Ramírez Flores

HE aqui mi codigo!

function hola(n) {
    return new Promise( (resolve, reject) => {
        setTimeout( () => {
            log('Hola '+n)
            resolve(n);
        },1000) 
    })

}
function hablar(n) {
    return new Promise( (resolve, reject) => {
        setTimeout(() => {
            log('BLA bla BLA');  
            resolve(n);  
        }, 1000);
    })
}

function adios(n) { 
    return new Promise( (resolve, reject) => {
        setTimeout(() => {
            log('Hemos terminado de ejecutar el proceso mi compa ' + n);  
            resolve(n);  
        }, 1000);

    })
}

function log(str) {
    console.log(str);
}
log('Inciando proceso');
hola('carlos')
    .then(hablar)
    .then(adios)
    .then((n) => log(n +'! Proceso terminado'))
    .catch( e => {
        log('Compa ocurrio un error!!!');
        console.log(e);
    } )```

andresmotiva

Yo lo entendí haciendo un ejemplo un poco más sencillo. Obviamente ya podríamos escalarlo a algo mucho más grande, pero esto me funciono a mí.

function thisIsAPromise(age, topAge){
	return new Promise((resolve, reject) => {
		if (age <= topAge){
			resolve('User is allowed.')
		} else {
			reject('User is denied.')
		}
	})
}
// Ejemplo permitido
thisIsAPromise(5, 15).then((mensaje) => {
	console.log(mensaje);
}).catch(function(mensaje){
	console.log(mensaje);
})
thisIsAPromise(20, 15).then((mensaje) => {
	console.log(mensaje);
}).catch(function(mensaje){
	console.log(mensaje);
})

Dogie

Casi como MAD MAX, que accurate XDD

nsaporiti76

“Recuerda que estamos en Node y esto es como Mad Max, todo puede petar en cualquier momento y romperse el proceso entero, si utilizas promesas, nunca olvides colocar CATCH”

Es genial este profesor! Ja…

Jesus David Urquijo Corredor

¿Existe alguna diferencia en usar function() {} a usar () => {} una arrow function?

Andrés Roldán Wilches