|
1 | 1 | // NOTE: An aysnc function is a special type of function that always returns a Promise. It allows to write asynchronous code in a cleaner, more readable way using await intead of .then() chains |
2 | 2 |
|
3 | | - |
4 | 3 | async function makeRequest() { |
5 | | - console.log('helo'); |
6 | | - throw new Error('error in program'); |
| 4 | + console.log("helo"); |
| 5 | + throw new Error("error in program"); |
7 | 6 | } |
8 | 7 | makeRequest(); |
9 | 8 |
|
10 | | - |
11 | 9 | async function newRequest() { |
12 | | - const url = 'https://dummyjson.com/products' |
13 | | - const responsePromise = fetch(url) |
14 | | - responsePromise.then((res) => { |
15 | | - res.json().then((d) => { |
16 | | - console.log(d); |
17 | | - }) |
18 | | - }) |
| 10 | + const url = "https://dummyjson.com/products"; |
| 11 | + const responsePromise = fetch(url); |
| 12 | + responsePromise.then((res) => { |
| 13 | + res.json().then((d) => { |
| 14 | + console.log(d); |
| 15 | + }); |
| 16 | + }); |
19 | 17 | } |
20 | 18 | newRequest(); |
21 | 19 |
|
22 | | - |
23 | | - |
24 | 20 | async function request() { |
25 | | - const url = 'https://dummyjson.com/products'; |
26 | | - const response = await fetch(url) // await returns the response of the fetched url means the result |
27 | | - const data = await response.json() |
28 | | - console.log(data); |
| 21 | + const url = "https://dummyjson.com/products"; |
| 22 | + const response = await fetch(url); // await returns the response of the fetched url means the result |
| 23 | + const data = await response.json(); |
| 24 | + console.log(data); |
29 | 25 | } |
30 | 26 | request(); |
31 | 27 |
|
32 | | - |
33 | | - |
34 | 28 | // Best way to handle api using async function |
35 | 29 | async function fetchData(url) { |
36 | | - try { |
37 | | - let response = await fetch(url); |
38 | | - let data = await response.json(); |
39 | | - console.log(data); |
40 | | - } catch (error) { |
41 | | - console.error("Error:", error); |
42 | | - } |
| 30 | + try { |
| 31 | + let response = await fetch(url); |
| 32 | + let data = await response.json(); |
| 33 | + console.log(data); |
| 34 | + } catch (error) { |
| 35 | + console.error("Error:", error); |
| 36 | + } |
43 | 37 | } |
44 | 38 |
|
45 | 39 | fetchData("https://fakestoreapi.com/products"); |
46 | 40 |
|
47 | | - |
48 | 41 | // THis one is also the best way to use async & await |
49 | 42 | async function getProducts() { |
50 | | - try { |
51 | | - const url = 'https://dummyjson.com/products'; |
52 | | - const res = await fetch(url); |
53 | | - |
54 | | - if (!res.ok) { |
55 | | - throw new Error(`HTTP error! Status: ${res.status}`); |
56 | | - } |
| 43 | + try { |
| 44 | + const url = "https://dummyjson.com/products"; |
| 45 | + const res = await fetch(url); |
57 | 46 |
|
58 | | - const data = await res.json(); |
59 | | - console.log(data); |
60 | | - } catch (error) { |
61 | | - console.error("Error fetching products:", error.message); |
| 47 | + if (!res.ok) { |
| 48 | + throw new Error(`HTTP error! Status: ${res.status}`); |
62 | 49 | } |
| 50 | + |
| 51 | + const data = await res.json(); |
| 52 | + console.log(data); |
| 53 | + } catch (error) { |
| 54 | + console.error("Error fetching products:", error.message); |
| 55 | + } |
63 | 56 | } |
64 | 57 | getProducts(); |
65 | 58 |
|
66 | 59 | async function getCarts() { |
67 | | - try { |
68 | | - const url = 'https://dummyjson.com/carts'; |
69 | | - const res = await fetch(url); |
70 | | - if (!res.ok) { |
71 | | - throw new Error(`Http error! Statu: ${res.status}`); |
72 | | - } |
73 | | - const data = await res.json(); |
74 | | - console.log(data); |
75 | | - } catch (error) { |
76 | | - console.log("Error Feching carts", error.message); |
| 60 | + try { |
| 61 | + const url = "https://dummyjson.com/carts"; |
| 62 | + const res = await fetch(url); |
| 63 | + if (!res.ok) { |
| 64 | + throw new Error(`Http error! Statu: ${res.status}`); |
77 | 65 | } |
| 66 | + const data = await res.json(); |
| 67 | + console.log(data); |
| 68 | + } catch (error) { |
| 69 | + console.log("Error Feching carts", error.message); |
| 70 | + } |
78 | 71 | } |
79 | 72 | getCarts(); |
80 | 73 |
|
81 | | - |
82 | 74 | // NOTE: Async await Quizes |
83 | 75 |
|
84 | 76 | // INFO: First quiz |
85 | 77 | async function test() { |
86 | | - return "Hello"; |
| 78 | + return "Hello"; |
87 | 79 | } |
88 | 80 | console.log(test()); // Answer : Promise { <fulfilled>: "Hello" } |
89 | 81 |
|
90 | | - |
91 | 82 | // INFO: Second Quiz |
92 | 83 | async function fetchData() { |
93 | | - console.log("start"); |
94 | | - let promise = new Promise(resolve => setTimeout(() => resolve("Data loaded"), 2000)); |
95 | | - console.log("waiting...."); |
96 | | - let data = await promise; |
97 | | - console.log(data); |
| 84 | + console.log("start"); |
| 85 | + let promise = new Promise((resolve) => |
| 86 | + setTimeout(() => resolve("Data loaded"), 2000), |
| 87 | + ); |
| 88 | + console.log("waiting...."); |
| 89 | + let data = await promise; |
| 90 | + console.log(data); |
98 | 91 | } |
99 | 92 |
|
100 | 93 | fetchData(); |
|
0 commit comments