function f () {
return new Promise(function (resolve, reject) {
resolve(4);
})
}
function g () {
return f().then((res) => {return res;})
}
console.log(g());
This returns Promise { <pending> }
If I returned res(in the then) and then returned f(), why isn't the output 4?
a valid answer would be:
function f() {
return new Promise(function(resolve, reject) {
resolve(4);
})
}
function g() {
return f().then((res) => {
return res;
})
.then((res) =>{
console.log(res);
})
}
g()
Why? Any time you return from inside a then statement in a promise, it passes it to the next statement (then or catch). Try commenting out return res and you'll see that it prints undefined.
==============
However, with ES7 we can use async/await. We can replicate the above using the following code:
function f() {
return new Promise(function(resolve, reject) {
resolve(4);
});
}
async function g() {
var a = await f();
// do something with a ...
console.log(a);
}
g();
It's important to note that console.log(g()) still returns a promise. This is because in the actual function g, resolving the promise gets delayed and therefore doesn't block the rest of our code from executing but the function body can utilize the returned value from f.
NOTE: to run this you need node 7 and it should be executed with the --harmony-async-await option.
===========
EDIT to include new code snippet
Look at the following code. You must use then to access the previous objects - however, where you access it in this case is up to you. You can call then on each promise inside of Promise.all, in this case .then((userVictories) => ...).then(...) or once Promise.all returns. It's important to note that Promise.all returns once all promises it contains resolve.
var membersArray = groupFound.members;
Promise.all(membersArray.map((member) => {
return db.doneTodo.find({ 'victor._id': member._id }).then((userVictories) => {
return {
email: member.email,
victories: userVictories.length,
}
}).then(obj => {
/*
obj is each object with the signature:
{email: '', victories: ''}
calling this then is optional if you want to process each object
returned from '.then((userVictories) =>)'
NOTE: this statement is processed then *this* promise resolves
We can send an email to each user with an update
*/
});
}))
.then((arr) => {
/*
arr is an array of all previous promises in this case:
[{email: '', victories: ''}, {email: '', victories: ''}, ...]
NOTE: this statement is processed when all of the promises above resolve.
We can use the array to get the sum of all victories or the
user with the most victories
*/
})
Let's look at jQuery first as an introduction to learning promises.
What does this code return? What is the value of result?
var result = $('body');
Hint: It won't be the <body/> body HTML element.
result is a jQuery collection object. Internally it holds a reference to the body tag. But the actual result object is a collection.
What does this return?
var result = $('body').css('background', 'red');
Again, it returns a jQuery collection.
And this?
var result = $('body').css('background', 'red').animate({height: "20px"});
Same thing. A jQuery collection.
Now, what does this promise based code return?
var result = new Promise();
It's probably clear this returns a promise. But what about this code?
var result = new Promise().resolve().then(() => {
return 'Hello';
});
What is the value of result now? Hint: It's not the string 'Hello'.
It's a promise!
What does this return?
var result = new Promise().resolve().then(() => {
return new Promise().resolve();
}).then(() => {
return 'Hello';
}).catch(() => {
console.log('Something went wrong');
});
It returns a promise! Promises let us access values in functions that are called at later times. Until the function is executed, you won't have access to whatever the promise "returns," or "resolves" with. Once you enter a promise chain, you always have to use .then(fn) to handle the next step in the program flow.
Javascript is asynchronous. All top level code is executed in order without pausing. The promise resolves at a later time, long after your console.log has finished executing. To get values back, you need to stay in promise chain land:
g().then( result => console.log(result) );
