w3schools understanding then sincronas reject promises funciones from example ejemplo catch await async javascript promise

understanding - then javascript



¿Por qué el valor no está definido en.then() encadenado a Promise? (5)

Como su valor de datos es el valor de retorno del último .then() , su último .then() no tiene un valor de retorno válido.

Por lo tanto, puede agregar el valor de retorno en la última función .then() .

Dado

function doStuff(n /* `n` is expected to be a positive number */) { return new Promise(function(resolve, reject) { setTimeout(function() { resolve(n * 10) }, Math.floor(Math.random() * 1000)) }) .then(function(result) { if (result > 100) { console.log(result + " is greater than 100") } else { console.log(result + " is not greater than 100"); } }) } doStuff(9) .then(function(data) { console.log(data) // `undefined`, why? })

¿Por qué los data undefined están undefined en .then() encadenados a doStuff() call?


El doStuff está devolviendo la Promise . Pero, su última función then no devuelve ningún valor, por lo tanto, los data vienen como undefined .

En las promesas, el valor de los argumentos de la siguiente función es el valor devuelto de la función anterior.

function doStuff(n /* `n` is expected to be a positive number */) { return new Promise(function(resolve, reject) { setTimeout(function() { resolve(n * 10) }, Math.floor(Math.random() * 1000)) }) .then(function(result) { if (result > 100) { console.log(result + " is greater than 100") } else { console.log(result + " is not greater than 100"); } return result; }) } doStuff(9) .then(function(data) { console.log(data) // `90` })


El problema se enfrentaba:

return (new Promise(..)) //the promise we want to return .then(()=>undefined) // the promise were actually returning, which resolves to undefined

Como ya habrás notado, luego devuelve una nueva promesa. Esto tiene una buena razón, facilita el encadenamiento de promesas, por ejemplo:

getUser()//an asynchronous action .then(user=>login(user))//then if we get the user,promise to log in .then(token=>console.log("logged in,token is "+token) //then if we logged in, log it .catch(error=>"login failed");//catch all errors from above

Pero esto también crea la pequeña trampa que enfrentamos. La solución podría ser devolver la promesa original y no la nueva promesa devuelta automáticamente por .then (), ya que esto se resuelve como indefinido, ya que la función interna no devuelve algo explícitamente:

//what were doing: Promise.resolve(n*10)//the original promise resolves to n*10 .then(a=>undefined)//the then gets n*10 passed as a, but returns undefined .then(b=>console.log(b));//b will be undefined :0 //what we want: var promise=Promise.resolve(n*10); promise.then(a=>undefined);//a is n*10, this resolves to undefined promise.then(b=>console.log(b));//but this still logs n*10, as its the original promise :)

Entonces, como puede ver, para devolver la promesa original, simplemente la almacenamos en una variable, luego le asignamos un controlador .then, y todavía tenemos una referencia a la promesa original a la que podemos asignar otros controladores (o devolver).

En acción:

function doStuff(n /* `n` is expected to be a number */) { //create a new promise and store it var promise=new Promise(function(resolve, reject) { setTimeout(function() { resolve(n * 10) },1000); }); //add a then handler to this promise promise.then(result=>console.log(result + " is "+result<100?"not":""+" greater than 100")); //return the original one return promise; } doStuff(9).then(function(data) { console.log(data) //not undefined, as original promise })


No está devolviendo el resultado del .then () encadenado a la Promesa. Necesita agregar el resultado de retorno; a .then ()


Porque no se return ninguna Promise u otro valor desde .then() encadenado al constructor Promise .

Tenga en cuenta que .then() devuelve un nuevo objeto Promise .

La solución es return un valor u otra llamada de función que return un valor o Promise de .then() .

function doStuff(n /* `n` is expected to be a positive number */) { return new Promise(function(resolve, reject) { setTimeout(function() { resolve(n * 10) }, Math.floor(Math.random() * 1000)) }) .then(function(result) { if (result > 100) { console.log(result + " is greater than 100") } else { console.log(result + " is not greater than 100"); } // `return` `result` or other value here // to avoid `undefined` at chained `.then()` return result }) } doStuff(9) .then(function(data) { console.log("data is: " + data) // `data` is not `undefined` });