ES6: promesas

Venía todo muy bien en el curso pero en este video ya regresó el gndx de cursos pasados que le empieza a inventar nombres a todo sin aportar nada al contexto de la explicación.

**.then() ** es un método de la promesa que retorna anotherFunction(), no es “algo llamado then” y si bien es una ‘palabra reservada’, decir que es una ‘palabra reservada’ no aporta nada, es un método, y por ser un método se “llama” o “ejecuta” y recibe parámetros, en este caso un callback… no es tan díficil llamar a las cosas por su nombre.

Sigo la ruta de desarrollo web, y esta clase me parecio confusa ya que no se da contexto suficiente de lo que son las promesas y como funcionan, a lo mejor este curso de ECMAScript 6+ deberia ir mas adelante en la ruta, o por lo menos intentar aclarar todos los fundamentos de las promesas, por que la verdad para entender la clase siento que tengo que buscar documentación externa, y pues asi cual es el chiste

Cabe destacar que uno de los principales problemas que vinieron a solucionar las promesas fue el CallbackHell

CallbackHell, descripción gráfica:

Y aquí un recurso para ahondar en el tema: https://www.geeksforgeeks.org/what-to-understand-callback-and-callback-hell-in-javascript/

Creo que acabo de entrar al mid level de JS xd tengo miedo

Les dejo un video que me ayudo a entender un poco mejor este tema de las promesas
Curso JavaScript: 47. Promesas - #jonmircha

Hola Chicos! 😃
ES6

• Promesas

const anotherFuncion = () => {
    return new Promise((resolve, reject) => {
        if (false) {
            resolve("hey!!");
        } else {
            reject ( "whooooops!");
        }
    })
}

anotherFuncion()
.then(response => console.log(response))
.catch(err => console.log(err));

Hay que revisar esta clase. Las promesas hay que entenderlas bien, aqui no hay una buena explicacion.

No me gusto esta clase, realmente no entendí.

Gracias a los distintos aportes de mis compañeros de otras paginas o plataformas distintas eh podido tener un concepto mas claro.

Apunte en Notion

Link: https://pogolo.notion.site/10-ES6-promesas-083641f0b6f34e57ad9ba2eb67f061db

Promises, un antes y despues en JavaScript 💛

esta usando una funcion callback, callback es una funcion que usa a otra funcion como argumento.
En cuanto a los metodos then y catch, estos son metodos que pertenecen al objeto promise.
Estos metodos son usados para en la promise (anotherFunction), para mostrar el estado de esta promesa, que puede tener 2 estados, aceptada, que la retorna el METODO THEN y RECHAZADA que la retorna el METODO CATCH

Como no entendia de que estabamos hablando le pregunte mis dudas a chatGPT y entendi todo 😆

PD.: mi novio esta aca comprobando que chatGPT no me mienta

Incluso cuando tu ejecutas funciones en un orden especifico, si contienen promesas, javascript las ejecuta en un orden diferente:

const myPromise = () => new Promise((resolve, reject) => {
  if (false) {
    resolve('Hey! 😁');
  } else {
    reject('Whooops! 😞');
  }
})


console.log('First console')
myPromise()
	.then((response) => console.log(response))
	.catch((error) => console.error(error))
console.log('Second console')

Esto devolverá en la consola

-> First console
-> Second console
-> Hey! 😁

Esto debido al event loop de javascript.
Es algo a tener en cuenta cuando se quiere obtener información cuando se ejecuta una promesa, pero tal vez el valor todavía no esta disponible 🤔…

Le agregue un randomBoolean para interactuar mejor 😂, aquí lo pueden probar.

const helloPromise = () => {
  return new Promise( (resolve, reject) => {

    let randomBoolean = Math.random() > .5;

    if(randomBoolean) resolve('Hello!');
    else reject('Whoops!');

  });
}

helloPromise()
  .then(response => console.log(response))
  .catch(error => console.log(error));

Querido platzi y querido profesor… La clase no fue clara, sinceramente no se explico bien. Siento que para entenderla hay que ya conocer que son las promesas de antemano o se debería explicar mejor. Gracias

Punto a favor para omitir los semicolons 😆

Ella me dijo:

• Prometo amarte
• ¿Cuando?
• Hoy, mañana o nunca…

El asincronismo ha formado parte de la cultura mexa, al emplearla con la frase “ahorita”, es una acción que puede pasar hoy, mañana o nunca.

ES6: promesas

En ECMAScript 6, se introdujeron las promesas como una mejora en la forma en que se manejan las operaciones asíncronas en JavaScript. Las promesas son una manera más elegante y flexible de trabajar con código asíncrono en comparación con los callbacks anidados.

Una promesa en JavaScript es un objeto que representa la finalización o el fracaso eventual de una operación asíncrona. Una promesa puede tener tres estados:

1. Pendiente (Pending): Cuando se crea una promesa, comienza en este estado. Esto significa que la operación asíncrona aún no ha terminado.

2. Cumplida (Fulfilled): Una promesa entra en este estado cuando la operación asíncrona se completa con éxito. En este punto, se proporciona un valor resultante.

3. Rechazada (Rejected): Una promesa entra en este estado si la operación asíncrona falla. Se proporciona una razón del fracaso.

Aquí hay un ejemplo básico de cómo crear y usar una promesa en ES6:

// Crear una promesa
const myPromise = new Promise((resolve, reject) => {
  // Simular una operación asíncrona exitosa
  setTimeout(() => {
    const randomValue = Math.random();
    if (randomValue > 0.5) {
      resolve(randomValue);  // Resuelve la promesa con un valor exitoso
    } else {
      reject('El valor es demasiado bajo');  // Rechaza la promesa con una razón
    }
  }, 1000);
});

// Usar la promesa
myPromise.then(result => {
  console.log('Promesa cumplida:', result);
}).catch(error => {
  console.error('Promesa rechazada:', error);
});

En este ejemplo, myPromise simula una operación asíncrona que se resuelve o se rechaza según un valor aleatorio. Luego, usamos los métodos .then() y .catch() para manejar respectivamente el caso de cumplimiento y rechazo de la promesa.

Las promesas proporcionan una manera más legible y manejable de trabajar con código asíncrono en comparación con los callbacks anidados.

Además, han allanado el camino para características aún más poderosas, como el uso de async/await, que permite escribir código asíncrono de manera aún más sincrónica y fácil de entender.

Los métodos .then() y .catch()

Repasemos los métodos .then() y .catch() en el contexto de las promesas en JavaScript implementados en ES6.

1. .then(): El método .then() se utiliza para manejar el caso en el que una promesa se cumple (es decir, pasa al estado “Fulfilled”). Toma una función como argumento que se ejecutará una vez que la promesa se haya cumplido. Esta función toma como parámetro el valor con el que se resolvió la promesa.
   
   Ejemplo:

   myPromise.then(result => {
     console.log('Promesa cumplida:', result);
   });
   

En este caso, cuando myPromise se cumpla, la función dentro de .then() se ejecutará, y el valor con el que se resolvió la promesa se pasará como argumento a esa función.

1. .catch(): El método .catch() se utiliza para manejar el caso en el que una promesa es rechazada (es decir, pasa al estado “Rejected”). Al igual que .then(), toma una función como argumento que se ejecutará cuando la promesa sea rechazada. Esta función también toma como parámetro la razón del rechazo.

   Ejemplo:

   myPromise.catch(error => {
     console.error('Promesa rechazada:', error);
   });
   

En este ejemplo, si myPromise es rechazada, la función dentro de .catch() se ejecutará y recibirá la razón del rechazo como argumento.

Es importante destacar que .then() y .catch() devuelven nuevas promesas, lo que permite encadenar múltiples operaciones asíncronas de manera más legible. Por ejemplo:

myPromise
  .then(result => {
    console.log('Promesa cumplida:', result);
    return result * 2;  // Retorna un nuevo valor para ser utilizado en el siguiente .then()
  })
  .then(newResult => {
    console.log('Nuevo resultado:', newResult);
  })
  .catch(error => {
    console.error('Promesa rechazada:', error);
  });

En este ejemplo, el segundo .then() se ejecutará después del primero y recibirá el valor multiplicado por 2 que se devolvió en el primer .then().

La combinación de .then() y .catch() permite manejar tanto los casos de éxito como los casos de error en las promesas, lo que hace que el código asíncrono sea más manejable y comprensible.

Sigamos con el aprendizaje. 👨‍💻

Les voy a dar un ejemplo algo complicado de entender, pero si lo entienden los felicito de verdad:

function verSiHayTorillas(tortilla) {
    if (tortilla === 0 || typeof tortilla !== "number" || tortilla > 10) return "no hay tortillas"
    else return tortilla
}

let dinero = 100

function irPorTortillas(tortillas) {
    let tortillasRevisadas = verSiHayTorillas(tortillas)
    dinero = dinero - tortillasRevisadas
    if(dinero <= 0) return Promise.reject(`Tienes ${dinero} de plata, no te alcanza para comprar tortillas`)
    if(tortillasRevisadas !== tortillas) return Promise.reject(tortillasRevisadas)

    return new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve(tortillasRevisadas)
        }, 0| Math.random()*1000);
    })
}

irPorTortillas(5)
    .then((tortilla) => {
        console.log(`Compraste Q${tortilla} de tortilla`)
        return irPorTortillas(4)
    })
    .then((tortilla) => {
        console.log(`Compraste Q${tortilla} de tortilla`)
        return irPorTortillas(1)
    })
    .then((tortilla) => {
        console.log(`Compraste Q${tortilla} de tortilla`)
        return irPorTortillas(2)
    })
    .then((tortilla) => console.log(`Compraste Q${tortilla} de tortilla`))
    .catch((err) => console.error(err))

CODIGO CON SWITCH

function promesa (){
    return new Promise((resolve, rejec) =>{
        switch(resolve){
            case resolve:
                console.log('Qué pasa capo, crack, genio!');
            break;
            case rejec:
                console.log('No se pudo!');
            break;
            default:
            }
    })
}
promesa()
.then(response => console.log(response))
.catch(rejec => console.log(rejec))

Las promesas explicadas a detalle en código
.

me ayudo full
https://www.youtube.com/watch?v=pHBmmbDQl0o

En vez de hacer esto:

myPromise()
	.then((response) => console.log(response))
	.catch((error) => console.error(error))

Se puede hacer esto, si el campo que se va a pasar la función es el mismo:

myPromise()
	.then(console.log)
	.catch(console.error)

Código: Es una función que recibe como parámetro otra función y la ejecuta según sea el caso

• Es un objeto que representa una operación asincrónica (como traer una imagen a una página web, la página carga mientras la operación asincrónica se resuelve) y puede estar en 3 estados

1. Pendiente - pending
2. Resuelta - fulfilled/resolve
3. rechazada - rejected

• Son para manejar errores de operaciones asincrónicas

ejemplo mas real de las promesas:

const axios = require('axios');

axios.get('https://api.example.com/data')
  .then(response => {
    console.log('Datos recibidos:', response.data);
  })
  .catch(error => {
    console.error('Error al cargar datos:', error);
  });

Promesa en JavaScript. Veamos cómo funciona paso a paso:

1. Se define una función llamada anotherFunction utilizando la sintaxis de una función flecha (=>).

2. Dentro de anotherFunction, se crea una nueva promesa utilizando la clase Promise. La promesa recibe una función con dos parámetros, resolve y reject, que son funciones de control utilizadas para indicar si la promesa se resuelve correctamente o se rechaza.

3. Dentro de la función de la promesa, se coloca una condición (if) que se evalúa como true. Si la condición es verdadera, se llama a resolve con el argumento 'Hey!', lo que indica que la promesa se resuelve correctamente.

4. Si la condición es falsa, se llama a reject con el argumento "Whoops!", lo que indica que la promesa se rechaza.

5. Se llama a la función anotherFunction sin pasarle ningún argumento, lo que devuelve una promesa.

6. Se encadena el método then a la promesa devuelta. El método then recibe una función de callback que se ejecutará si la promesa se resuelve correctamente. En este caso, la función de callback toma el argumento response y lo muestra en la consola utilizando console.log.

7. Se encadena el método catch a la promesa. El método catch recibe una función de callback que se ejecutará si la promesa se rechaza. En este caso, la función de callback toma el argumento err y lo muestra en la consola utilizando console.log.

En resumen, el código crea una promesa en anotherFunction y la resuelve con 'Hey!' si una condición es verdadera, o la rechaza con "Whoops!" si la condición es falsa. Luego, se utiliza el método then para mostrar el valor resuelto en la consola y el método catch para mostrar cualquier error en la consola. En este caso, dado que la condición es verdadera, el resultado final impreso en la consola sería 'Hey!'.

me sentia feliz por mi avanze, pero llegando a esta clase, me estoy desanimando, no le entiendo mucho

Esto de tirar teoria PORQUE SI… sin aplicarlo a algo practico no sirve para nada. Quien se va a acordar este choclo de cosas sin sentido y con poca explicacion sin siquiera saber su practicidad? 1 estrella

https://platzi.com/clases/1759-fundamentos-node/25189-callbacks/
les recomiendo ver ese curso de fundamentos de node.js para entender mejor como funciona y que utilidad tienen las promesas.
también les recomiendo ver el video 3 que habla de como funciona el event loop. para esclarecer mas los porque son importantes las promesas en javascript asincronico.
por otro lado, lei los comentarios y es cierto que oscar patino un poco. nos explico medio asi nomas. pero esque esta clase no es para profundizar. es para introducir un tema. lo que si fallo es en no aclara eso. deberia haber avisado “muchachos este tema es importante y complejo, aca los vamos a ver por arriba y mas adelante en la ruta vamos a profundizar” y tambien es cierto que patino con alguno terminos. en eso deberia ser mas claro por ejemplo : "then es un metodo de las promesas y se pueden encadenar varios"
pero bueno, mi recomendacion es esa. miren esos video mientras toman un cafecito y muchas cosas de aca van a quedar mucho mas claras. saludos!

Sí, ¡claro que sí! Las promesas son una característica introducida en ES6 (ECMAScript 2015) que permite trabajar con operaciones asíncronas de una manera más fácil y estructurada. En esencia, una promesa es un objeto que representa el resultado pendiente de una operación asíncrona.

En términos simples, una promesa puede estar en uno de tres estados:

Pendiente: La promesa está en espera de que se resuelva o se rechace.
Resuelta: La promesa se ha resuelto satisfactoriamente y devuelve un valor.
Rechazada: La promesa ha sido rechazada y devuelve una razón del porqué ha sido rechazada.
Para trabajar con promesas, se utiliza el objeto Promise. Este objeto tiene un constructor que acepta una función como argumento que a su vez tiene dos parámetros, resolve y reject. Estas dos funciones se utilizan para indicar si la promesa ha sido resuelta o rechazada, respectivamente.

Un ejemplo de cómo utilizar promesas para manejar una operación asíncrona es el siguiente:

const promesa = new Promise((resolve, reject) => {
  // Hacer una operación asíncrona aquí, como una petición AJAX

  if (operacionExitosa) {
    resolve(resultado); // Si la operación es exitosa, resolver la promesa con un valor
  } else {
    reject(razon); // Si la operación falla, rechazar la promesa con una razón
  }
});

promesa.then(resultado => {
  // El resultado de la promesa se maneja aquí si se resuelve exitosamente
}).catch(razon => {
  // El motivo del rechazo de la promesa se maneja aquí si la promesa es rechazada
});

En el ejemplo anterior, promesa es una instancia de un objeto Promise. Se crea una promesa que representa una operación asíncrona, y se utilizan las funciones resolve y reject para indicar si la operación fue exitosa o no. Luego, se usa el método then para manejar el resultado si la promesa se resuelve con éxito, y el método catch para manejar el motivo del rechazo si la promesa es rechazada.

En resumen, las promesas en JavaScript permiten manejar operaciones asíncronas de una manera más estructurada y fácil de leer, y han mejorado la forma en que se manejan las tareas asincrónicas en JavaScript.

En el segundo then, ¿Qué se pasaría como response?, ¿Acaso el valor retornado del primer then?.

Minuto 7
No se le llama concatenar
Se le llama encadenar

Por lo que entendí, vendría siendo como una condicional pero asíncrona.

Promesa=Condición
.then= if
.catch=else

Realmente no me quedó claro pero investigaré por otras fuentes para reforzar

Para clarificar mejor los conceptos les recomiendo ir a la clase de Que son las promesas del Curso de Asincronismo con JavaScript donde se explica más detalladamente este concepto y sus elementos.

creo que es muy avanzado el uso de promises por ahora ya que es más útil con los asincronismos…que todavía no vimos en la ruta

YO ENTENDI ASI LA CLASE ESPERO PUEDA AYUDAR EN ALGO SI QUIZA NO ENTENDIERON…

Para los que como yo cuando terminaron esta clases se quedaron con muchas dudas de como funcionan las promesas, les dejare un video tutorial que me ayudó bastante a entenderlo.

https://youtu.be/rKK1q7nFt7M

Aunque no lo creas, las promesas de JavaScript son una poderosa característica que te ayudarán a ejecutar código asincrónico en JavaScript. En la mayoría, si no en todas las entrevistas para empleos que usen JS, tu entrevistador probablemente hará una pregunta sobre las promesas.

ufff interesante este tema de las promesas, por experiencia propia tomando ya otros cursos estoy seguro que habrá un par de clases o curso mismo dedicado especialmente a esto. Pues este curso es solo para mostrarnos la evolucion de JS y porque aun sigue siendo el mas usado desde el '94

Promesa: Una promesa en JavaScript representa una operación asíncrona que puede tener éxito (resolverse) o fallar (rechazarse). En ese sentido, puedes considerar una promesa como una especie de “condición futura”. No es una condición en el sentido tradicional, ya que no es una evaluación inmediata de una expresión booleana, sino que espera a que se complete una operación asíncrona.

.then: El método .then se usa para encadenar acciones que se ejecutarán una vez que la promesa se resuelva exitosamente. Puedes pensar en él como un bloque de código que se ejecuta si la “condición futura” (la promesa) se cumple. Sin embargo, este bloque de código se ejecutará asincrónicamente, después de que la promesa se resuelva.

.catch: El método .catch se utiliza para manejar errores que ocurran durante la ejecución de la promesa. Es similar a un bloque de código que se ejecuta en un “else” después de que la “condición futura” falle (la promesa se rechace). Al igual que .then, este bloque se ejecutará asincrónicamente después de que ocurra un error.

Aquí tienes un ejemplo que muestra cómo se pueden usar promesas en combinación con condiciones para lograr un comportamiento condicional asíncrono:

function realizarOperacion() {
  return new Promise((resolve, reject) => {
    // Simulando una operación asíncrona
    setTimeout(() => {
      const exito = true; // O alguna condición lógica
      if (exito) {
        resolve("Operación exitosa");
      } else {
        reject("Operación fallida");
      }
    }, 1000); // Simulación de retardo de 1 segundo
  });
}

realizarOperacion()
  .then((resultado) => {
    console.log(resultado); // Se ejecuta si la operación tiene éxito
  })
  .catch((error) => {
    console.error(error); // Se ejecuta si la operación falla
  });

En resumen, las promesas en JavaScript se utilizan para manejar operaciones asíncronas y proporcionan un flujo de control más ordenado que las devoluciones de llamada (callbacks) anidadas. Aunque se pueden usar en combinación con condiciones para lograr un comportamiento condicional asíncrono

Siendo sincero esta clase no entendí a efectos prácticos cuando se utilizaría, el ejemplo es bastante malo para explicarlo

Es difícil de entender sin un caso práctico pero pinta útil

https://www.youtube.com/watch?v=frm0CHyeSbE

Este video tal vez les ayude con el tema, mucha suerte!

Aqui doy un ejemplo explicano de otra forma el ejemplo del profesor. la explicaciòn del profesor es buena.

Creo que falto definir los estados de las promesas. resuelto, rechazado y pendiente.

pero siempre va el resolve y el reject o no, en cualquier codigo

esta parte es bastante signos lo que pide en la funcion

como el profesor va a decir algo llamado then?
platzi, soy muy fan de la escuela, pero estos cursos pasan por un filtro antes de publicarse?

📗 Archivos del Proyecto 📗

Pasos 📌

• • Dentro de la carpeta es6, crear el archivo llamado: 06-promises.js
  • • ◦ El código de los ejercicios queda:

//Compilar: seleccionar el código + click derecho + Run Code

//Ejercicio #1
const anotherFunction = () => {
	return new Promise((resolve, reject) => {
		if(false) {
			resolve('Hey!!');
		} else {
			reject('Whoooops!');
		}
	})
}

anotherFunction()
	.then(response => console.log(response))
	.catch(err => console.log(err));

/*output con if(true):
Hey!!
*/

/*output con if(false):
Whoooops!
*/

“Algo llamado then” Explicación chafa, que no dice nada. -_-

En JavaScript, una promesa es un objeto que representa la eventual finalización (o falla) de una operación asíncrona y la obtención de su resultado. Es una forma de trabajar con código asíncrono de manera más estructurada y fácil de manejar.

Una promesa puede estar en uno de los siguientes estados:

Pendiente (pending): Estado inicial de una promesa, mientras la operación asíncrona está en progreso. La promesa aún no se ha resuelto ni se ha rechazado.

Cumplida (fulfilled): La operación asíncrona se completó con éxito y se cumplió la promesa. En este estado, la promesa tiene un valor de resultado asociado.

Rechazada (rejected): La operación asíncrona falló o fue rechazada, y se rechazó la promesa. En este estado, la promesa tiene un motivo de rechazo asociado, que generalmente es un objeto de error que indica la razón del rechazo.

Una promesa se crea utilizando el constructor Promise. Toma una función con dos parámetros: resolve y reject. Dentro de esta función, se realiza la operación asíncrona y, una vez que se completa, se llama a resolve para cumplir la promesa o a reject para rechazarla.

Aquí hay un ejemplo básico de cómo crear y utilizar una promesa en JavaScript:

const miPromesa = new Promise((resolve, reject) => {
  // Simulamos una operación asíncrona que tarda 2 segundos
  setTimeout(() => {
    const exito = true;

    if (exito) {
      // La operación se completó exitosamente
      resolve('¡Promesa cumplida!');
    } else {
      // La operación falló
      reject('Hubo un error en la promesa.');
    }
  }, 2000);
});

// Manejo de la promesa
miPromesa.then(resultado => {
  console.log(resultado); // '¡Promesa cumplida!'
}).catch(error => {
  console.log(error); // 'Hubo un error en la promesa.'
});

En este ejemplo, creamos una promesa miPromesa que se resuelve después de 2 segundos. En el constructor de la promesa, se pasa una función que simula una operación asíncrona. Si la operación tiene éxito, llamamos a resolve y pasamos el mensaje de éxito como argumento. Si la operación falla, llamamos a reject y pasamos un mensaje de error.

Luego, utilizamos los métodos then y catch para manejar el resultado de la promesa. El método then se ejecuta cuando la promesa se cumple, y el método catch se ejecuta cuando la promesa es rechazada. En cada caso, imprimimos el resultado o el error correspondiente en la consola.

Las promesas proporcionan una forma más elegante y legible de trabajar con código asíncrono, evitando el anidamiento excesivo de callbacks y facilitando el manejo de errores. Además, las promesas son la base de características más avanzadas de JavaScript, como async/await.

Se me ocurrió este pequeño ejemplo para practicar, espero les resulte divertido jaja

const detonante = Math.floor(Math.random()*10);

function explode(trigger){
    return new Promise((resolve ,reject)=>{
        if(trigger > 4){
            resolve("¡¡¡BOOOOOOOOOOOOOM!!!");
        }
        else{
            reject("failed bomb");
        }
    })
}

explode(detonante)
    .then(response => console.log(response))
    .catch(err => console.log(err));

Aquí es donde uno dice “Ese dinero se perdió” !!!

Aca mi aporte con async await y manejo de errores con try catch

const myAsyncFunction = async() => {
  try {
      let myPromise = new Promise((resolve, reject) => {
        var condition = true ? 
        resolve('La promesa se resolvió exitosamente') 
         : 
        reject(`La promesa fue rechazada`);
      });
      let result = await myPromise;
      console.log(result);
  } catch (err){
      console.log(err)}; 
  }
  
  myAsyncFunction();

Lo que aprendí:
El parámetro de una promesa es una función y esa función define el trabajo que se va realizar dentro de la promesa y esa función tiene 2 argumentos resolve y reject. Cuando se completa el trabajo de esa función se llama a la funcion resolve o reject para cambiar el estado de la promesa a resuelto o rechazado

Esta clase debo aceptar que si fue algo confusa…pero leyendo los recursos de la clase y de las otras he podido entender bien todo. Sugiero que lean esa descripción, ya que se explica más a detalle e incluso más cosas de las clases.

Mi resumen:

La verdad si deja con mal sabor de boca este video buscando en Youtube yo recomendaria JhonMircha y tambien este video que me parecio super genial la manera en como lo explica y el ejemplo que coloca
https://www.youtube.com/watch?v=p3Oq3AfuteA&t=20s

11/35 ES6: promesas

Una promesa en JavaScript es una forma de manejar el asincronismo en el código. Las promesas se representan como objetos que pueden generar un valor único en el futuro, y tienen dos estados:

• resueltas
• rechazadas

En caso de que haya alguna razón por la que no se hayan resuelto.

Para utilizar las promesas, se utiliza la clase Promise y sus métodos then and catch, los cuales se añadieron en ES6 para solucionar el problema del Callback hell.

La clase primse recibe como argumento una función que tiene dos parámetros:

1. resolve: que se ejecuta cuando la promesa se resuelve.
2. reject: que se ejecuta cuando la promesa se rechaza.

const promesa = () => {
return new Promise((resolve, reject) => {
if (algo) {
resolve("La promesa se ha resuelto")
} else {
reject("La promesa se ha rechazado")
}
})
}

promesa()
.then(respuesta => console.log(respuesta)) // En caso de que se ejecute resolve
.catch(error => console.log(error)) // En caso de que se ejecute reject

En este ejemplo, la promesa devuelve un mensaje dependiendo del valor de la variable “algo”. Luego, se utiliza el método then para mostrar la respuesta en caso de que se resuelva la promesa, y el método catch para mostrar un error en caso de que se rechace la promesa.

Uff lamentablemente la peor clase que he visto en Platzi hasta ahora. No se explica absolutamente nada. Si alguien sale de esta clase entendiendo que es una promesa, lo sabía de antemano o es un genio.
Está bien que te dirijan a otros cursos para complementar lo aprendido, pero es que aquí no sales ni con conceptos básicos, no hay nada que complementar, tienes que ir a buscar el conocimiento a otra parte.

La explicacion pudo ser un poco confusa pero no hay porque dar un feedback de esa manera, se nota que gndx a mejorado mucho y que se esfuerza por segui haciendolo. En todos las clases y cursos le dejan comentario de que ha mejorado. Traten como les gustaria que los trataran.

No entiendo :C esta confusa la clase,

La analogía de la promesas en JS, con la cual entendí hace años que aprendí en otro curso de Platzi y de esta forma le explicaba a mis compañeros de trabajo.

La promesa de javascript:
Comenzaré inmediatamente a trabajar en la promesa, pero sí o sí te responderé. Sea rechazada o aprobado, pero sí o sí te responderé.

el ejemplo esta bien pero le falta asi qeu me puse a investigar un poco mas como funcionana las promesas y me cree este ejemplo

const data = [
  {
    nombre: "fere",
    edad: 30,
    carrera: "Tecnolgias Computacionales",
  },
  {
    nombre: "venusina",
    edad: 22,
    carrera: "psicologia",
  },
  {
    nombre: "jessi",
    edad: 40,
    carrera: "modelo",
  },
];

const getdatos = () => {
  return new Promise((resolve, reject) => {
    setTimeout(() => { // hago un retardo de 5 segundos
      resolve(data);
    }, 5000);
  });
};

getdatos()
  .then((data) => console.log(data))
  .catch((err) => console.log(err));

y tambien me encontre este video en youtube
que esta super bien explicado

https://www.youtube.com/watch?v=rKK1q7nFt7M

espero a alguien le ayude com a mi

Les dejo mis apuntes que tome de un curso de freecodecamp de las promesas. Te lo explican con peras y manzanas.

/*Una promesa es un objeto de javascript que representa el eventual resultado (o error) de una operación asíncrona.
Los tres posibles estados de una promesa son: Pendiente, Cumplida, Rechazada.
El objeto de la promesa se asocia a una función callback que se ejecuta al cumplirse la operación asincrona.
Una función callback es una función que se pasa a otra función como argumento y luego se ejecuta dentro de la
función externa*/
/*Las promesas tienen un método .then(), con el cual podemos decidir qué ocurre cuando se completa la promesa (éxito o error)*/

//Primer ejemplo
const promesaCumplida = false;
const miPromesa = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (promesaCumplida) {
      resolve('¡Promesa cumplida!');
    } else {
      reject('Promesa rechazada...');
    }
  }, 3000);
});

function manejarResolve(valor) {
  console.log(valor);
}
function manejarReject(razonRechazo) {
  console.log(razonRechazo);
}

miPromesa.then(manejarResolve, manejarReject);
// En el ejemplo de arriba, los parametros resolve y reject son funciones que representaran el resultado de la promesa.
// En el metodo .then(), el parametro (valor) de la funciones manejarResolve y manejarReject representa el argumento que se le pasa a resolve/reject.

//Segundo ejemplo

const estatusPedido = function() {
  return Math.random() < 0.8;
};

const miPedidoDePizza = new Promise((resolve, reject) => {
  setTimeout(() => {
    if (estatusPedido()) {
      resolve("¡Pedido exitoso! Su pizza esta en camino.");
    } else {
      reject("Ocurrio un error. Por favor intente nuevamente.");
    }
  }, 3000);
});

const manejarPedido = (mensajeDeConfirmación) => {
  console.log(mensajeDeConfirmación);
};
const rechazarPedido = (mensajeDeError) => {
  console.log(mensajeDeError);
};

//Primera manera de usar el .then()
//miPedidoDePizza.then(manejarPedido, rechazarPedido);

//Segunda manera de usar el .then()
 miPedidoDePizza.then(manejarPedido).then(null, rechazarPedido);

 //Tercera manera de hacerlo con .catch() el cual es un método de promesa que solo se ejecuta si la promesa es rechazada.
 //miPedidoDePizza.then(manejarPedido).catch(rechazarPedido);


 //Ejemplo 3: Otra manera de hacerlo es definir una función que en su return regrese una promesa.
 const anotherFunction = () => {
  return new Promise((resolve, reject) => {
    if(true) {
      resolve("Operación terminada con exito.");
    } else {
      reject("Operación rechazada.");
    }
  });
 };

 //En este caso ejecutamos la función para que devuelva la promesa.
 anotherFunction()
  .then(respuesta => console.log(respuesta))
  .catch(error => console.warn(error));

Espero sea de ayuda para enteder esta clase, en mi opinión si estás empezando de cero como yo, tómalo como un previo al tema de asincronismo en JS, en el siguiente curso se abordará a fondo el tema.

/* PROMESAS O PROMISES.*/

const anotherFunction = () => {


    //Retornar una promesa (Algo que va a pasar, puede ser hoy, mañana o nunca), que puede ser resuelta (resolve) o rechazada (reject).// 
    return new Promise ((resolve, reject)=>{


        //Si la promesa es resuelta (true que viene siendo resolve)// 
        if (false) {
            resolve('a webo!!!') 

        // Si la promesa es rechazada (false que viene siendo reject)//    
        } else {

            reject('chale, no se pudo');
        }
    }) 
}


//Aquí se ejecuta la promesa, usando las palabras reservadas 'then' y 'catch'//
anotherFunction()


 .then(response => console.log('Se resolvió la promesa, ' + response)) 
 //Si la promesa es resuelta (true), se ejecutará '.then' y el mensaje asignado al 'resolve' se manda a llamar con 'response'.//



 .catch(error => console.log('No se resolvió la promesa, ' + error)); //Si la promesa no es resuelta o fallida (False), se ejecutará '.catch' y el mensaje asignado al 'reject' se manda a llamar con 'error'.// 

Dejo mi aporte, comentado

//Promesas - es una forma de manejar el asincronismo
const anotherFunction = () => {
    return new Promise((resolve, reject) => {
        if (true /*something*/) { //Si se ejecuta con exito
            resolve("Exito - Funcionó!")
        } else { //Si no se ejecuta con exito - Error
            reject("Error - No funcionó");
        }
    })
}

anotherFunction()
    .then(response => console.log(response))//En caso que se ejecute Resolve
    .catch(error => console.log(error)) //En caso que se ejecute Reject

Veníamos bien con las clases pero… En este caso les recomiendo leer la explicación escrita abajo de la clase. Van a entender mejor que con el video y las analogías de “hoy, mañana o nunca” …

Promesas
En JavaScript, una promesa es un objeto que representa el resultado de una operación asíncrona. Una promesa tiene dos estados: pendiente (pending) y cumplida o rechazada (fulfilled or rejected). Una vez que una promesa se ha cumplido o rechazado, su estado no puede cambiar.

Una promesa se crea mediante la función Promise y se le pasa como argumento una función que recibe dos callbacks, resolve y reject. Dentro de esta función, se ejecuta la operación asíncrona y, dependiendo del resultado, se llama a resolve o reject.

Una vez creada la promesa, podemos utilizar sus métodos then y catch para especificar qué hacer cuando la promesa se cumple o rechaza.

Operaciones Asincronicas

Las operaciones asíncronas son aquellas que no bloquean la ejecución del código mientras se realizan. Esto significa que el código continúa ejecutándose mientras se realiza la operación asíncrona, en lugar de esperar a que se complete para continuar.

Existen varios ejemplos de operaciones asíncronas en JavaScript, como las peticiones HTTP, las operaciones con una base de datos, el acceso al sistema de archivos, entre otros.

En JavaScript, las operaciones asíncronas se manejan principalmente mediante callbacks y promesas. Los callbacks son funciones que se pasan como argumentos y se ejecutan una vez que la operación asíncrona ha terminado. Las promesas, por otro lado, son objetos que representan el resultado de una operación asíncrona y proporcionan una forma más ordenada y sencilla de manejar el flujo de control.

Callbacks

En programación, un callback es una función que se pasa como argumento a otra función y que se ejecuta una vez que se completa una tarea específica. Es una forma de manejar el asincronismo en JavaScript.

Un ejemplo común de uso de callbacks es cuando se realiza una petición HTTP mediante JavaScript. La petición se realiza de forma asíncrona, lo que significa que el código continúa ejecutándose mientras se espera la respuesta del servidor. Una vez que se recibe la respuesta, se ejecuta una función de callback que procesa la información recibida

const mipromesa = () =>{
return new Promise((resolve, reject) => {
const num =9;
const num2=4;

    if (num <num2){
        resolve("bien se cumplio")
    }
    else{
        reject("no se cumplio la promesa")
    }
})

}
mipromesa()
.then(respuesta => console.log(respuesta))
.catch(error => console.log(error))

mi aporte de como segun yo entendi lo que era una promesa, si alguien me quiere corregir ningun problema jajaja

Esta clase, por el momento rompe todo el curso. No hay explicación de que es una promesa, no se explica el uso de las palabras reservadas que hasta el momento son nuevas para quienes siguen la ruta de JavaScript o Desarrollo Web. Deberían rehacerla o quitarla y ponerla luego del curso de asincronismo.

promiseFn().finally(etc...)

Se ejecuta tanto si da error como si la solicitud fue exitosa.

Sus promesas nunca sucedieron 💔

ademas de usar catch podemos usar finally que practicamente ejecuta en cualquier caso una funcion cuando termina la promesa.

.finally(() => {
    console.log('Experiment completed');
  });

Esta clase necesita ser revisada, todo el tema fue confuso.

La verdad me costo entenderlo, pero esete link lo explica bastante detallado y facil de entender 😃

Para entender las promesas es muy importante que tengas claro los conceptos de sincronismo y asincronismo, aquí un artículo que lo explica

Todo se jodio desde el 5:44.

Vengo del curso de Asincronismo con JavaScript y ahí verán mas a fondo las promesas! Ánimos, que con esto trabajaremos en un futuro!

Si aún no sabes en qué consiste el asincronismo, no te preocupes, existen cursos completos en los que se profundiza mas en el tema:

• Curso de JavaScript Engine (V8) y el Navegador

• Curso de Asincronismo con JavaScript

-No pierdas animos continue, te estoy viendo.
💚Y Nunca Pares de aprender 💚

Repositorio github del profe → Archivo manejado en la clase:

• 06-promises.js

Best Teacher Bro!!!

Esta clase si estuvo algo confusa, habrá que ver esos otros cursos,

Las promesas explicadas a detalle en código
.

Consumidores: then y catch

Un objeto Promise sirve como enlace entre el ejecutor y las funciones consumidoras, que recibirán un resultado o un error. Las funciones de consumo pueden registrarse utilizando los métodos .then y .catch

then

El más importante y fundamental es .then.

La sintaxis es:

promise.then(
  function(result) { /* manejar un resultado exitoso */ },
  function(error) { /* manejar un error */ }
);

El primer argumento de .then es una función que se ejecuta cuando se resuelve la promesa y recibe el resultado.

El segundo argumento de .then es una función que se ejecuta cuando se rechaza la promesa y recibe el error.

Por ejemplo, aquí hay una reacción a una promesa resuelta con éxito:

let promise = new Promise(function(resolve, reject) {
  setTimeout(() => resolve("hecho!"), 1000);
});

// resolve ejecuta la primera función en .then
promise.then(
  result => alert(result), // muestra "hecho!" después de 1 segundo
  error => alert(error) // no se ejecuta
);

catch

Si solo nos interesan los errores, entonces podemos usar null como primer argumento: .then(null, errorHandlingFunction). O podemos usar .catch(errorHandlingFunction), que es exactamente lo mismo:

et promise = new Promise((resolve, reject) => {
  setTimeout(() => reject(new Error("Vaya!")), 1000);
});

// .catch(f) es lo mismo que promise.then(null, f)
promise.catch(alert); // muestra "Error: ¡Vaya!" después de 1 segundo

La llamada .catch(f) es un análogo completo de .then(null, f), es solo una abreviatura.

Pirámide infernal

A primera vista, es una forma viable de codificación asincrónica. Y de hecho lo es. Para una o quizás dos llamadas anidadas, se ve bien.

Pero para múltiples acciones asincrónicas que van una tras otra, tendremos un código como este:

loadScript('1.js', function(error, script) {

  if (error) {
    handleError(error);
  } else {
    // ...
    loadScript('2.js', function(error, script) {
      if (error) {
        handleError(error);
      } else {
        // ...
        loadScript('3.js', function(error, script) {
          if (error) {
            handleError(error);
          } else {
            // ...continua después de que se han cargado todos los script (*)
          }
        });

      }
    });
  }
});

A medida que las llamadas se anidan más, el código se vuelve más profundo y difícil de administrar, puede incluir más bucles, declaraciones condicionales, etc.
A esto se le llama “infierno de callbacks” o “pirámide infernal”