🏗️ Constructor Functions (Before Classes) Before class existed in JavaScript, developers used this: function User(name) { this.name = name; } User.prototype.sayHi = function () { console.log(this.name); }; const user1 = new User("Ahmed"); At first, it looks old… but it teaches something powerful. 💡 What’s really happening: user1 = { name: "Ahmed", __proto__: User.prototype } 🔥 Key idea: 👉 Methods are stored in prototype 👉 All instances share them So instead of duplicating functions in memory… ✔ One function ✔ Shared across all objects 🧠 Why this matters: This is the real foundation behind: Classes Inheritance Object behavior in JS 🚀 My takeaway: Constructor functions may look outdated… but they reveal how JavaScript actually works. And once you understand them, classes become much clearer. #JavaScript #OOP #WebDevelopment #Frontend
Ahmed Magdy’s Post
More Relevant Posts
-
⚛️ What is a Prototype in JavaScript? This is the concept that made everything click for me. Every object in JavaScript has a hidden link: 👉 [[Prototype]] 💡 Simple example: const user = { sayHi() { console.log("Hi"); } }; const ahmed = { name: "Ahmed" }; ahmed.__proto__ = user; ahmed.sayHi(); // "Hi" Wait… ahmed doesn’t have sayHi. So how did it work? 👉 JavaScript looks up the prototype chain 🔥 What actually happens: JS looks inside ahmed Not found Goes to its prototype Finds sayHi → executes 🧠 That’s inheritance in JavaScript. Not copying code… but linking objects together. 🚀 My takeaway: Objects in JS don’t stand alone — they’re part of a chain. And understanding that chain changes everything. #JavaScript #Frontend #Programming #OOP
To view or add a comment, sign in
-
JavaScript keeps evolving, and ECMAScript 2026 is bringing some genuinely useful improvements that developers will appreciate. Here are five new features that caught my attention: 1. Temporal API A much-needed modern replacement for the old Date object. It brings cleaner handling of dates, times, and timezones—something JavaScript developers have struggled with for years. 2. Math.sumPrecise Better support for accurate floating-point calculations. This can help reduce common decimal precision issues like 0.1 + 0.2. 3. Iterator.concat A cleaner way to combine multiple iterators efficiently, making data handling and iteration more elegant. 4. Map.getOrInsert A handy shorthand for upsert-like behavior—get a value if it exists, or insert it if it doesn’t. 5. import defer A performance-focused feature that can improve how JavaScript modules are loaded. The best part is that many of these features are already supported in Node.js v22+ and modern browsers. It’s exciting to see JavaScript continuing to improve not just with flashy additions, but with practical features that solve real developer pain points. Which feature are you most interested in using first? #JavaScript #ECMAScript2026 #WebDevelopment #NodeJS #FrontendDevelopment #Programming #SoftwareEngineering #Developers
To view or add a comment, sign in
-
🚫 Stop using JSON.parse(JSON.stringify()) for deep cloning! It’s slow, breaks Dates, Maps, undefined, and more. Modern JS has better options like structuredClone(). If you're still using the old way in Angular or JS apps, you're risking bugs & performance issues. Read the blog & upgrade your approach 👇 #Angular #JavaScript #WebDevelopment #Frontend #CodingTips #Performance
To view or add a comment, sign in
-
#Day21 JavaScript just got a whole lot more interesting. Up until now, everything I wrote lived in the browser. Today I started working with Node.js and the fs module and for the first time, my code started talking to my computer directly. Three things clicked today: => Reading a file: "fs.readFile" opens a file sitting on your computer and prints its contents. That's it. No browser, no UI, just my code and my file system having a conversation. => Writing a file: "fs.writeFile" creates a brand new file and puts text inside it. If the file doesn't exist yet, Node creates it for you. One line of code does what used to feel like a whole process. => Appending to a file: "fs.appendFile" adds new content to an existing file without deleting what's already there. It runs after the file is created because in Node, async operations happen in sequence through callbacks. => process.on('uncaughtException'): Ending today with "process.on", this is a safety net. Instead of your program crashing with no explanation, it catches the error, tells you what went wrong, and shuts down cleanly. JavaScript isn't just a browser language. With Node.js, you can read files, write files, manage your system, and build backends all with the same language you already know. Same language. Bigger world. #NodeJS #JavaScript #M4ACELearningChallenge #BackendDevelopment #LearningToCode #WebDevelopment
To view or add a comment, sign in
-
-
🔸 I built a simple project using JavaScript Fetch API to retrieve data from a public API. This project demonstrates how to fetch and display users and posts dynamically from a server and render them on a webpage. It helped me understand: Asynchronous JavaScript (async/await) Fetch API DOM manipulation Error handling Working with JSON data 🔹 Features: Fetch user list from API Fetch posts from API Display data dynamically in UI Clean and responsive layout This is a great step toward mastering frontend development and working with real-world APIs. 💻 #JavaScript #FetchAPI #WebDevelopment #FrontendDevelopment #HTML #CSS #Coding #Programming #APIs #LearnToCode 👩💻
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
-
-
JavaScript in 2026: The Dev Update You Didn't Know You Needed ECMAScript continues to evolve, and this year's updates are particularly noteworthy for JavaScript developers. Here’s a comprehensive overview of what’s new, what’s on the horizon, and why it matters. 1. Temporal API — The Biggest JS Feature in Years (ES2026) Date handling in JavaScript has faced challenges since 1995. With the Temporal API, that’s changing. const now = Temporal.Now.zonedDateTimeISO("Asia/Kolkata"); console.log(now.toLocaleString()); // Correct. Always. 2. using keyword — Automatic Resource Cleanup (ES2026) This feature simplifies resource management in asynchronous functions. async function saveData() { await using file = new FileHandle("output.txt"); await file.write("hello"); // file auto-closed here, even on error } No more worries about forgetting to close database connections or file handles. The runtime ensures cleanup when the variable goes out of scope, which is a significant improvement for server-side Node.js development. 3. Iterator Helpers — Lazy Evaluation (ES2025) This update enhances efficiency by allowing lazy evaluation without creating extra arrays. // Old way: creates 3 new arrays array.map(x => x*2).filter(x => x>10).slice(0, 3); // New way: zero extra arrays, stops after 3 Iterator.from(array).map(x => x*2).filter(x => x>10).take(3).toArray(); This feature works seamlessly with Sets, Maps, Generators, and any iterable, improving performance and memory usage. Additional updates include: - Array.fromAsync() — Collect async generator results into an array effortlessly - Iterator.concat() — Lazily iterate across multiple pages/sources - Error.isError() — Reliably detect real Error #JavaScript #ECMAScript2026 #WebDevelopment #TypeScript #FrontendDev #NodeJS #Programming #SoftwareEngineering #TechNews #CodingLife
To view or add a comment, sign in
-
-
Most developers still deep clone objects like this: JSON.parse(JSON.stringify(data)) It works. Until it doesn't. Dates become strings. Functions vanish. undefined disappears silently. Circular references throw an error. There's a native alternative that actually handles these cases — and most developers don't know it exists. One caveat: structuredClone() doesn't clone functions or class instances — it's designed for data, not behavior. But for 90% of real-world cases, that's exactly what you need. Available natively in all modern browsers and Node.js 17+ — no library required. Are you still using JSON tricks for deep cloning? 👇 #JavaScript #WebDevelopment #Frontend #JS #SoftwareEngineering
To view or add a comment, sign in
-
-
Ever wondered how some functions “remember” values even after they finish executing? 🤯 That’s the power of JavaScript Closures. 👉 A closure is created when a function retains access to variables from its outer (parent) scope—even after the outer function has finished execution. Example: function outer() { let count = 0; return function inner() { count++; console.log(count); }; } const counter = outer(); counter(); // 1 counter(); // 2 counter(); // 3 🔍 Even though "outer()" has finished running, the "inner()" function still remembers "count". 💡 Why does this matter? Closures are used in: ✔ Data privacy (encapsulation) ✔ Function factories ✔ Maintaining state in async code ✔ React hooks & event handlers 🚀 Mastering closures = leveling up your JavaScript thinking. 👉 What’s one JavaScript concept that took you time to truly understand? #JavaScript #WebDevelopment #Frontend #Coding #LearnToCode #Developers
To view or add a comment, sign in
-
-
JavaScript is easy. Until it isn't. 😅 Every developer has been there. You're confident. Your code looks clean. You hit run. And then: " Cannot read properties of undefined (reading 'map') " The classic JavaScript wall. Here are 7 JavaScript mistakes I see developers make constantly and how to fix them: 1. Not understanding async/await ⚡ → Wrong: | const data = fetch('https://lnkd.in/dMDBzbsK'); console.log(data); // Promise {pending} | → Right: | const data = await fetch('https://lnkd.in/dMDBzbsK'); | 2. Using var instead of let/const → var is function scoped and causes weird bugs → Always use const by default. let when you need to reassign. Never var. 3. == instead of === → 0 == "0" is true in JavaScript 😱 → Always use === for comparisons. Always. 4. Mutating state directly in React → Wrong: user.name = "Shoaib" → Right: setUser({...user, name: "Shoaib"}) 5. Forgetting to handle errors in async functions → Always wrap await calls in try/catch → Silent failures are the hardest bugs to track down 6. Not cleaning up useEffect in React → Memory leaks are real → Always return a cleanup function when subscribing to events 7. Treating arrays and objects as primitives → [] === [] is false in JavaScript → Reference types don't compare like numbers — learn this early JavaScript rewards the developers who understand its quirks. 💡 Which of these caught YOU off guard when you first learned it? 👇 #JavaScript #WebDevelopment #Frontend #FullStackDeveloper #React #Programming #CodingTips #Developer #Tech #Pakistan #LearnToCode #JS #SoftwareEngineering #100DaysOfCode #PakistaniDeveloper
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