Ya hablamos de Debounce y Throttle en otros threads. Ambos son funciones que son parte de #lodash.

Ocurre que curry también está en lodash. Es una función poderosa para frontend y de functional programming!

Este es un tema #Javascript avanzado! 🤓

Qué es curry? Un ⚡️#thread
Antes que nada, tenemos que saber que curry es un concepto de functional programming (uno de mis temas favoritos!)

Imagina que tienes una función suma.

Suma recibe 3 argumentos y regresa la suma de ellos.
Es un caso super común! Pero qué tal si queremos tener la opción de enviarle los argumentos 1 a 1, en diferentes tiempos, y que se ejecute "mágicamente" hasta que tenga todos?

Esto es el concepto de curry, y en este caso es una "curried function"
En otros lenguajes de programación, las funciones pueden recibir argumentos en diferentes cantidades y ejecutarse hasta tenerlas todas.

En #javascript, no tenemos esa cualidad, y tenemos que hacerlo manualmente.

Como sería la función anterior en versión curry?
Ah! Solamente separamos los argumentos. Y cada que recibimos uno, regresamos una función que espera el siguiente argumento.

Cuando todos los argumentos son recibidos, finalmente la función se ejecutará.

Pero para que sirve este concepto en la vida real?
Curry es muy útil para "precargar" funciones, y crear funciones nuevas que tengan un valor inicial.

Nos ayuda a evitar duplicar datos y a crear abstracciones!

Es una función extremadamente poderosa del mundo de functional programming.
Ahora bien, no siempre vamos a tener la oportunidad de separar una función manualmente. Qué tal si ya está siendo usada por otros ingenieros del equipo?

La adaptación es una gran cualidad!

Y por ello es que #lodash creo una función para eso!

lodash.com/docs/#curry
Lo mejor de usar estas herramientas no es instalarlas, sino saber que hacen y porque.

Es hora de crear nuestro propio curry 🍛

Y lo más cool, vamos a tomar algunos conceptos interesantes de #javascript en el camino.
Empecemos!

Curry recibe una función (fn). Y necesitamos una forma de saber cuantos argumentos va a recibir esa función!

Sabías que las funciones tienen una propiedad "length", que nos dice este dato? Justo lo que necesitamos.
La variable args nos va ayudar a detectar los argumentos que estamos recibiendo.

Recordemos la parte nuclear de curry: si aún no tenemos todos los argumentos, tenemos que regresar una función que esta esperando los argumentos faltantes.
Cada que nos lleguen argumentos, los guardamos en un array. Si el array es del mismo tamaño que los argumentos de la función que nos mandaron, significa que estamos listos para ejecutar la función!

Sino, podemos hacer una recursión y regresar esta función para seguir esperando.
Y ahora curry nos puede ayudar a transformar cualquier función "ordinaria" en una que reciba los argumentos en diferentes formas!

Curry nos da una flexibilidad increíble para manipular nuestras funciones.
Y una pequeña aclaración! El concepto de curry es "una función que recibe argumentos uno por uno"

Existe otro concepto llamado "partial application" (aplicación parcial), que es "una función que recibe argumentos en diferentes cantidades hasta tener las que necesita"
Sin embargo, lodash implementa ambos conceptos en su función curry. Y por ello creamos en este #thread esa solución que involucra ambos conceptos.

Curry toca ideas de recursión y propiedades de las funciones para control de argumentos.
Nos vemos pronto en otro ⚡️ #thread de "conociendo los algoritmos de tu librería favorita"!

• • •

Missing some Tweet in this thread? You can try to force a refresh
 

Keep Current with Charlie Charlie ⚡️

Charlie Charlie ⚡️ Profile picture

Stay in touch and get notified when new unrolls are available from this author!

Read all threads

This Thread may be Removed Anytime!

PDF

Twitter may remove this content at anytime! Save it as PDF for later use!

Try unrolling a thread yourself!

how to unroll video
  1. Follow @ThreadReaderApp to mention us!

  2. From a Twitter thread mention us with a keyword "unroll"
@threadreaderapp unroll

Practice here first or read more on our help page!

More from @charliesbot

16 Feb
Ayer estaba hablando con un amigo que esta haciendo entrevistas en Silicon Valley, y me comentó que le pidieron programar un #throttle.

Este concepto es común que salga en la entrevista especializada de #frontend / #javascript.

Qué es #throttle? Un ⚡️ #Thread

[1/x]
La semana pasada hablamos de #debounce. #throttle es una función hermana de esta.

Throttle es una función que recibe 2 args: la función a ejecutar y un tiempo de bloqueo.

Cuando la función se ejecuta, el tiempo comienza a correr y bloquea cualquier otra ejecución.
Veamos el problema!

Tenemos una función que imprime texto en la consola.

El entrevistador solamente dirá: "ok, programa un throttle"

Si no sabes que es un throttle, te lo explicará. Pero son puntos menos, cuidado! 🚨

Throttle y debounce son tools básicas para todo frontend.
Read 10 tweets
15 Feb
Un breve spoiler del capítulo de hoy. Es uno de mis favoritos!

- José y yo tuvimos un path muy parecido. Yo apliqué a cerca de 20 empresas, de las cuales hice 12 entrevistas, todo en 3 semanas.

[1/x]
En este episodio platicamos la realidad de nuestro camino. Recibimos muchos mensajes donde nos piden el método que nos hizo lograr nuestras ofertas.

La verdad es que no hay método infalible. Lo que hicimos fue aplicar a todas las empresas que nos gustaban.
Nos preparamos con los algoritmos y estructuras de datos bajo el brazo. Pero las entrevistas son 70% preparación, 30% suerte.

La única forma de lograr entrar a todas estas empresas grandes es aplicando. El miedo siempre está ahí y no se va a ir por más que nos preparemos.
Read 4 tweets
11 Feb
Un feature #Javascript en stage 2 (que llegará pronto a una futura versión de #ECMAScript!

Finalmente vamos a tener estructuras de datos inmutables!: tuples y records ❤️

Un record es un objeto inmutable, y empiezan con "#"

Al tener inmutabilidad, podemos comparar 2 records!
Y una tuple es un array inmutable. Se declaran igual que un array, empezando con un "#".

También podemos comparar dos tuples sin pasos extras.
En Javascript no podiamos comparar 2 listas o 2 objetos de forma sencilla, porque al hacerlo se comparaba la referencia, no los valores.

Algunas esct. de datos inmutables tienen algoritmos para generar un id dependiendo su valor. Al comparar 2 estructuras, se comparan los ids.
Read 4 tweets
11 Feb
Un ⚡️lightning #thread de mis libros favoritos para Front End 🧵#javascript #CSS

Varios de estos recursos los sigo leyendo cada cierto tiempo, y son excelentes para prepararse en la entrevista especializada de Front End de las empresas grandes en Silicon Valley / #FAANG

[1/x]
Eloquent Javascript: mi biblia de JS enfocado al browser. Desde APIs del DOM hasta técnicas para mejorar el performance de las aplicaciones web.

Si tuvieras que elegir un libro de esta lista, que sea este.
Marca un antes y después como developer.

eloquentjavascript.net
#CSS Secrets: Cuando empecé mi carrera como front end, odiaba CSS.

Este libro me abrió la mente para descubrir que no lo odiaba, sino que no lo entendía. Y va mucho más allá: no solo ser técnico, pero creativo al crear una UI.

amazon.com/CSS-Secrets-So…
Read 7 tweets
9 Feb
En lo que tengo mi break del segundo día de on boarding en #Google, les dejo uno de mis tools favoritos para codear: hablemos de terminales.
lightning #thread ⚡️🧵

Si estás usando Mac/Linux: Kitty.

Porque lo prefiero sobre Alacritty / iTerm? [1/x]

sw.kovidgoyal.net/kitty/
Kitty, iTerm y Alacritty usan el GPU para el render. En otras palabras, son rapidísimos.

La ventaja de Kitty es el único que soporta ligatures (el efecto de combinar varios caracteres en uno solo.

Para mi que vivo en la terminal, la velocidad y estos detalles son especiales.
Si estás en Windows: Windows Terminal.

Es la mejor terminal que he usado, por mucho! Excelente trabajo de Microsoft (a parte de VS Code)

También soporta GPU y ligatures.

github.com/microsoft/term…
Read 6 tweets
6 Feb
#Thread 🧵Necesitas conocimientos de algoritmos / Big O para la entrevista de #FrontEnd en #Google o #Facebook?

R: Sí!

Este es un ejemplo de que pueden preguntar en la entrevista especializada de FE, donde mostrarás el dominio de performance y #Javascript/#CSS

👇🏼 [1/x]
Este es el escenario: tienes una lista de checkboxes. Puedes tener n checkboxes (mucho ojo aquí! 👁).

Primer challenge: necesitamos una forma eficiente de agregar un evento input a todos los checkboxes.

Antes de avanzar al siguiente tweet, qué forma se te ocurre?
Mmm, una forma que se me ocurre es simplemente tomar todos los checkboxes del DOM y agregarles un listener.

Funciona? Sí.
Es eficiente: absolutamente no.

n checkboxes significan n eventos. Big O(n) -> lineal.

#Javascript tiene algo que nos puede ayudar a mejorar esto?
Read 12 tweets

Did Thread Reader help you today?

Support us! We are indie developers!


This site is made by just two indie developers on a laptop doing marketing, support and development! Read more about the story.

Become a Premium Member ($3/month or $30/year) and get exclusive features!

Become Premium

Too expensive? Make a small donation by buying us coffee ($5) or help with server cost ($10)

Donate via Paypal Become our Patreon

Thank you for your support!

Follow Us on Twitter!