Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Sign up
Appearance settings

Commit f89638f

Browse files
Promises
1 parent 261467a commit f89638f

File tree

2 files changed

+73
-9
lines changed

2 files changed

+73
-9
lines changed

‎12_Asynchronous_Concepts/12.md‎

Lines changed: 44 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -53,3 +53,47 @@ fetchUser("Shubham", (user) => {
5353
});
5454
```
5555

56+
#### Promises
57+
58+
```js
59+
//In JavaScript, a Promise is an object that represents the result of an asynchronous //operation. A Promise can be in one of three states: pending, fulfilled, or rejected.
60+
61+
//A Promise starts in the pending state, and it can either be fulfilled with a value or //rejected with a reason (error). Once a Promise is fulfilled or rejected, it is considered //settled, and it cannot be changed anymore.
62+
63+
//Promises are used to handle asynchronous operations in a synchronous manner, making it //easier to write and reason about async code. Instead of using callback functions, you can //use the then and catch methods on a Promise to specify what should happen when the Promise //is fulfilled or rejected.
64+
65+
66+
const fetchUser = (username) => {
67+
return new Promise((resolve, reject) => {
68+
setTimeout(() => {
69+
console.log("[Now we have the user]");
70+
71+
resolve({ username });
72+
}, 2000);
73+
});
74+
};
75+
76+
const fetchUserPhotos = (username) => {
77+
return new Promise((resolve, reject) => {
78+
setTimeout(() => {
79+
console.log(`Now we have the photos for ${username}`);
80+
resolve(["Photo1", "Photo2"]);
81+
}, 2000);
82+
});
83+
};
84+
85+
const fetchPhotoDetails = (photo) => {
86+
return new Promise((resolve, reject) => {
87+
setTimeout(() => {
88+
console.log(`[Now we have the photo details ${photo}]`);
89+
resolve("details...");
90+
}, 2000);
91+
});
92+
};
93+
94+
fetchUser("Shubham")
95+
.then((user) => fetchUserPhotos(user.username))
96+
.then((photos) => fetchPhotoDetails(photos[0]))
97+
.then((details) => console.log(`Your photo details are ${details}`));
98+
```
99+

‎12_Asynchronous_Concepts/script2.js‎

Lines changed: 29 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,32 @@
1-
// Callback functions
1+
const fetchUser = (username) => {
2+
return new Promise((resolve, reject) => {
3+
setTimeout(() => {
4+
console.log("[Now we have the user]");
25

3-
const fetchUser = (username, callback) => {
4-
console.log("Fetching...");
5-
setTimeout(() => {
6-
callback({ username });
7-
}, 2000);
6+
resolve({ username });
7+
}, 2000);
8+
});
89
};
910

10-
fetchUser("Shubham", (user) => {
11-
console.log(`Hello, ${user.username}`);
12-
});
11+
const fetchUserPhotos = (username) => {
12+
return new Promise((resolve, reject) => {
13+
setTimeout(() => {
14+
console.log(`Now we have the photos for ${username}`);
15+
resolve(["Photo1", "Photo2"]);
16+
}, 2000);
17+
});
18+
};
19+
20+
const fetchPhotoDetails = (photo) => {
21+
return new Promise((resolve, reject) => {
22+
setTimeout(() => {
23+
console.log(`[Now we have the photo details ${photo}]`);
24+
resolve("details...");
25+
}, 2000);
26+
});
27+
};
28+
29+
fetchUser("Shubham")
30+
.then((user) => fetchUserPhotos(user.username))
31+
.then((photos) => fetchPhotoDetails(photos[0]))
32+
.then((details) => console.log(`Your photo details are ${details}`));

0 commit comments

Comments
(0)

AltStyle によって変換されたページ (->オリジナル) /