How JS Converts [] + {} to [object Object] —🤯 JavaScript can be weirdly magical sometimes. Ever tried this in your console? 👇 [] + {} // Output: "[object Object]" At first glance, it looks confusing — why does an empty array and an empty object become a string? Let’s decode the magic 🪄 1️⃣ + Operator in JS The + operator doesn’t just add numbers — it can also concatenate strings. 2️⃣ Type Conversion Happens! [] (empty array) → when converted to string becomes "" (empty string). {} (empty object) → when converted to string becomes "[object Object]". 3️⃣ Final Expression So JS actually does: "" + "[object Object]" → "[object Object]" ✅ Bonus twist: Try reversing it: {} + [] Now it gives 0 because {} is treated as an empty block,not an object. 🤯 JavaScript — where logic meets magic ✨ 🔹 Follow Prashansa Sinha for more fun JS mysteries and simple explanations 👩💻 #JavaScript #WebDevelopment #Coding #Frontend #JS #LearnToCode #Programming #TechCommunity #Developers #CodeNewbie #WebDev
How JavaScript converts [] + {} to [object Object]
More Relevant Posts
-
Ever seen a variable live even after its function dies? That’s Closure — the memory ninja of JavaScript 🧠 One of JavaScript’s most powerful (and tricky) features 💡 Let’s look at a simple example 👇 function counter() { let count = 0; return function () { count++; console.log(count); }; } const increment = counter(); increment(); // 1 increment(); // 2 increment(); // 3 Wait… how does count still remember its value? Didn’t the counter() function finish already? 😅 Here’s the magic 🪄 > A closure allows a function to “remember” the variables from the scope in which it was created — even after that scope is gone. In this example, The inner function still has access to count, Because it closes over the variables from its outer function. That’s why we call it a Closure 🔁 Closures are the reason we can create: ✅ Private variables ✅ Function factories ✅ Modular, memory-efficient code In short — > A closure is how JavaScript gives functions memory 🧠 #JavaScript #Closures #WebDevelopment #Frontend #MERNStack #NodeJS #ReactJS #Coding #SoftwareEngineering #Developers #JSFundamentals
To view or add a comment, sign in
-
⚡ JavaScript is easy… until it isn’t. Everyone knows: console.log("Hello World") But then JavaScript hits you with: [] == ![] → true typeof null → "object" {} + [] → 0 "5" - 2 → 3 "5" + 2 → "52" And suddenly, you question every life decision you’ve made. Here’s why beginners get stuck: ❌ They only “learn syntax” ✅ They don’t learn how JS thinks JS isn’t just a language. It’s a chaos engine powered by: coercion closures prototypes event loops async hell hoisting madness If you want to stop feeling like JS is trolling you: ✔ Understand how the call stack works ✔ Know the difference between == and === ✔ Stop abusing var like it’s 2009 ✔ Learn promises before crying about async/await ✔ Read the MDN docs, not just YouTube comments Real JS devs don’t copy snippets. They understand why they work. If JavaScript feels weird… Good. It’s weird on purpose. Master the weirdness, and it becomes your superpower. ⚡ #javascript #webdev #frontend #coding #softwareengineering #reactjs #nodejs #programming #developers #typescript #LearningEveryday
To view or add a comment, sign in
-
⚡ JavaScript is easy… until it isn’t. Everyone knows: console.log("Hello World") But then JavaScript hits you with: [] == ![] → true typeof null → "object" {} + [] → 0 "5" - 2 → 3 "5" + 2 → "52" And suddenly, you question every life decision you’ve made. Here’s why beginners get stuck: ❌ They only “learn syntax” ✅ They don’t learn how JS thinks JS isn’t just a language. It’s a chaos engine powered by: coercion closures prototypes event loops async hell hoisting madness If you want to stop feeling like JS is trolling you: ✔ Understand how the call stack works ✔ Know the difference between == and === ✔ Stop abusing var like it’s 2009 ✔ Learn promises before crying about async/await ✔ Read the MDN docs, not just YouTube comments Real JS devs don’t copy snippets. They understand why they work. If JavaScript feels weird… Good. It’s weird on purpose. Master the weirdness, and it becomes your superpower. ⚡ #javascript #webdev #frontend #coding #softwareengineering #reactjs #nodejs #programming #developers #typescript #LearningEveryday
To view or add a comment, sign in
-
JavaScript Concept — “The Power of Closures” 💭 Ever wondered how JavaScript functions “remember” the variables around them? That’s the magic of Closures — one of JavaScript’s most elegant features. Closures allow a function to access variables from its outer scope, even after that scope has closed. This concept powers some of the most powerful patterns in JS — from private variables to event handlers. Here’s a small example 👇 function counter() { let count = 0; return function() { count++; return count; }; } const add = counter(); console.log(add()); // 1 console.log(add()); // 2 It’s simple, elegant, and shows how deep JavaScript really is. #JavaScript #WebDevelopment #Coding #Frontend #Learning
To view or add a comment, sign in
-
⚙ Understanding Functions in JavaScript — The Building Blocks of Code A function in JavaScript is like a mini-program inside your main program. It allows you to reuse code, organize logic, and make your code modular. --- 💡 Definition: A function is a block of code designed to perform a particular task. You can define it once and call it multiple times. --- 🧠 Syntax: function greet(name) { console.log("Hello, " + name + "! 👋"); } greet("Kishore"); greet("Santhiya"); ✅ Output: Hello, Kishore! 👋 Hello, Santhiya! 👋 --- 🧩 Types of Functions: 1. Named Function function add(a, b) { return a + b; } 2. Anonymous Function const multiply = function(a, b) { return a * b; }; 3. Arrow Function const divide = (a, b) => a / b; --- ⚙ Why Functions Matter: ✅ Reusability ✅ Readability ✅ Easier debugging ✅ Cleaner, modular code --- 🔖 #JavaScript #WebDevelopment #FunctionsInJS #Frontend #CodingTips #JSConcepts #LearnToCode #100DaysOfCode #KishoreLearnsJS #DeveloperJourney #WebDevCommunity #CodeLearning
To view or add a comment, sign in
-
Hey, Mates. How are you doing? You know, Even experienced devs trip over JavaScript quirks sometimes — here are a few I’ve seen (and made myself 😅 as well): 1. Using var instead of let or const var is function-scoped and can cause weird bugs due to hoisting. ✅ Use let for variables that change and const for ones that don’t. 2. Forgetting to handle async properly Mixing promises, callbacks, and async/await can lead to race conditions or unhandled rejections. ✅ Always await async functions or chain with .then(), and wrap in try/catch. 3. Comparing values incorrectly == does type coercion (and sometimes weirdly!). ✅ Stick to === for strict comparison. 4. Misunderstanding this Arrow functions don’t have their own this — they inherit from the parent scope. ✅ Know when to use arrow functions vs regular ones. 5. Not handling floating-point math 0.1 + 0.2 !== 0.3 (yes, really). ✅ Use libraries like decimal.js or round your values when precision matters. ⸻ These are small details — but they separate good JavaScript from great JavaScript. 💬 What’s a JS mistake you’ve seen (or made) that taught you something valuable? #JavaScript #WebDevelopment #Programming #CodingTips #Frontend
To view or add a comment, sign in
-
🍏 JS Daily Bite #9 — Understanding Function Prototypes Every function in JavaScript has a special property called prototype — the foundation of how inheritance and object construction work in the language. 🔍 The Function Prototype Property All functions (except arrow functions) have a default prototype property Arrow functions ❌ do not have a prototype The prototype object includes a constructor property that points back to the function Each prototype object’s [[Prototype]] links up to Object.prototype 🧱 Adding Properties to Prototypes You can attach properties or methods to a function’s prototype to make them automatically available to all instances created with that function. This is a memory-efficient way to share behavior across instances! ⚡️ 🧩 Creating Instances with new When you use the new operator: A new object is created Its [[Prototype]] is set to the function’s prototype property Instance-specific properties are initialized Shared methods are inherited through the prototype chain 🧭 How Property Lookup Works When accessing a property: JavaScript checks the object itself If not found, it climbs the prototype chain ([[Prototype]]) The search continues until Object.prototype If still not found, the result is undefined 🧠 Key Takeaways Instance properties override prototype properties Prototype properties are shared across all instances The chain always ends at Object.prototype.[[Prototype]] === null Mastering this mechanism is essential for deep JavaScript understanding 💪 🔜 Next in the Series → Comparing Ways to Create and Mutate the Prototype Chain #JavaScript #WebDevelopment #Programming #TechEducation #LearnToCode #SoftwareDevelopment #JSInsights #CodeLearning #Frontend #JSFundamentals #Prototypes #JSDailyBite
To view or add a comment, sign in
-
❓ Are “undefined” and “not defined” the same in JavaScript? Not really. In JavaScript, every declared variable automatically gets the placeholder undefined during the memory allocation phase — meaning the variable exists, but no value has been assigned yet. However, if you try to access a variable that was never declared, JavaScript throws not defined. ➡️ Undefined = declared but not assigned ➡️ Not Defined = not declared at all JavaScript is also a loosely typed language, so variables can change types freely. 💡 Pro tip: Never manually assign undefined. Let JavaScript handle that. #JavaScript #WebDevelopment #Programming #Frontend #LearningJS
To view or add a comment, sign in
-
*5 Things I Wish I Knew When Starting JavaScript 👨💻* Looking back, JavaScript was both exciting and confusing when I started. Here are 5 things I wish someone had told me earlier: *1. var is dangerous. Use "let" and "const" "var" is function-scoped and can lead to unexpected bugs. "let" and "const" are block-scoped and safer. *2. JavaScript is asynchronous Things like "setTimeout()"and "fetch()" don’t behave in a straight top-down flow. Understanding the *event loop* helps a lot. *3. Functions are first-class citizens* – You can pass functions as arguments, return them, and even store them in variables. It’s powerful once you get used to it. *4. The DOM is slow – avoid unnecessary access* – Repeated DOM queries and manipulations can hurt performance. Use "documentFragment" or batch changes when possible. *5. Don’t ignore array methods* map(), "filter()" , "reduce()", "find()"… they make code cleaner and more readable. I wish I started using them sooner. 💡 *Bonus Tip:* "console.log()" is your best friend during debugging! If you’re starting out with JS, save this. And if you're ahead in the journey — what do *you* wish you knew earlier? #JavaScript #WebDevelopment #CodingJourney #Frontend #LearnToCode #DeveloperTips
To view or add a comment, sign in
-
💡 Most devs think shallow copies always affect the original… but that’s not true! Let’s clear this common JavaScript misconception 👇 🧩 Example 1 — Primitives let obj = { a: 1, b: 2, c: 3 }; let obj2 = { ...obj }; obj2.b++; console.log(obj.b); // 2 ✅ unchanged ➡️ Here b is a primitive (number). Primitives are copied by value, so obj and obj2 have separate copies. Incrementing obj2.b doesn’t affect obj.b. ⚠️ Example 2 — Nested Objects let obj = { a: 1, b: { x: 10 } }; let obj2 = { ...obj }; obj2.b.x = 99; console.log(obj.b.x); // 99 ❗changed ➡️ Here b is an object, and a shallow copy only copies its reference. Both obj.b and obj2.b point to the same memory. So changing one affects the other. 💬 TL;DR Shallow copy doesn’t always affect the original — it depends on what’s inside the object. Primitives → safe Objects → shared #JavaScript #Frontend #WebDevelopment #ReactJS #CodingTips #Programming #JSFacts
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