When you define multiple functions with the same name inside another function in JavaScript, only the last declaration takes effect due to function hoisting. JavaScript hoists all function declarations to the top of their scope, and if the same function name is declared more than once, the latest version overrides the previous ones — even if it appears after a return statement or is never reached during execution. This behavior can lead to unexpected results and is important to understand for writing predictable, maintainable code.

💡 Let’s Understand This with an Example:

function test() {
  function sayHi() {
    console.log("Hi from inner 1");
  }

  return;

  function sayHi() {
    console.log("Hi from inner 2");
  }
}

test();

✅ What does this code log to the console?

Answer: Nothing.

There is no error, but also no output.

---

🧠 What Actually Happens Behind the Scenes?

When JavaScript interprets this function, it hoists both sayHi declarations to the top of the test() function. The second declaration (even though it’s after the return) overwrites the first one.

So, the JavaScript engine effectively sees this:

function test() {
  function sayHi() {
    console.log("Hi from inner 2"); // This version takes precedence
  }

  return;
}

No function is called, and therefore nothing is printed.

---

⚠️ Common Misconception

Many developers (especially those new to hoisting) believe that code after a return statement is ignored — and while it’s true that it won’t execute, it will still be parsed.

That means:

• All declarations, including those after return, are hoisted.
• The last function declaration in source order is the one that survives.
• Even unreachable code can still impact the final behavior of your function due to hoisting.

---

✅ Key Takeaways

• Function declarations are hoisted in full — both their name and body — to the top of their scope.
• When there are multiple declarations with the same name, the last one wins.
• Code after a return statement does not run, but it still gets parsed and hoisted.
• To avoid bugs or unexpected behavior, never declare multiple functions with the same name in the same scope.
• If you need to override a function conditionally, consider using function expressions (const or let with arrow or anonymous functions) instead.

---

💬 Final Thought

JavaScript’s hoisting behavior is powerful but can be a source of subtle bugs, especially when it comes to duplicate function names and unreachable code. Always write with clarity in mind:

• Use unique function names.
• Avoid redefining functions in the same scope.
• Understand how JavaScript parses and hoists your code before it runs.

By understanding these nuances, you’ll write more predictable and robust JavaScript.

https://jscodesimplified.com/blogs/how-to-find-the-missing-number-in-an-array-a-step-by-step-guide/