forked from rohan-paul/Awesome-JavaScript-Interviews
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Promise-super-basic-implementation-Absolute-Basics.js
88 lines (69 loc) · 3.06 KB
/
Promise-super-basic-implementation-Absolute-Basics.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
// Both .then and .catch will return a new promise. That seems like a small detail but it’s important because it means that promises can be chained.
// Note, the most generic way I declare a Promise
let genericPromise = new Promise((resolve, reject) => {
if (1 === 1) {
resolve()
} else {
reject()
}
})
// But in the below cases for the sake of showing the super-basic implementation, I am not including the if() conditions. Instead returning the resolve() reject() immediately
let promise2 = new Promise((resolve, reject) => {
resolve()
})
promise2
.then(() => {
console.log("Hey I am finished executing resolved()")
})
.catch(() => {
console.log("Hey this time rejected, but will hit again")
})
// The above Will output - Hey I am finished executing resolved()
let promise1 = new Promise((resolve, reject) => {
reject()
})
promise1
.then(() => {
console.log("Hey I am finished executing resolved()")
})
.catch(() => {
console.log("Hey this time rejected, but will hit again")
})
// The above Will output - "Hey this time rejected, but will hit again"
let promise3 = new Promise((resolve, reject) => {
reject()
})
promise3
.then(() => {
console.log("First then response")
})
.then(() => {
console.log("Second then response")
})
.catch(() => {
console.log(
"The two above then will be jumped over and execution will hit catch()",
)
})
// The above will Output - "The two above then will be jumped over and execution will hit catch()".
// Notice the 2 then() are ignored and execution jumps to catch() as only reject was passed in the function construction
let promise4 = new Promise((resolve, reject) => {
resolve()
})
promise4
.then(() => {
console.log("First then response")
})
.then(() => {
console.log("Second then response")
})
.catch(() => {
console.log("Hey this time rejected, but will hit again")
})
/*The above will Output -
First then response
Second then response
Notice the 2 then() are sequentially executed and the catch() is ignored as no reject function was passed.
Instead of nesting callbacks inside callbacks inside callbacks, you chain .then() calls together making it more readable and easier to follow. Every .then() should either return a new Promise or just a value or object which will be passed to the next .then() in the chain. Another important thing to notice is that even though we are doing two different asynchronous requests we only have one .catch() where we handle our errors. That’s because any error that occurs in the Promise chain will stop further execution and an error will end up in the next .catch() in the chain.
A friendly reminder: just like with callback based APIs, this is still asynchronous operations. The code that is executed when the request has finished — that is, the subsequent .then() calls — is put on the event loop just like a callback function would be. This means you cannot access any variables passed to or declared in the Promise chain outside the Promise. The same goes for errors thrown in the Promise chain.
*/