callbacks and promises concept done next up is promise chaining

Galaxy-Ranger · Galaxy-Ranger · commit 7231cd6ab856 · 2025-02-04T15:38:17.000+05:30
diff --git a/09_Callbacks_promises_&_async-await/HTML/01_Intro_to_Callbacks.html b/09_Callbacks_promises_&_async-await/HTML/01_Intro_to_Callbacks.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Intro to Callbacks</title>
+</head>
+<body>
+  <h1>Callbacks</h1>
+  <script src="../JS/01_Intro_to_Callbacks.js"></script>
+</body>
+</html>
diff --git a/09_Callbacks_promises_&_async-await/HTML/03_Intro_to_promises.html b/09_Callbacks_promises_&_async-await/HTML/03_Intro_to_promises.html
@@ -0,0 +1,12 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <title>Intro to Promises</title>
+</head>
+<body>
+  <h1>Promises</h1>
+  <script src="../JS/03_Intro_to_promises.js"></script>
+</body>
+</html>
diff --git a/09_Callbacks_promises_&_async-await/JS/01_Intro_to_Callbacks.js b/09_Callbacks_promises_&_async-await/JS/01_Intro_to_Callbacks.js
@@ -0,0 +1,36 @@
+// function loadscript(src, callback){
+//   let script = document.createElement('script');
+//   script.src = src
+//   script.onload = callback()
+//   document.body.appendChild(script)
+// }
+// src = "https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
+// function callback() {
+//   alert("Script src loaded successfully")
+// }
+// loadscript(src, callback)
+
+
+// Handling Error
+function loadscript(src, callback){
+  let script = document.createElement('script');
+  script.src = src
+  script.onload = function() {
+    console.log("Script src loaded successfully")
+    callback(null, src)
+  }
+  script.onerror = function() {
+    console.log(`Error loading script: ${src}`)
+    callback(new Error(`Error loading script`))
+  }
+  document.body.appendChild(script)
+}
+src = "https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
+function callback(error, src) {
+  if (error){
+    console.log(error)
+    return
+  }
+  console.log(src)
+}
+loadscript(src, callback)
diff --git a/09_Callbacks_promises_&_async-await/JS/03_Intro_to_promises.js b/09_Callbacks_promises_&_async-await/JS/03_Intro_to_promises.js
@@ -0,0 +1,26 @@
+//? Promise Syntax
+let promise1 = new Promise(function(resolve, reject) {
+  console.log("Promise - 1 state is Pending")
+  setTimeout(function() {
+    resolve('Promise - 1 State is resolved successfully');
+  }, 2000);
+})
+
+let promise2 = new Promise(function(resolve, reject) {
+  console.log("Promise - 2 state is Pending")
+  setTimeout(function() {
+    reject('Promise - 2 State is rejected due to error');
+  }, 2000);
+})
+
+
+//? .then() ---> to get the result/value
+promise1.then(function(value) {
+  console.log(value);
+})
+
+//? .catch() --> to get the error
+promise2.catch(function(error) {
+  console.log(error);
+})
+
