Solución Codewars - Funciones que actúan entre sí anidadas [cerradas]

Estaba buscando una solución para un rompecabezas en codewars y no entiendo por qué funciona. ¿Cómo está funcionando minus ()?

function makeNum(num, func) {
    if (func === undefined) {
        return num;
    } else {
        return func(num);
    }
}

function three(func) {
    return makeNum(3, func);
}

function eight(func) {
    return makeNum(8, func);
}

function minus(right) {
    return function(left) {
        return left - right;
    };
}

console.log(eight(minus(three()))); // will log out 5

Es un poco complicado :-)

console.log(eight(minus(three()))); se ejecuta desde adentro hacia afuera, así que vamos a seguirlo:

• three()- llama makeNum(3, undefined)y devuelve lo que devuelve. makeNum(3, undefined)devuelve 3, entonces ese es el valor de retorno.
• minus(3)- llamadas minus, pasando 3como right. minusdevuelve una nueva función que se cierra right.
• eight(...)- llama a makeNum(8, fnFromMinus)dónde fnFromMinusestá la función que devolvió minus(3). makeNum(8, fnFromMinus)hace fnFromMinus, pasando 8como left. fnFromMinusdevuelve el resultado de left - right(recuerde que rightes 3, fnFromMinuscerrado sobre él).

Como 8 - 3es 5, el resultado final es 5, que console.logregresa.

Aquí hay una versión instrumentada:

let indent = 0;
function show(label) {
    console.log(" ".repeat(indent * 4) + label);
}
function fname(fn) {
    return fn ? fn.name : "undefined";
}

function makeNum(num, func) {
    const descr = `makeNum(${num}, ${fname(func)})`;
    show(descr);
    ++indent;
    if (func === undefined) {
        --indent;
        show(`${descr} returns ${num}`);
        return num;
    } else {
        const rv = func(num);
        --indent;
        show(`${descr} returns ${num}`);
        return rv;
    }
}

function three(func) {
    const descr = `three(${fname(func)})`;
    console.log(descr);
    ++indent;
    const rv = makeNum(3, func);
    --indent;
    show(descr + ` returns ${rv}`);
    return rv;
}

function eight(func) {
    const descr = `eight(${fname(func)})`;
    console.log(descr);
    ++indent;
    const rv = makeNum(8, func);
    --indent;
    show(descr + ` returns ${rv}`);
    return rv;
}

function minus(right) {
    const fn = function fnFromMinus(left) {
        show(`${fname(fn)} returns ${left} - ${right} = ${left - right}`);
        return left - right;
    };
    try {
        // For browsers that don't do `name` properly
        fn.name = "fnFromMinus";
    } catch (e) { }
    show(`minus(${right}) returns ${fname(fn)}`);
    return fn;
}

console.log(eight(minus(three()))); // will log out 5

.as-console-wrapper {
    max-height: 100% !important;£
}

En realidad, no es tan complicado si lo superas paso a paso. Trabajemos de adentro hacia afuera. Vocación:

three()

sin un parámetro significa que está pasando un valor indefinido como func. Entonces es lo mismo que decir:

makeNum(3, undefined)

Cuando makeNum ve que func no está definido, devuelve num, que es 3.

Así que hemos reducido esto a:

eight(minus(3))

Ahora veamos como

minus(3)

evalúa minus ve que el parámetro que ha proporcionado es 3, por lo que devuelve una función que puede aceptar un parámetro "izquierdo" y restar los 3 que ya le hemos proporcionado. NO se ejecuta. Simplemente se queda allí, esperando que lo llamen con un parámetro "izquierdo" para que pueda restarle 3.

Así que hemos reducido esto a:

eight(function(left){
    return left - 3;
})

Ahora veamos cómo se evalúa esto. ocho se llama con el parámetro func siendo esta función:

function(left){
    return left - 3;
}

Luego pasa 8 y esta función a makeNum cuando dice:

makeNum(8, func)

makeNum luego ve que se ha proporcionado func (y por lo tanto no está indefinido) y devuelve func (num) a la función ocho, que es lo mismo que pasar:

8 - 3

volviendo a la octava función. La función ocho recibe ese valor y luego lo devuelve. Así que hemos reducido esto a:

5

que se registra en la consola.

minusdevuelve una nueva función para cada invocación con los parámetros pasados ​​que se capturan. Cuando se llama a la función devuelta, puede hacer referencia a los parámetros pasados ​​cuando se llama, además de cualquier parámetro que se le pase. Esta es una forma de curry funciones en JavaScript.

Este código es un ejemplo de funciones de orden superior en lenguajes de programación funcionales como js. Las funciones de Javascript se tratan como objetos y también se pueden pasar y devolver.

Una función de orden superior es una función que recibe una función como argumento o devuelve la función como salida.

minusestá devolviendo una función anónima ( una función sin nombre definido ) básicamente como:

function(left) {
        return left - 3; //right = 3
    };

Esta función cuando se pasa a eightse llama como func(8)que luego da resultado como5

Otra forma de verlo: puede volver a escribir esta línea:

console.log(eight(minus(three())));

Como:

const threeResult = three(); // = 3
const minusResult = minus(threeResult); // = a function that subtracts 3
const eightResult = eights(minusResult); // = 5