🚀 Day 11/100 – Understanding Prototypes in JavaScript Today I deep dived into one of the most fundamental concepts in JavaScript: Prototypes. 🧠 Problem: How does JavaScript enable inheritance between objects? ✅ Example: function Person(name) { this.name = name; } Person.prototype.greet = function () { console.log(`Hello, my name is ${this.name}`); }; const user1 = new Person("Bunty"); user1.greet(); // Output: Hello, my name is Bunty 💡 What’s Happening Here? Every JavaScript function has a prototype property. Objects created using new inherit from that prototype. Methods defined on the prototype are shared across all instances. This improves memory efficiency. 📌 Why Not Define Method Inside Constructor? If we write: function Person(name) { this.name = name; this.greet = function () { console.log(`Hello, my name is ${this.name}`); }; } Now every instance gets its own copy of greet() ❌ Which increases memory usage. Prototype keeps it optimized ✅ 🧠 Key Learnings: JavaScript uses prototypal inheritance (not classical inheritance). The __proto__ links objects to their prototype. Method lookup happens through the prototype chain. Core JS concepts like Array, Object, Function are built using prototypes. Understanding prototypes makes closures, inheritance, and even React internals easier to grasp. I’m currently open to Frontend Developer opportunities (React / Next.js) and available for immediate joining. 📩 Email: bantykumar13365@gmail.com 📱 Mobile: 7417401815 If you're hiring or know someone who is, feel free to connect. #OpenToWork #FrontendDeveloper #JavaScript #Prototypes #ReactJS #ImmediateJoiner #100DaysOfCode
JavaScript Prototypes Explained
More Relevant Posts
-
🚀 Day 20/100 – Implementing a curry() Function in JavaScript Today I explored an advanced JavaScript concept: Currying. Currying transforms a function with multiple arguments into a sequence of functions, each taking a single argument. 🧠 Problem: Convert a function so that it can be called like: sum(1)(2)(3) // 6 ✅ Solution: function curry(fn) { return function curried(...args) { if (args.length >= fn.length) { return fn(...args); } else { return function (...nextArgs) { return curried(...args, ...nextArgs); }; } }; } function sum(a, b, c) { return a + b + c; } const curriedSum = curry(sum); console.log(curriedSum(1)(2)(3)); console.log(curriedSum(1, 2)(3)); console.log(curriedSum(1)(2, 3)); ✅ Output: 6 6 6 💡 Key Learnings: • Currying allows partial application of functions • Helps create reusable and flexible functions • Improves function composition • Common in functional programming 📌 Real World Usage: • Used in utility libraries like Lodash • Helps in writing cleaner React code • Useful in event handling and reusable logic Understanding currying improves how you think about functions and composition in JavaScript. I’m currently open to Frontend Developer opportunities (React / Next.js) and available for immediate joining. 📩 Email: bantykumar13365@gmail.com 📱 Mobile: 7417401815 If you're hiring or know someone who is, I’d love to connect. #OpenToWork #FrontendDeveloper #JavaScript #ReactJS #NextJS #ImmediateJoiner #100DaysOfCode
To view or add a comment, sign in
-
🚀 Day 18/100 – Understanding Memoization in JavaScript Today I explored a powerful optimization technique in JavaScript: Memoization. Memoization helps improve performance by caching the result of expensive function calls and returning the cached result when the same inputs occur again. 🧠 Problem: How can we avoid recalculating the same function result multiple times? ✅ Example: function memoize(fn) { const cache = {}; return function (...args) { const key = JSON.stringify(args); if (cache[key]) { console.log("From cache"); return cache[key]; } console.log("Calculated"); const result = fn(...args); cache[key] = result; return result; }; } function slowSquare(n) { return n * n; } const memoizedSquare = memoize(slowSquare); console.log(memoizedSquare(5)); console.log(memoizedSquare(5)); ✅ Output: Calculated 25 From cache 25 💡 Key Learnings: • Memoization stores previously computed results • Prevents unnecessary recalculations • Improves performance in expensive operations • Widely used in optimization techniques 📌 Real World Usage: Memoization concepts are used in: • React performance optimization (useMemo) • Dynamic programming algorithms • Expensive computations • Caching API results I’m currently open to Frontend Developer opportunities (React / Next.js) and available for immediate joining. 📩 Email: bantykumar13365@gmail.com 📱 Mobile: 7417401815 If you're hiring or know someone who is, I’d love to connect. #OpenToWork #FrontendDeveloper #JavaScript #ReactJS #NextJS #ImmediateJoiner #100DaysOfCode
To view or add a comment, sign in
-
👋 Hi LinkedIn! I’m a Frontend Developer working with JavaScript, React, Angular and modern frontend technologies. Over the next few weeks, I’ll be sharing: • JavaScript concepts • Frontend interview questions • Performance optimization tips • Real-world frontend problems & solutions If you're preparing for frontend interviews or building scalable UI applications, please feel free to follow along. Let’s grow together 🚀 Comment down your favorite topics. #javascript #frontend #webdevelopment #js #UI #AI #angular #reactjs #webdevelopment #softwareengineering #programming
To view or add a comment, sign in
-
5 JavaScript tricks that made me a better Frontend Developer 👇 1️⃣ Optional Chaining (?.) Instead of: if(user && user.address && user.address.city) Just write: user?.address?.city ✅ 2️⃣ Nullish Coalescing (??) Instead of: value !== null && value !== undefined ? value : 'default' Just write: value ?? 'default' ✅ 3️⃣ Destructuring Instead of: const name = user.name; const age = user.age Just write: const { name, age } = user ✅ 4️⃣ Array spread operator Merge arrays easily: const merged = [...array1, ...array2] ✅ 5️⃣ Promise.all() Run multiple API calls simultaneously: const [user, posts] = await Promise.all([ fetchUser(), fetchPosts() ]) ✅ Which one did you already know? Comment below! 👇 #JavaScript #Frontend #ReactJS #WebDevelopment #Programming #100DaysOfCode
To view or add a comment, sign in
-
-
🚀 Day 14/100 – Implementing a "flattenArray" Function (JavaScript) Today I solved a common JavaScript problem: Flattening a nested array. --- 🧠 Problem: Given a nested array, return a single-level array containing all the elements. Example: Input: [1, 2, [3, 4], [5, [6, 7]]] Output: [1, 2, 3, 4, 5, 6, 7] --- ✅ Solution (Using Recursion): function flattenArray(arr) { const result = []; for (let item of arr) { if (Array.isArray(item)) { result.push(...flattenArray(item)); } else { result.push(item); } } return result; } const arr = [1, 2, [3, 4], [5, [6, 7]]]; console.log(flattenArray(arr)); // Output: [1,2,3,4,5,6,7] --- 💡 Key Learning: - Recursion helps solve nested data problems - "Array.isArray()" checks whether a value is an array - Spread operator ("...") helps merge results --- 📌 Time Complexity: O(n) – Every element is processed once. 📌 Space Complexity: O(n) – For the result array. --- 🧠 Why This Matters? Flattening arrays is useful in: - Data transformation - Handling nested API responses - Building utility functions - JavaScript interview questions --- I’m currently open to Frontend Developer opportunities (React / Next.js) and available for immediate joining. 📩 Email: bantykumar13365@gmail.com 📱 Mobile: 7417401815 If you're hiring or know someone who is, feel free to connect. #OpenToWork #FrontendDeveloper #JavaScript #ReactJS #NextJS #ImmediateJoiner #100DaysOfCode
To view or add a comment, sign in
-
🚀 JavaScript vs React.js – What’s the Real Difference? As a web developer, one of the most common questions is: 👉 Should I focus on JavaScript or React.js? 🔶 JavaScript is the core programming language of the web. It handles: 🔹 Logic & Functionality 🔹 DOM Manipulation 🔹 API Handling 🔹 Dynamic Interactions 🔶 React.js is a powerful JavaScript library used for: 🔹 Building Reusable Components 🔹 Creating Modern UI 🔹 Managing State with Hooks 🔹 Fast Rendering using Virtual DOM 💡 The Reality: 🔹 React.js runs on JavaScript. 🔹 You can’t master React without understanding JavaScript first. 🔥 So which one is best? It’s not about “vs” — it’s about “with”. JavaScript builds the foundation, React builds scalable and modern interfaces on top of it. As a passionate developer, I believe learning both strategically opens the door to strong frontend development and better opportunities. #JavaScript #ReactJS #WebDevelopment #FrontendDeveloper #CodingJourney #LearnToCode #TechGrowth #LearnReactjs #LearningInPublic #InterviewQ
To view or add a comment, sign in
-
-
Tech moves fast. If you blink, there’s a new JavaScript framework. 🌪️ One of the most overwhelming parts of web development is feeling like you need to know everything. React, Vue, Angular, Node, Tailwind, TypeScript... the list is endless. Here is my advice to anyone feeling tutorial fatigue: Stop trying to learn everything, and start building something. The best way to solidify your knowledge isn't watching another 4-hour video. It's getting your hands dirty. 💡 The Blueprint for Growth: Pick one language/framework. Build a project you actually care about. Get stuck. Read the documentation. Fix the problem. Repeat. Focus on the fundamentals (HTML, CSS, Vanilla JS, how the web works). Frameworks come and go, but strong fundamentals make you adaptable to anything the tech world throws at you. 🧠 #WebDevelopment #SoftwareEngineering #ProgrammingTips #CodingLife #TechTrends #CareerAdvice #HiringTech #JuniorDeveloper #FullStackDeveloper #ContinuousLearning #ReactJS #JavaScript #TailwindCSS #TypeScript #FrontendDevelopment #BuildInPublic #100DaysOfCode #VibeCoding #DeveloperExperience
To view or add a comment, sign in
-
-
Recently, I interviewed for multiple Senior React.js & Tech Lead roles — and noticed a pattern. Most interviewers asked basic but frequently repeated questions that test your clarity of concepts + coding approach. Here are the Top 10 common questions I was asked 👇 1️⃣ Call, Apply, Bind → Difference + Polyfill implementation 2️⃣ Flatten an Array without Array.flat() 👉 Input: [1,2,3,[4,5,6,[7,8,[10,11]]],9] 👉 Output: [1,2,3,4,5,6,7,8,10,11,9] 3️⃣ Inline 5 divs in a row without flex/margin/padding (Hint: display: inline-block) 4️⃣ Find sum of numbers without a for loop (Hint: reduce() / recursion) 5️⃣ Deep Copy vs Shallow Copy — behavior & how to achieve it 6️⃣ Promise & Async/Await output puzzle 7️⃣ Find first repeating character (e.g., "success" → "c") 8️⃣ Stopwatch Implementation (Start, Stop, Reset + live timer) 9️⃣ Build a To-Do List (Vanilla JS/React) → optimize re-renders 🔟 Currying for Infinite Sum 👉 sum(10)(20)(30)() → 60 👉 sum(10)(20)(30)(40)(50)(60)() → 210 𝐠𝐞𝐭 𝐞𝐛𝐨𝐨𝐤 𝐰𝐢𝐭𝐡 (detailed 232 ques = 90+ frequently asked Javascript interview questions and answers, 70+ Reactjs Frequent Ques & Answers, 50+ Output based ques & ans, 23+ Coding Questions & ans, 2 Machine coding ques & ans) 𝐄𝐛𝐨𝐨𝐤 𝐋𝐢𝐧𝐤: https://lnkd.in/gJMmH-PF Follow on Instagram : https://lnkd.in/gXTrcaKP #javascript #javascriptdeveloper #reactjs #reactnative #vuejsdeveloper #angular #angulardeveloper
To view or add a comment, sign in
-
Recently, I interviewed for multiple Senior React.js & Tech Lead roles — and noticed a pattern. Most interviewers asked basic but frequently repeated questions that test your clarity of concepts + coding approach. Here are the Top 10 common questions I was asked 👇 1️⃣ Call, Apply, Bind → Difference + Polyfill implementation 2️⃣ Flatten an Array without Array.flat() 👉 Input: [1,2,3,[4,5,6,[7,8,[10,11]]],9] 👉 Output: [1,2,3,4,5,6,7,8,10,11,9] 3️⃣ Inline 5 divs in a row without flex/margin/padding (Hint: display: inline-block) 4️⃣ Find sum of numbers without a for loop (Hint: reduce() / recursion) 5️⃣ Deep Copy vs Shallow Copy — behavior & how to achieve it 6️⃣ Promise & Async/Await output puzzle 7️⃣ Find first repeating character (e.g., "success" → "c") 8️⃣ Stopwatch Implementation (Start, Stop, Reset + live timer) 9️⃣ Build a To-Do List (Vanilla JS/React) → optimize re-renders 🔟 Currying for Infinite Sum 👉 sum(10)(20)(30)() → 60 👉 sum(10)(20)(30)(40)(50)(60)() → 210 𝐠𝐞𝐭 𝐞𝐛𝐨𝐨𝐤 𝐰𝐢𝐭𝐡 (detailed 232 ques = 90+ frequently asked Javascript interview questions and answers, 70+ Reactjs Frequent Ques & Answers, 50+ Output based ques & ans, 23+ Coding Questions & ans, 2 Machine coding ques & ans) 𝐄𝐛𝐨𝐨𝐤 𝐋𝐢𝐧𝐤: https://lnkd.in/gJMmH-PF Follow on Instagram : https://lnkd.in/gXTrcaKP #javascript #javascriptdeveloper #reactjs #reactnative #vuejsdeveloper #angular #angulardeveloper
To view or add a comment, sign in
-
🚀 Frontend Developer Roadmap If you want to become a Frontend Developer, start by building a strong foundation step by step: 1️⃣ HTML & CSS – Structure and styling of websites 2️⃣ JavaScript – Add interactivity and dynamic behavior 3️⃣ Responsive Design – Make websites work on all devices 4️⃣ Frontend Frameworks – React / Vue / Angular 5️⃣ Version Control – Git & GitHub 6️⃣ APIs – Fetch and display data from servers 7️⃣ Performance & Optimization – Faster and better user experience The key is simple: Keep learning. Keep building. Keep improving. 💻 💬 Which frontend skill are you currently learning? #frontenddeveloper #webdevelopment #javascript #coding #developers #tech
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