Master Guide 

  • https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Functions

If you have enough time, then read from the above master reference, else, read below .

Javascript Function

  • Defining a function does not execute it.
  • Defining the function simply names the function and specifies what to do when the function is called.
  • Calling the function actually performs the specified actions with the indicated parameters.
  • For example, if you define the function square, you could call it as follows:
square(5);
  1. Function declaration:

function square(number) {
  return number * number;
}

 

2. Functions created using function expression, also called anonymous functions

var square = function(number) { return number * number; };
var x = square(4); // x gets the value 16

Usually we don’t give name to a function expression, but you can give name.

However, a name can be provided with a function expression and can be used inside the function to refer to itself, or in a debugger to identify the function in stack traces:

var factorial = function fac(n) { return n < 2 ? 1 : n * fac(n - 1); };

console.log(factorial(3));

 

3. A function can call itself.

For example, here is a function that computes factorials recursively:

function factorial(n) {
  if ((n === 0) || (n === 1))
    return 1;
  else
    return (n * factorial(n - 1));
}

 

4. Function hoisting

only works with function declaration and not with function expression

Functions must be in scope when they are called, but the function declaration can be hoisted (appear below the call in the code), as in this example:

console.log(square(5));
/* ... */
function square(n) { return n * n; }

The scope of a function is the function in which it is declared, or the entire program if it is declared at the top level.

Below function expression is not hoisted

console.log(square); // square is hoisted with an initial value undefined.
console.log(square(5)); // TypeError: square is not a function
var square = function(n) { 
  return n * n; 
}

 

Using the arguments object and understanding arrays passed to function

https://stackoverflow.com/questions/48597301/how-is-this-function-passing-considered-as-separator-and-arguments

Just one random stack example – 

The stack-like behavior can be seen in the following example:

function foo(i) {
  if (i < 0)
    return;
  console.log('begin: ' + i);
  foo(i - 1);
  console.log('end: ' + i);
}
foo(3);

// Output:

// begin: 3
// begin: 2
// begin: 1
// begin: 0
// end: 0
// end: 1
// end: 2
// end: 3

Next -> Function scope & closures

Function scope

  • A function defined in the global scope can access all variables defined in the global scope.
  • A function defined inside another function can also access all variables defined in its parent function and any other variable to which the parent function has access.
  • Variables defined inside a function cannot be accessed from anywhere outside the function, because the variable is defined only in the scope of the function.

Nested(inner) functions and closures

  • You can nest a function within a function
  • The nested (inner) function is private to its containing (outer) function. It also forms a closure.
  • Since a nested function is a closure, this means that a nested function can “inherit” the arguments and variables of its containing function. In other words, the inner function contains the scope of the outer function.

notes:
inner function has scope of outer function, but outer function doesn’t have scope of inner function.

To summarize:
  • The inner function can be accessed only from statements in the outer function.
    The nested (inner) function is private to its containing (outer) function. It also forms a closure
  • The inner function forms a closure: The inner function can use the arguments and variables of the outer function, while the outer function cannot use the arguments and variables of the inner function.

Nested Function examples: –

The following example shows nested functions:

function addSquares(a, b) {
  function square(x) {
    return x * x;
  }
  return square(a) + square(b);
}
a = addSquares(2, 3); // returns 13
b = addSquares(3, 4); // returns 25
c = addSquares(4, 5); // returns 41

Since the inner function forms a closure, you can call the outer function and specify arguments for both the outer and inner function:

function outside(x) {
  function inside(y) {
    return x + y;
  }
  return inside;
}
fn_inside = outside(3); // Think of it like: 
           //give me a function that adds 3 to whatever you give it

result = fn_inside(5); // returns 8

result1 = outside(3)(5); // returns 8

 

How-the-values-gets-passed-in-this-nested-function-example/

https://stackoverflow.com/questions/48601643/how-the-values-gets-passed-in-this-nested-function-example/