Hola!

Para comprender bien la sintaxis primero debes entender qué son las funciones de tipo flecha o arrow functions:

Una función normal en JavaScript suele escribirse así:

function addNumbers(a, b) {
    return a + b;
}

Mientras que una arrow function se puede escribir así:

const addNumbers = (a, b) => {
    return a + b;
}

Hay un par de cosas interesantes que mencionar respecto a estas, aunque no entraré en detalle:

1. Se llaman "de tipo flecha" por usar el símbolo =>
2. Se asignan a variables, es decir que se declaran con var, let o const, aunque también pueden usarse sin asignarse a una variable, que es como se utiliza en el ejemplo que sacaste de mdn.
3. Se pueden escribir abreviadas si la operación es simple. Por ejemplo, la arrow function de antes se puede reescribir así:

const addNumbers = (a, b) => a + b;

Como puedes ver, es una forma más simple y concisa de escribir la función, donde prescindimos de las llaves y la keyword return. Esto solo se puede lograr si la función devuelve un valor sin procesarlo ni realizar otras operaciones. Por ejemplo, esta otra función no se podría simplificar de la misma manera:

const addNumbersAndLogResult = (a, b) => {
    const result = a + b;
    console.log(result);
    return result;
}

En este caso, la función primero guarda el resultado en una constante para logearla por consola y luego la retorna. No podemos simplificar esta función a una sola línea como la anterior porque antes del return tenemos la declaración y luego un console.log().

Ahora finalmente llegamos al método reduce. Este método itera (como si fuera un for) los elementos de un array, y les aplica la operación que tú quieras (debes pasársela por argumento como una función) para reducir el array a un solo valor. En este caso, queremos que al array de números lo vaya iterando para que al número actual le sume el anterior y así sucesivamente hasta tener un solo número: la suma de todos los números del array.

Descompongamos su uso para entenderlo mejor:

• Tenemos nuestro array:

let numList = [4, 78, 784, 84, 489, 84];

• Le aplicamos el método reduce, el cual recibe por parámetro una función que no hemos hecho todavía:

numList.reduce();

• Voy a crear la función para pasársela como argumento al método reduce:

function addNumbers(a, b) {
    return a + b;
}

• Ya que tenemos la función declarada, podemos pasársela como argumento al método reduce:

numList.reduce(addNumbers);

• El segundo argumento del método reduce debe ser el valor inicial con el que empezaremos la operación. Ya que nuestro primer número no tiene un número anterior con el que sumarse, le vamos a pasar un 0:

numList.reduce(addNumbers, 0);

• La operación ya está lista, numList.reduce(addNumbers, 0) devuelve el resultado de la suma de todos los números del array. Solo falta asignarla a una variable:

let average1 = numList.reduce(addNumbers, 0);

• Ahora que el resultado ya está asignado a la variable, falta dividirlo por la cantidad total de números para calcular el promedio. Para ello utilizamos la utilidad length, que devuelve la cantidad de elementos de un array:

let average1 = numList.reduce(addNumbers, 0) / numList.length;

• Con esto ya tenemos un reduce completamente funcional. Así queda el código completo (aproveché de agregar el console.log):

const numList = [4, 78, 784, 84, 489, 84];

function addNumbers(a, b) {
    return a + b;
}

let average1 = numList.reduce(addNumbers, 0) / numList.length;

console.log(average1);

• Si quieres dejar un código más limpio puedes cambiar la función addNumbers para que sea una arrow function:

let numList = [4, 78, 784, 84, 489, 84];

const addNumbers = (a, b) => a + b

let average1 = numList.reduce(addNumbers, 0) / numList.length;

console.log(average1);

• Por último, estamos guardando la función en la constante addNumbers, pero no es necesario. Podemos pasar el contenido de la función directamente como argumento del método reduce, ahorrándonos la declaración de la función y dejando el código idéntico al ejemplo de mdn:

let numList = [4, 78, 784, 84, 489, 84];

let average1 = numList.reduce((a, b) => a + b, 0) / numList.length;

console.log(average1);

Con esto ya puedes entender cómo se llega a esa sintaxis. Además del reduce, hay muchos otros métodos de array en JavaScript, y la mayoría puede recibir funciones de este tipo para realizar lo que necesites. El método reduce no solo puede sumar números, también puede realizar otras operaciones matemáticas o concatenar textos, entre otras cosas.

Te recomiendo seguir leyendo sobre arrow functions ya que tienen otras diferencias respecto a las funciones normales que vale la pena conocer. Aquí hay un buen artículo.

Saludos!

Brahian Ignacio Araya Andrade, Muy buena explicación, muchas gracias.

Excelente, Brahian. Muchísimas gracias!