Originally published at coreycleary.me. This is a cross-post from my content blog. I publish new content every week or two, and you can sign up to ...
For further actions, you may consider blocking this person and/or reporting abuse
I remember this picture
I don't know if there a promise hell example. Thanks for this great article.
Promise hell can't exist, that's why it's so nice!
See? It's really clean 😃
Haha yeah this one's classic - good point too, you can hit "promise hell" too if you're not careful. Not as "pyramid" like as callback hell, but having ton's and tons of
then
's can get sort of annoyingThink also if it's also with If-Else Statements :)
I can appreciate trying to dispense some knowledge, but why not use one of those "real-world" cases in the example instead of the highly abstract
setTimeout()
?I've been trying to grasp
promise
s andasync/await
for "a while" now, but examples and articles I find like this, as you've said, use the wholly unrealisticsetTimeout()
.I completed a personal project a few months ago in NodeJS that was pretty standard AJAX activity . . .
It took finishing it to realize that I built a several indention deep callback hell. Great. Well at least now I have a base to find examples for promises.
Not. Every example on the first page of my various google searches all used
setTimeout()
.I'd love to see an example of callback > promise > async/await based on, as you've said, realistic file, database or CORS calls.
Real example and also I would simplify the error handling a ton and lose the try catch.
You can pass anything that returns a promise to that module like so.
So here we are using the WP backbone api to return a collection of whatever and checking if more exist each time, when its all done we are combining them all together and loading the result into the data variable so we can stop our loading event on the table and show all the results. The js api will only return 100 items in a collection at a time and in this case we needed to grab 200-300 of whatever and load the table with all the data so the searching and sorting is instant so we sacrifice the inital time to grab all the data from better UI once we do.
PS: This is the basic layout of a Vue component, I just left off the methods wrapper around the loadItems function so you could see it easier.
With async await and your example you described you would basically have a method or function returning a promise for checking on if the file exists and reading the data from it, probably using axios or fetch. Then another method returning a promise to create and write to a file. Each method would return a response and you would await on the result before doing the next part.
Hope this gave you a real world example to see how this stuff can be used.
Yeah I've got another post in my backlog that will be something more along the lines of, finding some open source code snippet written using callbacks and refactoring the whole thing to show the before and after.
This post is really meant more to show the process, and I didn't want to overwhelm with too much information. However I understand some people learn better if they see something taken from an existing application and rewritten.
Thanks for the comment
We can also use
util.promisify()
to convert callback to promiseyep. works like a charm! :)
devdocs.io/node/util#util_util_pro...
Use bluebirds .from callback function to easily to await on a function that takes a callback).
This only works if your callbacks are called in the standard way though, ie (err, result).
const Promise = require('bluebird');
await Promise.fromCallback(callback => functionThatTakesACallback(arg1, arg2, callback));