Function Declarations Inside If/Else Statements

Function declarations inside if/else statements?

When this question was asked, ECMAScript 5 (ES5) was prevalent. In strict mode of ES5, function declarations cannot be nested inside of an if block as shown in the question. In non-strict mode, the results were unpredictable. Different browsers and engines implemented their own rules for how they would handle function declarations inside blocks.

As of 2018, many browsers support ECMAScript 2015 (ES2015) to the extent that function declarations are now allowed inside blocks. In an ES2015 environment, a function declaration inside of a block will be scoped inside that block. The code in the question will result in an undefined function error because the function a is only declared within the scope of if statements and therefore doesn't exist in the global scope.

If you need to conditionally define a function, then you should use function expressions.

Avoid using functions inside if condition - Javascript

Unless your function (within if condition) is asynchronous there is no problem.
The functions that you are using is synchronous - meaning your script will finish executing it and return a value first before going to next task - in this case it will work fine.
For asynchronous function (which is executed in parallel to the other lines of instructions), then the results from that function is not returned yet and your script will continue without the right value (returned value) from it - this will cause problem.

Is it correct to execute a function inside IF else statement?

There is no wrong in executing a function inside if conditional statement.

For such case you can use ternary operator

var i=-1; // Note var key word & initialized with some value
  isCheck() === false ? (i=0):(i=someOtherVal)

Hoisting of functions inside conditionals

(Ignoring the slightly dodgy behaviour that certain old browsers may have had:)

In Javascript, function statements are scoped within the containing function (or globally if there is no containing function), they're not scoped within an if or else or loop block. So you can't declare a function conditionally in that manner (it can be done another way; see below). And if you declare more than one function with the same name in the same scope the later one will overwrite the first one.

So what happens with your code is:

1. Both function statements are hoisted, but

2. They both have the same name so the first is overwritten by the second.

3. The variable, a is created but not yet assigned a value.

4. The foo() statement is executed, logging "b"

5. a is assigned the value true.

6. The if is executed. The condition is true, but neither the if nor else branches actually do anything because they don't contain statements other than the function declarations that were hoisted earlier.

If you want to create functions conditionally you have to declare a variable and then assign a function expression to it. And then you can not call the function until after that assignment:

var foo;
var a = true;

if(a)
    foo = function() { console.log("a"); };
else
    foo = function() { console.log("b"); };

foo();

---

Related Topics