Matices de las Expresiones de Función en JavaScript

El nombre Expresión de Función (Function Expression) no se da por nada. Realmente significa eso: que tales funciones son parte de alguna expresión.

Por ejemplo, podemos concatenar una cadena y una función anónima:

javascriptlet str = 'str' + function() {return 3;};
console.log(str); // mostrará 'strfunction() {return 3;}'

¿Por qué vemos un resultado tan extraño, y no el número 3? Porque el segundo sumando - no es el resultado de la función, sino su código fuente (después de todo, no llamamos a esa función, simplemente la escribimos).

Es decir, el nombre expresión de función denota que dicha función participa en alguna expresión.

La asignación a una variable también es una expresión:

javascriptlet func = function() {
  console.log('!');
};

También se puede, por ejemplo, pasar una función como parámetro a console.log y este mostrará su código fuente en la consola - esto también se considerará una expresión:

javascriptconsole.log(function() {return 3;});

Por qué esto es importante: porque la diferencia entre Function Declaration y Function Expression no está en absoluto en que la primera función se crea con un nombre, y la segunda inicialmente no tiene nombre. Eso no es así.

Ejemplo. Aquí tenemos una función sin nombre, pero que no participa en ninguna expresión (es decir, no se realiza ninguna acción con ella, hablando en términos simples):

javascript/*
  Esta función será una Function Declaration,
  pero con un error sintáctico:
*/
function() {
  console.log('!');
}

¡Dicho código directamente dará un error! ¿Por qué?: ya que la función no participa en ninguna expresión, el navegador la considera una Function Declaration, pero no encuentra su nombre y da un error.

Para que el error desaparezca, necesitamos hacer que la función forme parte de alguna expresión. Por ejemplo, escribimos la operación + delante de ella:

javascript+function() { // dicho código es correcto
  console.log('!');
};

Cómo funciona esto: la operación + por sí misma no hace nada, es lo mismo que escribir en lugar del número 3 el número +3 - es permitido, pero no cambia nada.

Pero en el caso de la función - sí cambia. Ahora nuestra función ya no está simplemente escrita, sino que participa en una expresión. Por lo tanto, ahora no habrá error. Tampoco habrá resultado de la ejecución de la función, ya que simplemente la escribimos, pero no la llamamos.

En lugar de + se puede escribir cualquier cosa. Por ejemplo:

javascript-function() { // dicho código es correcto
  console.log('!');
};

!function() { // dicho código es correcto
  console.log('!');
};

También se puede poner nuestra función entre paréntesis, en este caso también se convertirá en una expresión de función:

javascript(function() { // dicho código es correcto
  console.log('!');
});

javascriptfunction func() {
  console.log('!');
}

javascriptlet func = function() {
  console.log('!');
}

javascript+function() {
  console.log('!');
}

javascript!function func() {
  console.log('!');
}

javascript-function func() {
  console.log('!');
}

javascript1 + function func() {
  console.log('!');
}

javascript(function func() {
  console.log('!');
})

javascriptconsole.log(
  function() {
    console.log('!');
  }
);