EP-14 | Callback Functions in JS ft. Event Listeners 🔥

deep100x · deep100x · commit 608880495047 · 2024-05-05T19:31:16.000+05:30
diff --git a/Namaste-JavaScript/Ep-14-Callback-Functions.html b/Namaste-JavaScript/Ep-14-Callback-Functions.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en">
+	<head>
+		<meta charset="UTF-8" />
+		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+		<title>Document</title>
+	</head>
+	<body>
+		<h1 id="heading">Namaste JavaScript</h1>
+
+		<button id="clickMe">Click Me</button>
+
+		<script src="./Ep-14-Callback-Functions.js"></script>
+	</body>
+</html>
diff --git a/Namaste-JavaScript/Ep-14-Callback-Functions.js b/Namaste-JavaScript/Ep-14-Callback-Functions.js
@@ -0,0 +1,52 @@
+// What is a callback Function in Javascript ?
+
+// 🟨Functions are first class citizens in javascript
+// function pass into another function is called Callback Function.
+
+setTimeout(() => {
+  console.log("Timer⏰");
+},1000);
+function x (y) {
+  console.log("x");
+  y()
+}
+x(function z () {
+  console.log("y");
+})
+
+//-----------------------------------------------------------
+// Javascript is synchronous and single-threaded language
+
+
+// -----------------------------------------------------------
+//  Blocking the main thread
+
+
+// -----------------------------------------------------------
+// Power of Callbacks ?
+
+
+// -----------------------------------------------------------
+// Deep about Event Listeners
+
+
+// -----------------------------------------------------------
+// Clossures demo with Event Listeners
+
+
+// -----------------------------------------------------------
+// Scope demo with Event Listeners
+
+
+// -----------------------------------------------------------
+// Garbage Collection & removeEventListeners
+
+
+
+function attachEventListener () {
+  let count = 0
+  document.getElementById('clickMe').addEventListener("click",() => {
+    console.log("Button Click",++count);
+  });
+}
+attachEventListener()
