I have removed error handling code as it is working (for simplicicty).
I have a function createOrder() which creates a new record in my MongoDB collection:
createOrder = order => new Promise((resolve, reject) => {
Order.create({orderId: order});
resolve();
});
getOrders() function that adds all current orders in the database to an array.
getOrders = _ => new Promise((resolve, reject) => {
Order.find({buyerId: curUser.userId}, (err, orders) => {
orders.map(order => order.status != 'cancelled' ? curUserOrders.push(order) : null);
});
resolve();
});
An external javascript file to post an order:
postOrder = () => {
window.location = `/new_order/order=${JSON.stringify(itemArray)}`;
}
and the node application that "gets" the request:
app.get("/new_order/order=:order", (req, res) => {
createOrder(JSON.parse(req.params.order))
.then(getOrders)
.then(_ => res.render("userprofile", {user : curUser, orders: curUserOrders}));
});
when i post a new order the postOrder() function is triggered and "userprofile" is displayed but none of the orders are displayed until i refresh the page again. Im still learning how promises work so im guessing the problem lies there. Please help :).
Promises are used for asynchronous operations, but your example resoves the promise right away.
createOrder = order => new Promise((resolve, reject) => {
Order.create({orderId: order});
resolve();
});
You would write the create function like:
createOrder(order).then(()=>{
// The asynchronous operation is completed!
})
But in your case it would happen the following:
createOrder = order => new Promise((resolve, reject) => {
//Start the asynchronous operation ....
Order.create({orderId: order});
//... but you just resolve the operation right away.
resolve();
});
A better example is probably the other function:
getOrders = _ => new Promise((resolve, reject) => {
Order.find({buyerId: curUser.userId}, (err, orders) => {
orders.map(order => order.status != 'cancelled' ? curUserOrders.push(order) : null);
});
// You just resolve without waiting for the callback of find.
resolve();
});
What you want:
getOrders = _ => new Promise((resolve, reject) => {
Order.find({buyerId: curUser.userId}, (err, orders) => {
orders.map(order => order.status != 'cancelled' ? curUserOrders.push(order) : null);
// Here we call resolve inside the callback and we wait for the find method and return the orders to the getOrders().then(orders => {}) call.
resolve(orders);
});
});
A Promise is what the name suggests, it provides you with a promise, that it will be fulfilled (resolved) at some point in the future. So you always want to wait with the resolve function until all operations are completed without errors.
Use it as callback like this
createOrder = order => new Promise((resolve, reject) => {
Order.create({orderId: order}).then(()=>{resolve});
});
Related
I currently have a few functions that return promises such as the below:
function action_one(){
return new Promise((resolve, reject)->{
...
});
}
I want to be able to wait on one before doing the next promise without nesting them. I had searched for some solutions, one being PromiseAll() but it does not seem to do it in order. Another solution was to do the following:
promise.then(result =>{
action
}.then(result =>{
action
}.then(result =>{
action
}.then(result =>{
action
}.then(result =>{ etc.
which I'm not sure works for my issue but it doesn't seem compactable.
what would be best practice in this situation?
Edit:
I'm not sure how to use the .then chain with multiple promises such as:
promise.then(result =>{
action
}promise.then(result =>{
action
}promise.then(result =>{
action
}promise.then(result =>{
action
}promise.then(result =>{ etc.
It does not yield the result I expect
I found my solution:
new Promise(function(resolve, reject) {
setTimeout(() => resolve(1), 1000);
}).then(function(result) {
alert(result); // 1
return new Promise((resolve, reject) => { // (*)
setTimeout(() => resolve(result * 2), 1000);
});
}).then(function(result) { // (**)
alert(result); // 2
return new Promise((resolve, reject) => {
setTimeout(() => resolve(result * 2), 1000);
});
}).then(function(result) {
alert(result); // 4
});
I needed to return the promise to chain them which is why it was not working.
Source: https://javascript.info/promise-chaining
EDIT
So I am creating an e-commerce website and I'm running into a few road blocks. I have since updated my code to make it cleaner and easier to read and I somewhat pinpointed where my issue stems from (though there could be more). Here is the updated code:
StoreDB.prototype.addOrder = function(order) {
console.log('addOrder');
return this.connected.then(function(db) {
console.log(order);
var orders = db.collection('orders');
var products = db.collection('products');
return insert(order, orders, db)
.then(function(updatedOrdersList) {
return obtainOrders(updatedOrdersList);
})
.then(function(orderList) {
return updateProducts(orderList, products);
})
.catch((err) => console.log('There was an issue in the promise chain\n' + err));
});
}
function insert(order, orders, db) {
return new Promise(function(resolve, reject) {
console.log('Inserting order into orders collection');
orders.insert(order);
resolve(db.collection('orders'));
});
}
function obtainOrders(orders) {
return new Promise(function(resolve, reject) {
console.log('Obtaining orders');
var orderList = orders.find({}).toArray();
resolve(orderList);
});
}
function updateProducts(orderList, products) {
return new Promise(function(resolve, reject) {
console.log('Getting the products that match the cart')
var promises = [];
var promises2 = [];
console.log('orderList', orderList);
for (var item in orderList[0].cart) {
console.log('item', item);
promises.push(products.find({$and : [{"_id" : item}, {"quantity" : {$gte: 0}}]}).toArray());
}
Promise.all(promises)
.then(() => {
console.log('Updating the cart quantity')
for (var i = 0; i < promises.length; i++) {
console.log(promises);
// console.log(productList[item], productList[item]._id, productList[item].quantity, cart);
promises2.push(products.update({"_id" : productList[item]._id}, {$set :{"quantity" : (productList[item].quantity - cart[productList[item]._id])}}));
promises2.push(products.find({}).toArray());
Promise.all(promises2)
.then(() => promises[promises2.length-1]);
}
});
});
}
It appears that when obtainOrders is called in the promise chain, it returns an empty array. I'm not too sure why it does this because in the chain where:
return insert(order, orders, db)
.then(function(updatedOrdersList) {
return obtainOrders(updatedOrdersList);
})
.then(function(orderList) {
return updateProducts(orderList, products);
})
The function call to obtainOrders from above waits for the method call to Collections.find to be completed before it is resolved (returning an array of orders). Some reason it is returning an empty array.
Any help would be greatly appreciated!
Not sure what the relationship between the first block and second is, but in the first block:
function insert(order, orders, db) {
return new Promise(function(resolve, reject) {
console.log('Inserting order into orders collection');
orders.insert(order);
resolve(db.collection('orders'));
});
}
At a glance it seems like orders.insert(order) is asynchronous, but you're not waiting for it to finish before resolving.
You could either make the function asynchronous and
await orders.insert(order);
or
orders.insert(order)
.then(() => resolve(db.collection('orders')))
But doesn't having the method Collections.insert inside a promise make that method call asynchronous?
Yes, Collections.insert is implicitly asynchronous in that it returns a Promise. I was talking about declaring it async explicitly so you can await other async calls in the function body. Note the addition of async at the start and await orders.insert().
async function insert(order, orders, db) {
return new Promise(function(resolve, reject) {
console.log('Inserting order into orders collection');
await orders.insert(order);
resolve(db.collection('orders'));
});
}
If you don't await orders.insert (either via await or .then) you're calling insert and immediately returning the db.collection call, which creates a race condition where the new order may not be inserted yet. It's possible the new order could be there but it seems unlikely, and it's not going to be there reliably.
There's also no need to create a new Promise here. db.collection already returns a Promise. Just return the one you already have:
function insert(order, orders, db) {
console.log('Inserting order into orders collection');
return orders.insert(order)
.then(() => db.collection('orders'));
}
Take a look at this sample code snippet. I've mocked out the orders.insert and db.collection methods.
// mock orders.insert
const orders = {
insert: async() => {
return new Promise((resolve) => {
// wait a second then resolve
setTimeout(resolve, 1000);
});
}
}
// mock db.collection
const db = {
collection: async() => {
return new Promise((resolve) => {
// wait a second then resolve with mock data
setTimeout(() => resolve(['foo', 'bar', 'baz']), 1000);
});
}
}
function insert(order, orders, db) {
return orders.insert(order)
.then(() => db.collection('orders'));
}
// same as above, but with async/await
async function insertAsync(order, orders, db) {
await orders.insert(order);
return await db.collection('orders');
}
function go() {
// using then
insert(null, orders, db).then(console.log);
// using async/await;
insertAsync(null, orders, db).then(console.log);
}
go();
I know that there are better ways to do this and tools such as serve-index already exist as an npm package to list a directory structure, but I wanted to test this out on my as I am still rather new to using Node.js and JavaScript.
Currently, my code is as follows, and I am confused as to why my array is empty.
let directoryTree = [];
let directoryList = new Promise((resolve, reject) => {
resolve(fs.readdir(path.join(__dirname, '..'), (err, fileList) => {
for (file of fileList) {
console.log(file);
directoryTree.push(file);
}
}));
}).then(() => console.log(directoryTree))
.catch((err) => console.log(error));
What gets displayed is
[]
app
files
node_modules
package-lock.json
package.json
This indicates to me that the promise is being resolved before readdir finishes executing, otherwise the empty array wouldn't be logged first. I believe that something may be incorrect in my usage of promises then, but I might be wrong. I appreciate any advice!
You can call resolve() to resolve the promise when the callback is done fetching the data asynchronously.
Then when the data is fetched and resolved you would get the list of files in the then() callback:
new Promise((resolve, reject) => {
fs.readdir(path.join(__dirname, '..'), (err, fileList) => {
err ? reject(err) : resolve(fileList); //resolve with list of files
});
})
.then((list) => console.log(list))
.catch((err) => console.log(err));
You're using Promise incorrectly.
The syntax is (from MDN):
const myFirstPromise = new Promise((resolve, reject) => {
// do something asynchronous which eventually calls either:
//
resolve(someValue); // fulfilled
// or
reject("failure reason"); // rejected
});
Refactoring:
let directoryList = new Promise((resolve, reject) => {
fs.readdir(path.join(__dirname, '..'), (err, fileList) => {
if (err) reject(err)
else resolve(fileList)
});
})
// directoryList is a Promise that could reject or resolve
directoryList.then(() => console.log(directoryTree))
.catch((err) => console.log(error));
The following sample code represents what am trying to do, and am stumped as to why the console.log inside the Promises.all.then() is completed before even the individual promises are completed. I am thinking that the map statement has something to do with it , may be, but am unsure.
My intention of using a map was to collect all successes and or failures and notify the user later on bulk operations.
var requests = []; var success=[]; var failures = [];
requests.push(new Promise((resolve, reject) => setTimeout(() => resolve("foo success"), 2000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => reject("bar failure"), 1000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => resolve("foo2 success"), 2000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => reject("bar2 failure"), 1000)));
Promise.all(requests.map(p => {
p.then(r => {
console.log(r)
success.push(r);
});
p.catch((e) => { console.log(e); failures.push(e); });
})).then(function () { console.log("ALL promises completed")})
May i know what is wrong with the above code? Am i not implementing the promises as intended.?
It's because your requests.map(...) callback doesn't return anything, so you're mapping the Promises to undefined values. Therefore, you're awaiting an array of undefined values with the Promise.all call. Change to the following:
Promise.all(requests.map(p => {
p.then(r => {
console.log(r)
console.log("POSTed a record successfuly");
success.push(r);
});
p.catch((e) => { console.log(e); failures.push(e); });
return p;
})).then(function () { console.log("POSTED ALL")})
Update:
As #JoeFrambach pointed out, if you want the Promise.all to contain the contents of the original requests Promises, you'll want to return the original Promises. Since that's most likely what you want to do, I've updated my answer.
just return promise from your map callback function
var requests = []; var success=[]; var failures = [];
requests.push(new Promise((resolve, reject) => setTimeout(() => resolve("foo success"), 2000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => reject("bar failure"), 1000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => resolve("foo2 success"), 2000)));
requests.push(new Promise((resolve, reject) => setTimeout(() => reject("bar2 failure"), 1000)));
Promise.all(requests.map(p => {
p.then(r => {
console.log(r)
success.push(r);
});
p.catch((e) => { console.log(e); failures.push(e); });
return p; // ADD THIS LINE
})).then(function () { console.log("ALL promises completed")})
.catch(function() {console.log("FAILED PROMISE ALL")});
You need to return a promise within .map function.
Within .map function make last line as return p.
Promise all expects array of promises. You are returning array of undefined from map function so it immediately gets resolved.
I have a situation where I think the only choice for me is to nest some Promises within each other. I have a Promise that needs to be performed and a method that does something until that Promise is complete. Something like this:
let promise = new Promise((resolve, reject) => {
// Do some stuff
});
doSomethingUntilPromiseisDone(promise);
However, within my Promise, I need to execute another method that returns another Promise:
let promise = new Promise((resolve, reject) => {
fetchValue(url)
.then((value) => {
// Do something here
}).catch((err) => {
console.error(err);
});
});
doSomethingUntilPromiseisDone(promise);
But now, in the fetchValue method's then statement, I have another method I need to execute that, guess what, returns another Promise:
let promise = new Promise((resolve, reject) => {
fetchValue(url)
.then((value) => {
saveToCache(value)
.then((success) => {
console.log('success!!');
resolve('success');
});
}).catch((err) => {
console.error(err);
});
});
doSomethingUntilPromiseisDone(promise);
So in the end, I have a Promise, within a Promise, within a Promise. Is there someway I can structure this better so that it is more straightforward? It seems like nesting them within each other is counter to Promise's intended chaining approach.
Use .then()
let doStuff = (resolve, reject) => {/* resolve() or reject() */};
let promise = new Promise(doStuff);
doSomethingUntilPromiseisDone(
promise
.then(value => fetchValue(url))
.then(value => value.blob())
.then(saveToCache)
)
.then(success => console.log("success!!"))
.catch(err => console.error(err))
you can use generator to flatten your nested promises (Bluebird.couroutine or Generators)
//Bluebird.couroutine
const generator = Promise.coroutine(function*() {
try {
const value = yield fetchValue(url);
const success = yield saveToCache(value);
console.log('success:', success);
} catch(e) {
console.error(err);
}
}));
generator();
Each function will call the next one with the result of the method before.
var promises = [1,2,3].map((guid)=>{
return (param)=> {
console.log("param", param);
var id = guid;
return new Promise(resolve => {
// resolve in a random amount of time
setTimeout(function () {
resolve(id);
}, (Math.random() * 1.5 | 0) * 1000);
});
}
}).reduce(function (acc, curr, index) {
return acc.then(function (res) {
return curr(res[index-1]).then(function (result) {
console.log("result", result);
res.push(result);
return res;
});
});
}, Promise.resolve([]));
promises.then(console.log);