JavaScript Block Scope and Variable Hoisting Explained

🚀 Codewars Kata Reflection: “What’s the Real Floor?” (8 kyu, JavaScript) Today I revisited a deceptively simple Codewars challenge that reinforced an important lesson: clarity in problem modeling beats complexity in code. 🧠 The problem American and European floor numbering systems differ: In the US, the 1st floor is actually the ground floor There is no 13th floor Basements (negative floors) remain unchanged The task was to convert an American floor number into its European equivalent. 💡 Why the solution works function getRealFloor(n) { return n <= 0 ? n : n < 13 ? n - 1 : n - 2; } This works because it mirrors the real-world rules directly: Basements (n <= 0) These are universal - no transformation needed. Floors 1-12 Since “1” maps to ground floor, all values shift down by 1. Floors above 13 Two numbers are missing below them: Floor 1 (ground floor) Floor 13 So we shift down by 2. Instead of looping or mapping values, the logic is handled with simple conditional branching, making the intent obvious and the behavior predictable. ⚡ Time & Space Complexity Time Complexity: O(1) - constant time, no loops, no recursion Space Complexity: O(1) - no additional memory allocated. 📚 What I learned 1. Not every problem needs iteration - sometimes rules are enough 2. Writing code that reflects real-world constraints leads to simpler solutions 3. Even beginner-level katas are great for sharpening logic, edge-case thinking, and code expressiveness. Small challenges, big reminders. On to the next kata 🧩💪 #Codewars #JavaScript #ProblemSolving #CleanCode #SoftwareEngineering #LearningInPublic #Algorithms

LeetCode Problem: Longest Common Prefix What I Learned: • How nested loops simulate 2D comparison (character index vs string index) • Comparing each string character with the first string as a reference • Using the OR operator (||) to handle multiple stopping conditions • Understanding short-circuit evaluation to prevent unnecessary checks • How .slice(0, i) extracts the valid prefix before mismatch • Why return immediately stops the entire function execution • Handling edge cases like complete match or no common prefix • Writing an efficient O(n × m) solution using simple iteration logic Problem Summary: You’re given an array of strings and need to find the longest common prefix among them. The core idea is: Compare each character of the first string With the same position in all other strings. If: • A string becomes shorter • OR characters don’t match → Stop immediately and return the prefix until that index. If no mismatch is found after full iteration → return the entire first string. This problem strengthened my understanding of control flow, string indexing, and early returns in JavaScript. A great example of breaking execution at the right time instead of overcomplicating logic. #100DaysOfLeetCode #leetcode #javascript #problemsolving #codingjourney #DSA #StringManipulation #AlgorithmicThinking Link: https://lnkd.in/gnvmJK-r

𝗪𝗲𝗹𝗰𝗼𝗺𝗲 𝘁𝗼 𝗗𝗮𝘆 𝟮𝟬 What if you could control every interaction with an object — reads, writes, deletes — without changing the object itself? That’s what Proxy does. 𝘼 𝙋𝙧𝙤𝙭𝙮 𝙞𝙨 𝙖 𝙬𝙧𝙖𝙥𝙥𝙚𝙧 𝙖𝙧𝙤𝙪𝙣𝙙 𝙖𝙣 𝙤𝙗𝙟𝙚𝙘𝙩 𝙩𝙝𝙖𝙩 𝙞𝙣𝙩𝙚𝙧𝙘𝙚𝙥𝙩𝙨 𝙡𝙤𝙬-𝙡𝙚𝙫𝙚𝙡 𝙤𝙥𝙚𝙧𝙖𝙩𝙞𝙤𝙣𝙨 𝙡𝙞𝙠𝙚: -> Property access -> Property assignment -> Property deletion -> Function calls -> Object construction 𝙄𝙣𝙨𝙩𝙚𝙖𝙙 𝙤𝙛: Engine → Object 𝙄𝙩 𝙗𝙚𝙘𝙤𝙢𝙚𝙨: Engine → Proxy → Object The Proxy decides what happens. 𝙒𝙝𝙮 𝙄𝙩 𝙈𝙖𝙩𝙩𝙚𝙧𝙨: 𝙋𝙧𝙤𝙭𝙮 𝙡𝙚𝙩𝙨 𝙮𝙤𝙪 𝙘𝙤𝙣𝙩𝙧𝙤𝙡 𝙗𝙚𝙝𝙖𝙫𝙞𝙤𝙧, 𝙣𝙤𝙩 𝙟𝙪𝙨𝙩 𝙙𝙖𝙩𝙖. You can: -> Validate values before saving -> Block unknown properties -> Log every change -> Create computed/virtual properties 𝘛𝘩𝘦 𝘰𝘣𝘫𝘦𝘤𝘵 𝘴𝘵𝘢𝘺𝘴 𝘵𝘩𝘦 𝘴𝘢𝘮𝘦. 𝘛𝘩𝘦 𝘪𝘯𝘵𝘦𝘳𝘢𝘤𝘵𝘪𝘰𝘯 𝘳𝘶𝘭𝘦𝘴 𝘤𝘩𝘢𝘯𝘨𝘦. #JavaScript #JSInternals #FrontendEngineering #WebDevelopment #SoftwareEngineering #ECMAScript #MetaProgramming #FrontendArchitecture #TechDeepDive #Coding

𝗪𝗲𝗹𝗰𝗼𝗺𝗲 𝘁𝗼 𝗗𝗮𝘆 𝟭𝟬 Let's understand 𝗧𝗲𝗺𝗽𝗼𝗿𝗮𝗹 𝗗𝗲𝗮𝗱 𝗭𝗼𝗻𝗲 (𝗧𝗗𝗭) Creation Phase • scope is created • variable names are registered • memory is allocated Execution Phase • code runs line by line • values are assigned 𝙒𝙝𝙖𝙩 𝙝𝙖𝙥𝙥𝙚𝙣𝙨 𝙩𝙤 𝙫𝙖𝙧𝙞𝙖𝙗𝙡𝙚𝙨? 𝚟𝚊𝚛 𝚊 = 𝟷𝟶; • hoisted • initialized as undefined • accessible immediately 𝚕𝚎𝚝 𝚋 = 𝟸𝟶; • hoisted • not initialized • stored in a separate memory slot This uninitialized window is called the Temporal Dead Zone. 𝙒𝙝𝙚𝙣 𝙙𝙤𝙚𝙨 𝙏𝘿𝙕 𝙨𝙩𝙖𝙧𝙩 𝙖𝙣𝙙 𝙚𝙣𝙙? • TDZ starts when the scope is entered • TDZ ends when the variable is initialized The length of TDZ depends on when the declaration is executed, not where it is written. 𝙒𝙝𝙮 𝙙𝙤𝙚𝙨 𝙅𝙖𝙫𝙖𝙎𝙘𝙧𝙞𝙥𝙩 𝙩𝙝𝙧𝙤𝙬 𝙍𝙚𝙛𝙚𝙧𝙚𝙣𝙘𝙚𝙀𝙧𝙧𝙤𝙧? Because: • the variable exists • but its value is unavailable TDZ is designed to: • prevent silent bugs • fail fast instead of returning undefined • enforce predictable execution order 𝙏𝘿𝙕 𝙞𝙨 𝙖𝙗𝙤𝙪𝙩 𝙩𝙞𝙢𝙚, 𝙣𝙤𝙩 𝙨𝙘𝙤𝙥𝙚 A variable can be in the same scope and still be inaccessible if it is accessed before initialization. TDZ is enforced strictly based on execution timing. 𝙏𝘿𝙕 𝙬𝙞𝙩𝙝 𝙘𝙤𝙣𝙨𝙩 const is intentionally stricter: • it must be initialized immediately • reassignment is disallowed • TDZ enforces immutability rules 𝙆𝙚𝙮 𝙞𝙣𝙨𝙞𝙜𝙝𝙩 Temporal Dead Zone is not about hoisting being absent. It exists because initialization is delayed. let and const are hoisted — but safely. #JavaScript #TemporalDeadZone #JavaScriptHoisting #LetAndConst #JavaScriptFundamentals #JSConcepts #FrontendDevelopment #WebDevelopment #FrontendDeveloper #SoftwareEngineering #LearningInPublic #100DaysOfJavaScript

✅ Solved LeetCode: Binary Tree Postorder Traversal (145) Implemented an iterative Postorder Traversal in JavaScript using two stacks, following the sequence: Left → Right → Root. The strategy works as follows: - Use the first stack (s1) to process nodes in a modified preorder fashion (Root → Left → Right). - Push each popped node into a second stack (s2). - After traversal, pop nodes from s2 to get the correct Postorder sequence. This approach effectively simulates recursion while maintaining the correct traversal order. ⏱ Time Complexity: O(n) — each node is processed once 🧠 Space Complexity: O(n) — due to the use of two stacks A neat stack-based trick to achieve Postorder without recursion! 🌳

✅ Solved LeetCode: Binary Tree Postorder Traversal (145) Implemented an iterative Postorder Traversal in JavaScript using a single stack and a lastVisited pointer, following the sequence: Left → Right → Root. The strategy works as follows: - Traverse to the leftmost node, pushing nodes onto the stack. - Peek the top of the stack to decide the next move: -If the right child exists and hasn’t been visited, move to the right subtree. -Otherwise, process (visit) the node and mark it as last visited. - Repeat until both the stack is empty and current node is null. This approach simulates recursion explicitly while avoiding multiple stacks. ⏱ Time Complexity: O(n) — each node is visited once 🧠 Space Complexity: O(h) — stack space based on tree height A more optimized and elegant iterative way to achieve Postorder traversal! 🌳

𝗨𝗻𝗱𝗲𝗿𝘀𝘁𝗮𝗻𝗱𝗶𝗻𝗴 𝗩𝗮𝗿, 𝗟𝗲𝘁, 𝗮𝗻𝗱 𝗖𝗼𝗻𝘀𝘁 𝗶𝗻 𝗝𝗮𝗵𝗮𝘀𝗰𝗿𝗶𝗽𝘁 You use var, let, and const to declare variables in JavaScript. But what's the difference between them? - Var is function-scoped, not block-scoped. - Let is block-scoped, which helps prevent mistakes. - Const is also block-scoped and makes your code more predictable. Var allows redeclaration and reassignment. Let allows reassignment but not redeclaration. Const does not allow redeclaration or reassignment. In modern JavaScript, const is often used by default. This makes programs safer and easier to understand. Source: https://lnkd.in/gcMnXPEg

LeetCode Problem 11: Container With Most Water What I Learned: • How the area is determined by the minimum height of the two lines, not the taller one • Why brute force (checking all pairs) is inefficient for large inputs • How the two-pointer approach reduces time complexity from O(n²) to O(n) • Why moving the pointer with the smaller height is the key optimization • How to balance width and height to maximize the container area • Translating a geometric problem into clean pointer-based logic Problem Summary: You’re given an array where each element represents the height of a vertical line. The task is to choose two lines such that, together with the x-axis, they form a container that can store the maximum amount of water. This problem is a great example of how understanding constraints leads to an optimal strategy instead of brute-force thinking. #100DaysOfLeetCode #leetcode #javascript #problemsolving #codingjourney #DSA #TwoPointers #AlgorithmicThinking Link: https://lnkd.in/gGPwsZb4

🚀 Optimizing Array Manipulation: The Two-Pointer Strategy 💡 Yesterday, I tackled the "Move Zeroes" challenge on LeetCode using JavaScript! 👨💻 The mission? Move all 0s to the end of an array while preserving the relative order of non-zero elements—all without creating a copy of the array. 🚫📋 Initially, a common approach is to filter and join arrays, but that results in $O(n)$ space complexity. To keep the solution professional and memory-efficient, I implemented the Two-Pointer technique. 🎯 🧠 The Logic: Pointer A (Slow): 🐢 Tracks the position where the next non-zero element belongs. Pointer B (Fast): 🐇 Iterates through the entire array to find non-zero values. The Swap: ✨ Whenever Pointer B encounters a non-zero element, we swap the values and increment Pointer A. 📊 The Result: ✅ Time Complexity: $O(n)$ (Clean, single-pass efficiency) ✅ Space Complexity: $O(1)$ (Optimized in-place manipulation) Mastering these "in-place" constraints is a game-changer for writing scalable, production-ready code. It’s not just about solving the problem; it’s about solving it efficiently. 💪 #JavaScript #WebDevelopment #LeetCode #Algorithms #CodingInterview #SoftwareEngineering #ProblemSolving #100DaysOfCode

𝗠𝗮𝘀𝘁𝗲𝗿𝗶𝗻𝗴 𝗖𝗼𝗻𝘁𝗿𝗼𝗹 𝗙𝗹𝗼𝘄 𝗶𝗻 𝗝𝗮𝘃𝗮𝗦𝗰𝗿𝗶𝗽𝘁 Every decision has a path. You make choices every day. If it's raining, you take an umbrella. If it's not raining, you walk normally. This is how programming works. A program without decision-making is just a sequence of instructions. Control flow determines the order in which statements execute. It includes conditional branching, loops, and function execution. By default, JavaScript executes code top to bottom. But using control flow statements, you can: - Skip parts of code - Execute specific blocks based on conditions - Choose between multiple paths Control flow is how your program decides what to run and when. You use if, else if, and else statements to make decisions. The if statement runs a block of code only if the condition is true. The if-else statement gives you an alternative path. The else if statement helps you give multiple conditions. You can also use switch statements when comparing one variable to many exact values. The ternary operator is a shorthand for if-else. It returns a value based on the condition. Mastering control flow is foundational. It transforms JavaScript from a passive script into an intelligent decision-maker. You can use control flow to make your code react and become powerful. Source: https://lnkd.in/gm5J36X3