Forked from k-vosswinkel/async-await-vs-promises-errors.js
Created
December 4, 2018 16:45
-
-
Save rafagarcia/57472462f3b36c97cf11a49bd11cb73b to your computer and use it in GitHub Desktop.
Playing with promises and async/await
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const returnsAPromise = (string) => ( | |
new Promise((resolve, reject) => { | |
if (typeof string !== 'string') reject('Not a string!'); | |
resolve(`String is a resolved promise now: ${string}`); | |
}) | |
); | |
const myString = "Kait's string"; | |
let isOurPromiseFinished = false; | |
const myPromiseChain = (str) => { | |
returnsAPromise(str) | |
.then(res => { | |
// If the promise resolves, we enter this code block | |
console.log(`using promise chains, ${res}`); | |
}) | |
.catch(err => { | |
// If the promise rejects, we enter this code block | |
console.log(err); | |
}) | |
.finally(() => { | |
/* This is for code that doesn't rely on the outcome of the promise | |
but still needs to run once it's handled */ | |
isOurPromiseFinished = true; | |
}) | |
} | |
myPromiseChain(myString); | |
const myAsyncAwaitBlock = async (str) => { | |
try { | |
// If the promise resolves, we enter this code block | |
const myPromise = await returnsAPromise(str); | |
console.log(`using async/await, ${res}`); | |
} catch(err) { | |
// If the promise rejects, we enter this code block | |
console.log(err); | |
} finally { | |
/* This is for code that doesn't rely on the outcome of the promise | |
but still needs to run once it's handled */ | |
isOurPromiseFinished = true; | |
} | |
} | |
myAsyncAwaitBlock(myString); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const returnsAPromise = (string) => ( | |
new Promise((resolve, reject) => { | |
if (typeof string !== 'string') reject('Not a string!'); | |
resolve(`String is a resolved promise now: ${string}`); | |
}) | |
); | |
const myFirstString = "Kait's first string"; | |
const mySecondString = "Kait's second string"; | |
// PROMISE CHAIN (Promise.all()) | |
const myPromiseAll = (str1, str2) => { | |
// Operation A & Operation B can run in parallel | |
Promise.all([returnsAPromise(str1), returnsAPromise(str2)]) | |
// Operation C (needs info from Operations A & B) | |
.then(res => { | |
console.log(`Promise.all() gives us an array: ${res}`) | |
}) | |
} | |
myPromiseAll(myFirstString, mySecondString); | |
// ASYNC/AWAIT (Multiple await statements) | |
const myAwaits = async (str1, str2) => { | |
// Operation A & Operation B can run in parallel | |
const promise1 = await returnsAPromise(str1); | |
const promise2 = await returnsAPromise(str2); | |
// Operation C (needs info from Operations A & B) | |
console.log(`Using multiple awaits, I can handle the results of either promise flexibly: ${promise1} AND ${promise2}`); | |
} | |
myAwaits(myFirstString, mySecondString); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
const returnsAPromise = (string) => ( | |
new Promise((resolve, reject) => { | |
if (typeof string !== 'string') reject('No string!'); | |
resolve(`${string} is a resolved promise now`); | |
}) | |
); | |
const myString = "Kait's String"; | |
// PROMISE CHAIN | |
const myFunction = (str) => { | |
// Operation A | |
returnsAPromise(str) | |
// Operation B (needs info from Operation A) | |
.then(res => { | |
console.log(`Using promise chains, ${res}`); | |
}) | |
// Operation C (can run whenever) | |
console.log("I'm over here running synchronously"); | |
} | |
myFunction(myString); | |
// ASYNC/AWAIT | |
const myAsyncFunction = async (str) => { | |
// Operation A | |
const promiseResults = await returnsAPromise(str) | |
// Operation B (needs info from Operation A) | |
console.log(`Using async/await, ${promiseResults}`); | |
console.log("Careful - I'm not synchronous anymore!"); | |
} | |
// Operation C (can run whenever) | |
console.log("I'm over here running synchronously"); | |
myAsyncFunction(myString); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment