yo tenia este codigo:
import React, { Component } from 'react'; import { View, Button } from 'react-native'; export default function App() { const myMethod = (name) => { console.log(`Hello ${name}!`); }; return ( <View> <Button onPress={() => myMethod("Victor")}> Press me! </Button> </View> ); }Luego, decidí refactorizarlo usando funciones curry. Como esto:
import React, { Component } from 'react'; import { View, Button } from 'react-native'; export default function App() { /** * @param {string} name - The name. * @returns {Function} Curried function. */ const myMethod = (name) => { return () => { console.log(`Hello ${name}!`); } }; return ( <View> <Button onPress={myMethod("Victor")}> Press me! </Button> </View> ); } Como puede ver, la forma en que invoco el método ha cambiado, ya que estoy devolviendo una función en lugar de void en myMethod . Eso es genial, funciona... cada vez que se presiona el botón, se invoca mi método.
Mira este bocadillo: https://snack.expo.dev/Rx3iBVT_W
Ahora, estoy tratando de refactorizar el código refactorizado usando curry de Lodash .
Esto es lo que he probado:
import React, { Component } from 'react'; import { View, Button } from 'react-native'; import { curry } from 'lodash'; export default function App() { const myMethod = curry((name) => { console.log(`Hello ${name}!`); }); return ( <View> <Button onPress={myMethod("Victor")}> Press me! </Button> </View> ); }Pero por alguna razón, esto no está funcionando. El método no se ejecuta cada vez que se presiona el botón... En cambio, se invoca cuando se monta el componente.
¿Cómo puedo resolverlo?
Mira este bocadillo: https://snack.expo.dev/bna6cLkhp
Me temo que no entendiste bien el curry (que es fácil de hacer, y muchos lo han hecho, incluido yo mismo).
Luego, decidí refactorizarlo usando funciones curry. Como esto:
Ese código no curry una función. Simplemente crea un cierre sobre el parámetro de name . Eso se llama aplicación parcial .
El curry de Lodash hace curry en su lugar. La función que devuelve hará su trabajo tan pronto como se cumplan todos sus parámetros, tan pronto como le proporcione el nombre que necesita, en su caso. Entonces hace su trabajo cuando haces myMethod("Victor") , no más tarde:
const myMethod = _.curry((name) => { console.log(`Hello ${name}!`); }); myMethod("Victor"); <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script> Si desea que espere un segundo argumento, debe decirle a curry que su función requiere dos argumentos y luego proporcionarle dos argumentos (uno a la vez en este caso):
const myMethod = _.curry((name) => { console.log(`Hello ${name}!`); }, 2); // ^−−−−−−− tells `curry` this function needs two arguments, even // though the function itself says it only needs 1 console.log("Supplying the first argument"); const fn = myMethod("Victor"); console.log("Supplying the second argument"); fn({}); // <== Note the argument, we need to supply one <script src="https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.21/lodash.min.js"></script> Eso funciona porque le dijimos a curry que su función necesita tener dos argumentos, y myMethod("Victor") solo le da uno, por lo que devuelve otra función que hará su trabajo cuando le dé el otro argumento. onPress le dará un segundo argumento porque le pasa el objeto de evento.
Consulta la documentación del curry para ver más ejemplos.
Dicho esto, no usaría curry aquí. Realmente no estás currando, por lo que es un mal uso. Usaría su solución de aplicación parcial, si tuviera que incluir el nombre en la función.