¿Por qué usar `const foo = () => {}` en lugar de `function foo () {}`

Por ejemplo, en este video de Redux , el instructor siempre usa sintaxis como

const counter = (state=0, action) => {
   ... function body here
}

donde simplemente usaría el "tradicional"

function counter(state=0, action) {
   ... function body here
}

Que en realidad es más corto y, en mi opinión, más claro. Es más fácil escanear el borde izquierdo bastante uniforme y estructurado de la página para la palabra "función" que escanear el borde derecho irregular para un pequeño "=>".

Aparte de this, y tratando de ser objetivo, no de opinión, ¿hay alguna diferencia útil o ventaja en la sintaxis novedosa?

Las declaraciones de función (funciones nombradas, se muestra la segunda sintaxis) se elevan a la parte superior del alcance léxico completo, incluso aquellos detrás de bloques arbitrarios y de control, como las ifdeclaraciones. El uso de const(like let) para declarar una variable le da un alcance de bloque, detiene la elevación completa (elevación a un mero bloque) y garantiza que no se pueda volver a declarar.

Cuando se concatenan scripts juntos, o algunos usan otras herramientas de creación de paquetes, el levantamiento de funciones puede romper scripts conflictivos de formas que son difíciles de depurar ya que falla en silencio. Una nueva declaración constarrojará una excepción antes de que el programa pueda ejecutarse, por lo que es mucho más fácil de depurar.

He aquí por qué debería usar function:

1. La señalización es clara y concisa. Esto es mucho más beneficioso que cualquiera de las inquietudes de elevación de casos extremos que se enumeran en la otra respuesta.

2. En realidad, desea izar dentro de los módulos porque, como puede ver en el siguiente código, la constdeclaración de tryDoTheThingfalla en silencio y no se detectará hasta que intente llamarla.

3. La mayoría de los juniors con los que entro en contacto comienzan a usar constpara declarar cada función porque es una moda en este momento, como usar espacios sobre pestañas o hacer todo functional!!!porque "OOP es malo". No hagas eso. No quieres ser ese tipo que sigue las modas sin comprender completamente las implicaciones.

a través de https://gist.github.com/stephenjfox/fec4c72c7f6ae254f31407295dc72074

/*
This shows that, because of block-scoping, const function references must be
invoked in-order or else things will fail silently.
const's are added the name space serially (in the order in which they appear)
and much of the body isn't declared when we first try to invoke or functions
*/


const tryDoTheThing = () => {
  console.log(`This is me trying to be awesome ${getAwesome()}`)
}


// "getAwesome is not defined", because it is referenced too early
tryDoTheThing() // comment to see the rest work


const getAwesome = () => (+((Math.random() * 10000).toString().split('.')[0]))


const doTheThing = () => {
  console.log(`This is awesome! ${getAwesome()}`)
}

doTheThing() // prints

vs

/*
Function declarations are given two passes, where the first lifts them to
the top of the namespace, allowing "out of order" usage
*/

doTheThing();


function doTheThing() {
  console.log(`This is awesome number ${getAwesome()}`)
}

function getAwesome() {
  return (+((Math.random() * 10000).toString().split('.')[0]))
}