Day 12/100 of JavaScript 🚀 Today’s topic: async / await "async" and "await" provide a cleaner way to work with Promises and write asynchronous code that looks like synchronous code 📍Basic example async function getData() { const res = await fetch("https://lnkd.in/gCA7VyNQ"); const data = await res.json(); console.log(data); } 📍With error handling async function getData() { try { const res = await fetch("https://lnkd.in/gCA7VyNQ"); const data = await res.json(); console.log(data); } catch (err) { console.error(err); } } 🔑 Key points : - "async" makes a function return a Promise. - "await" pauses execution until the Promise resolves. - Makes code more readable than ".then()" chaining. async/await simplifies handling asynchronous operations while still using Promises under the hood. #Day12 #JavaScript #100DaysOfCode
Async Await Simplifies Asynchronous Code in JavaScript
More Relevant Posts
-
What To Know in JavaScript (2026 Edition). Part 1. Iterator Helpers (lazy data processing) JavaScript introduced Iterator Helpers — methods like .map(), .filter(), .take() directly on iterators. The goal is to avoid unnecessary intermediate arrays and improve performance. Instead of chaining operations that create arrays at every step, you get: → less memory usage → fewer computations → more predictable performance #frontend #webdev #javascript #performance
To view or add a comment, sign in
-
-
🚀 **𝐃𝐚𝐲 5 – 𝐇𝐨𝐢𝐬𝐭𝐢𝐧𝐠 𝐢𝐧 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 (𝐂𝐥𝐞𝐚𝐫 & 𝐏𝐫𝐚𝐜𝐭𝐢𝐜𝐚𝐥 𝐄𝐱𝐩𝐥𝐚𝐧𝐚𝐭𝐢𝐨𝐧)** You might have seen this 👇 👉 Using a variable before declaring it But why does this work? 🤔 --- 💡 **What is Hoisting?** Hoisting means: 👉 Before execution, JavaScript **allocates memory for variables and functions** 👉 In simple words: **Declarations are processed before code runs** --- 💡 **Example:** ```js id="d5pro1" console.log(a); var a = 10; ``` 👉 Output: `undefined` --- 💡 **What actually happens behind the scenes?** Before execution (Memory Phase): * `a` → undefined Then execution starts: * `console.log(a)` → prints undefined * `a = 10` --- 💡 **Important Rule** 👉 JavaScript only hoists **declarations**, not values --- 💡 **var vs let vs const** 👉 **var** * Hoisted * initialized as `undefined` * can be accessed before declaration 👉 **let & const** * Hoisted * BUT not initialized --- ⚠️ **Temporal Dead Zone (TDZ)** This is the time between: 👉 variable declared 👉 and initialized During this: ❌ Accessing variable → **ReferenceError** --- 💡 **Example:** ```js id="d5pro2" console.log(a); let a = 10; ``` 👉 Output: **ReferenceError** --- ⚡ **Key Insight (Very Important)** 👉 Hoisting is NOT moving code 👉 It’s just **memory allocation before execution** --- 💡 **Why this matters?** Because it helps you understand: * unexpected `undefined` values * ReferenceErrors * how JavaScript actually runs code --- 👨💻 Continuing my JavaScript fundamentals series 👉 Next: **JavaScript Runtime & Event Loop** 👀 #JavaScript #WebDevelopment #FrontendDevelopment #Coding #SoftwareEngineer #Tech
To view or add a comment, sign in
-
-
🚀𝐃𝐚𝐲 𝟏𝟒/𝟏𝟓 𝐨𝐟 𝐌𝐲 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐋𝐞𝐚𝐫𝐧𝐢𝐧𝐠 𝐒𝐞𝐫𝐢𝐞𝐬 Today I learned about Async / Await in JavaScript 💡 👉 Async/Await is used to handle asynchronous code in a cleaner and easier way. 👉 async makes a function return a promise 👉 await waits for the promise to resolve 📌 Example: function getData() { return new Promise((resolve) => { setTimeout(() => resolve("Data Loaded"), 1000); }); } 📌 Using async/await: async function fetchData() { let result = await getData(); console.log(result); } fetchData(); 👉 Output after 1 second: Data Loaded 👉 Async/Await makes code look like normal synchronous code 💻✨ 💬 Question: Do you prefer Promises (.then) or Async/Await? Let’s learn together 🚀 #JavaScript #WebDevelopment #LearningInPublic #Day14 #FrontendDevelopment
To view or add a comment, sign in
-
-
Day 10/100 of JavaScript 🚀 Today’s topic : Fetch API "fetch" is used to make HTTP requests in JavaScript and is a modern replacement for XMLHttpRequest Basic usage : fetch("https://lnkd.in/gCA7VyNQ") .then(res => res.json()) .then(data => console.log(data)) .catch(err => console.error(err)); Using async/await : async function getData() { try { const res = await fetch("https://lnkd.in/gCA7VyNQ"); const data = await res.json(); console.log(data); } catch (err) { console.error(err); } } What it does : - Returns a Promise - Cleaner than XMLHttpRequest - Works well with async/await #Day10 #JavaScript #100DaysOfCode
To view or add a comment, sign in
-
🚀 𝐃𝐚𝐲 6 – 𝐉𝐚𝐯𝐚𝐒𝐜𝐫𝐢𝐩𝐭 𝐄𝐯𝐞𝐧𝐭 𝐋𝐨𝐨𝐩 (𝐒𝐢𝐦𝐩𝐥𝐞 & 𝐂𝐥𝐞𝐚𝐫) JavaScript is single-threaded… 👉 But then how does it handle things like `setTimeout`? 🤔 Let’s understand the real flow 👇 --- 💡 The Setup JavaScript uses: * Call Stack → runs code * Web APIs → handles async tasks * Callback Queue → waits for execution * Event Loop → manages everything --- 💡Example: console.log("Start"); setTimeout(() => { console.log("Timeout"); }, 0); console.log("End"); --- 💡 Output: Start End Timeout --- 💡 Why? (Step-by-step) * `Start` → runs immediately * `setTimeout` → sent to Web APIs * `End` → runs immediately * Timer completes → callback goes to Queue * Event Loop checks → Stack empty * Callback pushed to Stack → executes --- ⚡ Key Insight 👉 Even with `0ms`, it does NOT run immediately 👉 It waits until the Call Stack is empty --- 💡 Simple Mental Model 👉 “Async code runs after sync code finishes” --- 💡 Why this matters? Because it explains: * execution order * async behavior * common bugs --- 👨💻 Continuing my JavaScript fundamentals series 👉 Next: **Promises (Async Made Better)** 👀 #JavaScript #WebDevelopment #FrontendDevelopment #Coding #SoftwareEngineer #Tech
To view or add a comment, sign in
-
-
Maps and Sets in JavaScript: A Deep Dive JavaScript provides several ways to store and manage data, with objects and arrays being the most commonly used structures. However, when dealing with unique values or key-value pairs with better effi Read more → https://lnkd.in/dvP2-4nH #TheCampusCoders #Tech #Developers #WebDev
To view or add a comment, sign in
-
Maps and Sets in JavaScript: A Deep Dive JavaScript provides several ways to store and manage data, with objects and arrays being the most commonly used structures. However, when dealing with unique values or key-value pairs with better effi Read more → https://lnkd.in/dvP2-4nH #TheCampusCoders #Tech #Developers #WebDev
To view or add a comment, sign in
-
Maps and Sets in JavaScript: A Deep Dive JavaScript provides several ways to store and manage data, with objects and arrays being the most commonly used structures. However, when dealing with unique values or key-value pairs with better effi Read more → https://lnkd.in/dvP2-4nH #TheCampusCoders #Tech #Developers #WebDev
To view or add a comment, sign in
-
Maps and Sets in JavaScript: A Deep Dive JavaScript provides several ways to store and manage data, with objects and arrays being the most commonly used structures. However, when dealing with unique values or key-value pairs with better effi Read more → https://lnkd.in/dvP2-4nH #TheCampusCoders #Tech #Developers #WebDev
To view or add a comment, sign in
-
Maps and Sets in JavaScript: A Deep Dive JavaScript provides several ways to store and manage data, with objects and arrays being the most commonly used structures. However, when dealing with unique values or key-value pairs with better effi Read more → https://lnkd.in/dvP2-4nH #TheCampusCoders #Tech #Developers #WebDev
To view or add a comment, sign in
Explore content categories
- Career
- Productivity
- Finance
- Soft Skills & Emotional Intelligence
- Project Management
- Education
- Technology
- Leadership
- Ecommerce
- User Experience
- Recruitment & HR
- Customer Experience
- Real Estate
- Marketing
- Sales
- Retail & Merchandising
- Science
- Supply Chain Management
- Future Of Work
- Consulting
- Writing
- Economics
- Artificial Intelligence
- Employee Experience
- Workplace Trends
- Fundraising
- Networking
- Corporate Social Responsibility
- Negotiation
- Communication
- Engineering
- Hospitality & Tourism
- Business Strategy
- Change Management
- Organizational Culture
- Design
- Innovation
- Event Planning
- Training & Development