¿Qué significa cuando una variable es igual a una función? [duplicar]

Nota : Por favor vea la actualización al final de la respuesta, las declaraciones dentro de bloques se volvieron válidas (pero bastante complicadas si no está usando el modo estricto).

Aquí hay una razón:

var whatever;

if (some_condition) {
    whatever = function() {
        // Do something
    };
}
else {
    whatever = function() {
        // Do something else
    };
}
whatever();

Es posible que vea código como ese en la inicialización de una biblioteca que tiene que manejar las diferencias de implementación (como las diferencias entre navegadores web, a'la IE attachEvent vs.el estándar addEventListener). No se puede hacer el equivalente con una función declaración:

if (some_condition) {
    function whatever() {    // <=== DON'T DO THIS
        // Do something
    }
}
else {
    function whatever() {    // <=== IT'S INVALID
        // Do something else
    }
}
whatever();

...no están especificados dentro de las estructuras de control, por lo que los motores JavaScript pueden hacer lo que quieran, y diferentes motores han hecho cosas diferentes. (Edit: De nuevo, vea la nota a continuación, se especifican ahora.)

Por Separado, hay una gran diferencia entre

var whatever = function() {
    // ...
};

Y

function whatever() {
    // ...
}

La primera es una expresión de función , y se evalúa cuando el código alcanza ese punto en la ejecución paso a paso de la contexto (por ejemplo, la función en la que está, o la ejecución paso a paso del código global). También resulta en una función anónima (la variable que se refiere a ella tiene un nombre, pero la función no, lo que tiene implicaciones para ayudar a sus herramientas a ayudarlo ).

La segunda es una declaración de función , y se evalúa al ingresar al contexto, antes de que se ejecute cualquier código paso a paso. (Algunos llaman a esto " ho " porque algo más abajo en la fuente ocurre antes que algo más alto en la fuente.) La función también recibe un nombre propio.

Así que considere:

function foo() {
    doSomething();
    doSomethingElse();
    console.log("typeof bar = " + typeof bar); // Logs "function"

    function bar() {
    }
}

Considerando que

function foo() {
    doSomething();
    doSomethingElse();
    console.log("typeof bar = " + typeof bar); // Logs "undefined"

    var bar = function() {
    };
}

En el primer ejemplo, con la declaración, la declaración se procesa antes de el doSomething y se ejecuta otro código paso a paso. En el segundo ejemplo, debido a que es una expresión , se ejecuta como parte del código paso a paso y por lo tanto la función no se define arriba (la variable se define arriba arriba, porque var también está "izada" ).

Y terminando: Por el momento, no se puede hacer esto en general cosas web del lado del cliente:

var bar = function foo() { // <=== Don't do this in client-side code for now
    // ...
};

Usted deberíaser capaz de hacer eso, se llama expresión de función llamada y es una expresión de función que le da a la función un nombre propio. Pero varios motores JavaScript en varias ocasiones se han equivocado, y IE continuó equivocándose hasta muy recientemente.

Actualización para ES2015 +

A partir de ES2015 (también conocido como "ES6"), las declaraciones de funciones dentro de los bloques se agregaron a la especificación.

Modo estricto

En modo estricto, el comportamiento recién especificado es simple y fácil de entender: se circunscriben al bloque en el que ocurren, y se elevan a la parte superior del mismo.

Así que esto:

"use strict";
if (Math.random() < 0.5) {
  foo();
  function foo() {
    console.log("low");
  }
} else {
  foo();
  function foo() {
    console.log("high");
  }
}
console.log(typeof foo); // undefined

(Observe cómo las llamadas a las funciones son por encima de el funciones dentro de los bloques.)

Essentially es esencialmente equivalente a esto:

"use strict";
if (Math.random() < 0.5) {
  let foo = function() {
    console.log("low");
  };
  foo();
} else {
  let foo = function() {
    console.log("high");
  };
  foo();
}
console.log(typeof foo); // undefined

Modo suelto

El comportamiento de modo suelto es mucho más complejo y, además, en teoría, varía entre los motores JavaScript en los navegadores web y los motores JavaScript no en los navegadores web. No voy a entrar aquí. No lo hagas. Si insiste en declaraciones de funciones dentro de bloques, utilice el modo estricto, donde tienen sentido y son consistentes a lo largo ambiente.