El Arte de la Programación Funcional

¡Oh, Dios mío! ¡Estamos en tres dimensiones! Estoy realmente emocionada por ello. Los he extrañado a todos. Es genial verlos. Verlos. Verlos. Muy lejos. Muy lejos. Estoy realmente emocionada de ver a todos sintonizando virtualmente desde casa.

Mi nombre es Anjana Vakil. Estoy aquí para hablarles sobre React. Es broma. No. Estoy aquí para hablarles sobre programación funcional. Lo cual está algo relacionado con React, porque es el paradigma de programación detrás de la forma en que trabajamos con todo en un marco funcional como React. Así que quiero hablarles sobre programación funcional, porque creo que es un paradigma realmente hermoso. Una forma realmente hermosa de entender qué son los programas, de qué entidades están compuestos y cómo esas entidades se comportan e interactúan. En otras palabras, un paradigma de programación que creo que es bastante genial. Y no creo que sea la única.

Porque la programación funcional tiene algunas características realmente agradables. Así que, en primer lugar, los programas funcionales son realmente fáciles de predecir. Son muy predecibles. Lo que significa que son fáciles de probar para asegurarnos de que están haciendo las cosas correctas. Y son fáciles de depurar para asegurarnos de que cuando no están haciendo las cosas correctas, descubrimos por qué y lo arreglamos. Y es por eso que, como programadores, creo que la mayoría de nosotros deberíamos encontrar la programación funcional bastante fácil de amar. Aplaudan si tienen algo de amor por la programación funcional. Sí. Funciones. Funciones. ¡Whoo! Pero en realidad creo que la programación funcional también es bastante fácil de temer.

Aplaudan si tienen algo de miedo a la programación funcional. Sí, yo también. Yo también. Exactamente. Porque tiene esta reputación, que es desafortunada, pero probablemente bastante bien merecida de ser este mundo académico muy opaco y aterrador lleno de palabras extrañas, como términos de la teoría de categorías y cosas así, que necesitas un doctorado para entender. Así que es bastante fácil tener un poco de miedo. Creo que la programación funcional en realidad en sus principios básicos puede ser realmente simple de entender. Y así que me propongo como misión intentar hacer la programación funcional más accesible.

Puede que me conozcan por esta charla que di llamada Learning Functional Programming in JavaScript. Si no te has encontrado con la programación funcional antes o si conoces a alguien que no lo ha hecho y quiere hacerlo, revisa esa charla. Se adentra mucho más en cómo realmente funciona la programación funcional bajo el capó. Y para profundizar aún más, también puedes revisar un curso que tengo en Frontend Masters llamado Functional JavaScript First Steps. Esta charla no va a entrar realmente en los detalles de cómo hacemos programación funcional excepto en la medida en que respondamos a las preguntas de cómo hacemos programación funcional en el mundo real. Entonces, ¿qué es la programación funcional a un nivel alto? Bueno, es programación con funciones.

Eso es súper perspicaz. Mi charla ha terminado. Adiós. Está bien. Solo bromeaba. La programación funcional es programación con funciones, como probablemente saben. De hecho, es programación con un tipo especial de funciones llamadas funciones puras. Entonces, ¿qué es una función pura? Bueno, una función pura es una función que convierte la entrada en salida. Le das valores de entrada y devuelve un valor de salida. Y eso es literalmente todo lo que hace. Devuelve una salida basada en sus entradas. Así que tal vez le das un valor de ancho y un valor de alto como entradas y tal vez devuelve esa relación de aspecto dividiéndolos como su salida. Muy simple, muy predecible, porque eso significa que una función pura es totalmente determinista. Así que si le das las mismas entradas, siempre te dará la misma salida. Y eso es porque no involucra ningún tipo de estado.

Donde el estado son valores que cambian con el tiempo, esos no existen en el mundo de la programación funcional. Así que cada vez que llamas a una función con las mismas entradas, obtendrás la misma salida. Tan determinista, seguro, predecible, hace felices a los programadores.

Así que esto también significa que las funciones puras no pueden tener efectos secundarios. Así que un efecto secundario es cualquier cosa que la función pueda hacer que no sea devolver su valor de retorno. Así que eso significa que hay muchas cosas que normalmente estamos acostumbrados a hacer que no podemos hacer en el mundo funcional. No podemos, por ejemplo, registrar en la consola. Eso es un efecto secundario. Eso no está devolviendo un valor. No podemos tocar el DOM. Eso es un efecto secundario. Eso es hacer algo que no sea devolver un valor. Tampoco podemos ni siquiera mirar lo que hay en el DOM o mirar el estado del mundo fuera de nuestro programa. Por ejemplo, comprobando qué valor tiene un cierto elemento para un cierto atributo. Porque eso sería mirar algo que no son nuestras entradas, y eso significaría que eso podría cambiar, y podrías llamar a la función con las mismas entradas y aún así obtener un resultado diferente. No podemos tener eso.

Así que no registrar cosas, no tocar el DOM, ni siquiera mirar el DOM o cualquier otra cosa fuera de las entradas. Cada función tiene que solo mirar sus entradas y solo devolver su salida. Bien. Estamos todos de acuerdo, ¿verdad? Sí. Sí. Genial. Así que eso significa que no podemos hacer nada. ¿Qué podemos hacer? Si no podemos tocar nada, no podemos, como, afectar nada en el mundo, todo lo que podemos hacer es devolver valores. ¿Qué se supone que debemos hacer? Bueno, la programación funcional puede hacer lo que necesitemos que haga, pero tenemos que acostumbrarnos a algunas técnicas para relacionarnos con el mundo real y aún así mantenernos en nuestro mundo funcional puro y determinista aquí. Así que esto es lo que vamos a ver hoy es cómo funciona la programación funcional en el mundo real y no en los bonitos círculos académicos matemáticos donde existe en como este otro plano de realidad. Pero en nuestro mundo donde queremos dibujar cosas en pantallas, por ejemplo. Entonces, ¿qué tal si dibujamos algo de arte en la pantalla, sí? ¡Woo! Bien. Así que vamos a hacer algo de arte generativo y ver cómo eso nos ayuda a entender cómo la programación funcional se relaciona con el mundo real tratando de hacer cosas, porque hacer arte generativo creo que es un muy buen ejemplo de hacer algunas cosas que la programación funcional a menudo siente que no es realmente capaz de hacer o muy buena en ello. Así que el arte generativo generalmente necesita algún tipo de efectos secundarios.

Si estás tratando de hacer arte, tienes que dibujar algunos píxeles en la pantalla al menos, ¿verdad? Probablemente vas a necesitar algún elemento de repetición. Vas a querer tener motivos recurrentes en tu trabajo artístico. Podrías necesitar alguna representación de estado, porque tal vez quieras alterar diferentes partes de la imagen de diferentes maneras, cambiando valores, ¿verdad? Pero no tenemos estado, entonces ¿cómo hacemos eso? Y probablemente también querrás incluir algún elemento de variación que parezca orgánica, así que generalmente el arte generativo involucra algún aspecto de aleatoriedad.

¿Adivina qué es la aleatoriedad? Lo opuesto a determinista, ¿verdad? Entonces, ¿cómo lidiamos con todas estas cosas en un universo funcional? Esto es lo que vamos a ver hoy, y en el camino vamos a hacer algunas imágenes bonitas. ¡Yay! Muy bien, hagámoslo.

Entonces, efectos secundarios. ¿Cómo los maneja la programación funcional? Bueno, no lo hace. Lo que podemos hacer, sin embargo, cuando necesitamos hacer efectos secundarios, como, por ejemplo, dibujar algo en la pantalla, tocar el DOM, podemos tomar esos efectos secundarios y empujarlos hasta el borde más externo de nuestro programa. Así que podemos crear, como, puedes pensar en ello como una capa protectora alrededor de nuestro programa donde toda la parte desordenada de efectos secundarios imperativos puede vivir en ese borde más externo. Y luego dentro de eso, podemos mantener todos los internos del programa puros y funcionales, así que deterministas, seguros, predecibles, testeables, depurables.

Así que lo que queremos hacer es empujar todos los efectos secundarios desordenados hacia el borde exterior, la capa imperativa que envolverá un núcleo funcional puro. ¿Conmigo? Veamos cómo se ve eso en la vida real. Así que aquí hay un ejemplo de, tengo un pequeño SVG simple que estoy llamando arte. Veremos si eso se mantiene una vez que veamos qué arte dibujamos. Y lo que tengo es una función que no es una función pura. Así que la estoy llamando impure set SVG contents. Lo que eso va a hacer es hacer todas las cosas de efectos secundarios. Va a tomar mi elemento de arte del DOM. Va a establecer rápida y suciamente su HTML interno para básicamente hacer un efecto secundario aquí, para cambiar algo en el documento. Y eso básicamente va a ser nuestra capa imperativa exterior. Así que este no es un código funcional. Esto no es puro. Es impuro. Pero todo lo que sucede dentro de él, lo que podemos hacer es usar funciones puras para generar el arte que queremos colocar allí. Dentro de esa pequeña capa que está haciendo los efectos secundarios por nosotros. Así que lo que puedo hacer entonces es obtener una función pura, que puedo llamar get art, que tomará cualquier parámetro que necesite darle, y luego crear los contenidos de una manera pura y determinista que mis contenidos SVG impuros colocarán en la página de una manera imperativa no funcional. ¿Genial? Muy bien. Veo algunos asentimientos y algunas personas todavía despertándose después del café. Estoy contigo.

Así que hagamos algunos patrones, y tal vez esa sea una buena manera de llenar nuestros contenidos de nuestro pequeño programa de capa imperativa. Así que los patrones son divertidos para el arte generativo. Entonces, ¿cómo podemos hacer patrones donde usualmente los patrones involucran algún elemento de repetición? ¿Cómo hacemos repetición en el mundo funcional? Así que en el mundo funcional no tenemos estado. No tenemos valores que puedan cambiar con el tiempo, lo que significa que tampoco tenemos cosas como bucles for, ¿verdad? Porque un bucle for significa que tienes algún tipo de valor que vas a incrementar o cambiar en cada bucle que atraviesas. Así que en su lugar, lo que vamos a hacer es en lugar de esta forma imperativa de pensar sobre la repetición como una forma de iteración, en el mundo funcional vamos a pensar en la repetición como una forma de recursión. Así que la recursión va a ser el subparadigma que usamos para lograr la repetición en la programación funcional.

Probablemente no sea algo nuevo para la mayoría, pero es realmente interesante cómo se relacionan la iteración y la recursión, o al menos eso creo. Tengo otra charla donde entro en más detalle sobre cómo funcionan en JavaScript y cómo se relacionan entre sí. Si tienes curiosidad sobre la iteración versus la recursión, en realidad no son enemigos. Puedes ver mi charla recursión, iteración y JavaScript, una historia de amor, de JS Heroes 2018. Pero basta con decir que hoy solo nos centraremos en la recursión, así que ¿cómo funciona eso?

Intentemos hacer un pequeño patrón con estos tipos de diamantes o cuadrados cada vez más pequeños. Lo que podemos hacer es crear una función recursiva para dibujar este patrón. La llamaré get pattern, porque soy genial para nombrar. Y esto tomará un par de colores y luego un cierto ancho para determinar qué tan grande queremos que sea este patrón. Y como cualquier función recursiva, esta va a ser una buena función recursiva que no hará explotar mi computadora, porque tiene dos partes. Tiene un caso base donde no ocurre recursión alguna, donde, básicamente, si tengo un ancho lo suficientemente pequeño, simplemente devolveré un rectángulo de un cierto color, cualquiera que sea el primer color, y eso es todo. Habré terminado. Sin recursión. Sin embargo, si el ancho es mayor que eso, entonces haré una llamada recursiva en mi caso recursivo. No solo devolveré un rectángulo o un cuadrado, en este caso, de un cierto color, sino que también rotaré un poco y luego usaré mi mismo get pattern, con los colores intercambiados, para generar un patrón más pequeño rotado de la misma estructura con la dirección opuesta de colores. Y al llamarse recursivamente a sí misma y a sí misma y a sí misma, obtendremos este patrón repetitivo, alucinante dibujado. Recursión simple. ¿Estamos hasta aquí? ¿Estamos bien? Veo pulgares arriba. Excelente. Pulgares desde la transmisión en vivo. Excelente. Muy bien. Fabuloso.

Ahora, este fue un ejemplo bastante simple porque este patrón parece recursivo, ¿verdad? Parece ser recursivo. ¿Qué tal un patrón que realmente no tenga esa vibra? ¿Qué tal una cuadrícula realmente estándar? ¿Cómo dibujarías una cuadrícula estándar si no puedes usar un bucle for? Si no puedes usar iteración. Te dejaré reflexionar sobre eso mientras tomo un sorbo. ¿Cómo dibujarías esta cuadrícula recursivamente? Bien. No puedo escuchar nada de lo que estás diciendo, pero te aprecio. Así que veamos una forma en que podríamos hacer esto. Lo cual veremos, si fue lo que dijiste, puedes simplemente gritar sí. Así que lo que podemos hacer es comenzar con un caso base donde solo dibujamos una baldosa.

Solo una baldosa. No es mucho pedir. Y luego lo que podemos hacer es verificar. ¿Estamos tratando de dibujar más baldosas que esto? ¿Tenemos más columnas y filas para dibujar? Y si es así, entonces podemos tratarlas como cuadrículas más pequeñas y podemos dibujar cuadrículas recursivamente.

Por ejemplo, podemos dibujar una cuadrícula recursiva que vaya hacia la derecha. Eso dibuja el resto de la fila después de mi pequeña baldosa base. Y luego podríamos hacer otro caso recursivo donde dibujamos todas las columnas y filas debajo de mi primera fila.

Así que esto es lo que podría parecer en código. Sé que esto es mucho. Ten paciencia conmigo. Pero lo que tenemos es un caso base donde básicamente estamos determinando a partir del ancho y la altura que queremos y el número de columnas y filas que queremos, estamos determinando cuál debería ser el ancho y la altura de esta baldosa en particular. Y básicamente, estamos devolviendo eso. Y si no tenemos más columnas o filas para devolver además de solo una, entonces hemos terminado. Pero si tenemos más columnas, eso significa que necesitamos dibujar el resto de la fila. Así que vamos a llamar recursivamente a esta función, que he llamado getTiles, para obtener este pequeño patrón de baldosas. Vamos a llamar a getTiles para dibujar todo el resto de esta fila hacia la derecha. Básicamente dibujando otra área de baldosas que es solo de un ancho reducido y solo una fila. ¿Genial? Y luego lo que estamos haciendo es, si tenemos más filas debajo de eso para dibujar, estamos haciendo, nuevamente, otra llamada a getTiles con un número reducido de filas y todas las columnas, así que básicamente dibujando el resto completo del búho. ¿Genial? Muy bien.

Así que lo que tenemos entonces es que podemos usar nuestra función getTiles. Y lo que estamos haciendo es pasar una pequeña función makeTile. Esto también tiene una vibra muy funcional, ¿verdad? Pasar funciones por ahí. Porque entonces podemos cambiar lo que hace ese makeTile para dibujar cosas diferentes. Ahora mismo, estoy pasando una baldosa muy básica que solo dibuja un pequeño rectángulo naranja. Y esto es lo que obtenemos. Obtenemos nuestra bonita cuadrícula de 5 por 5, cuando llamamos a nuestro getTiles con nuestra función makeBasicTile. ¿Sí? Genial. Ahora intentemos hacer algo más interesante.

Muy bien. Así que para hacer algo más interesante que tener solo el mismo cuadrado repetido una y otra vez, vamos a necesitar alguna noción de estado, alguna noción de un valor cambiante.

¿Verdad? Pero no tenemos estado. Es el mundo funcional. Todo lo que tenemos son valores. No tienen tiempo. Cada llamada a cada función que hacemos con los mismos valores nos va a dar lo mismo. Entonces, ¿cómo manejamos el estado? Bueno, lo que podemos hacer es representar el estado que nos importa con datos. Y en una cierta llamada a una función, vamos a pasar cualquier entrada que la función necesite, junto con el estado actual del mundo que a esta función le pueda importar. Y luego lo que podemos hacer es devolver no solo el valor de salida de esta función, sino también un nuevo objeto actualizado. No el objeto antiguo modificado, sino un objeto completamente nuevo que representa un nuevo estado del mundo en caso de que haya cambiado. Así que al tratar el estado como datos y tratarlo como parte del valor de retorno y la entrada podemos hacer un seguimiento de dónde estamos en la imagen o en el tiempo o en lo que sea que estemos tratando de hacer. En este caso, va a ser dónde estamos en la imagen. Así que intentemos usar este principio para dibujar una pieza de arte un poco más interesante donde tengamos un tablero de ajedrez. Ahora estoy usando la misma función get tiles donde va a dibujar una cuadrícula. Pero esta vez, en lugar de pasar mi baldosa básica, voy a pasar una baldosa ajedrezada donde lo que vamos a hacer es pasar un array de colores y hacer un seguimiento del estado, entre comillas, con un índice que me va a decir en qué color estoy actualmente. Así que voy a cambiar ese índice en la nueva pieza de estado que devuelvo de esta función que luego puedo usar para pasar a la siguiente llamada a esta función y comenzar con un color diferente. Así que si paso dos colores, esto va a alternar entre ellos. Y si paso un array más largo, va a rotar uno tras otro a través de ellos. ¿Genial? Así obtenemos este patrón de tablero de ajedrez. ¿Conmigo? Bien, de acuerdo.

Así que es como, genial, podemos jugar a las damas, supongo. Pero, ¿qué más podemos hacer con esto? Bueno, no sé si lo has notado o si esto te recuerda a algo, pero en realidad podemos hacer moda, chicos. ¡Whoo! Muy bien. Así que, no sé si la gente en casa puede ver, y me disculpo por el caos geométrico de este atuendo. Pero, ¿te gusta mi atuendo? Gracias. Es funcional. No, así que encontré estos, encontré estos pantalones en una tienda en Budapest, Hungría, recientemente llamada Palmetta Design, un saludo a los diseñadores del mundo, haciéndolo posible. Y yo, por supuesto, estaba como, A, necesito estos pantalones, B, necesito averiguar cómo hacer este patrón. Que es lo que voy a hacer que todos ustedes hagan ahora mismo. Así que, este es básicamente el patrón que necesitamos para hacer algo de moda increíble. ¿Cómo harías esto usando nada más que lo que hemos visto hasta ahora? Oh, estamos pensando, estamos pensando. Veo mucho rascarse, veo muchas cabezas asintiendo, veo mucho eh, bien, veamos.

Entonces, porque lo que tenemos es algo que está un poco descentrado, primero que nada tomemos esto y notemos que si rotáramos todo o lo desrotáramos, obtendríamos una cuadrícula de aspecto más regular. Y si te das cuenta aquí, este es en realidad el mismo mosaico, el mismo patrón repitiéndose una y otra vez. una y otra vez. Así que, echemos un vistazo a uno de estos fragmentos de patrón y hagamos zoom, ¿notas algo? Esto son cuatro tableros de damas diferentes. Así que, lo que tenemos es un gran tablero de damas cuadrado, que ya sabemos cómo dibujar, luego tenemos uno estrecho aplastado y uno ancho aplastado, que comienzan con el color alternante para que se alineen bien con la alternancia. Y luego tenemos otro pequeño cuadrado. Así que, sabemos cómo dibujar estos cuatro tableros de damas diferentes. Ya tenemos una función que lo hace. Entonces, lo que podemos hacer es tomar esos cuatro tableros de damas y aplastarlos juntos en un solo mosaico y usar eso como la función de mosaico que pasamos a nuestro getTiles.

Así que, aquí hay un montón de código. Pero básicamente, esto está haciendo exactamente lo que acabo de describir. Entonces, lo que tenemos es que estamos eligiendo una proporción de qué tan lejos queremos que esté esa división ancha, estrecha. Estamos determinando las dimensiones y luego estamos creando como el gran tablero de damas cuadrado, el estrecho aplastado, el ancho aplastado y el pequeño cuadrado. Y básicamente los estamos concatenando todos juntos en un gran valor de retorno. Y luego, el único cambio interesante que estamos haciendo es verificar si, basado en el número de mosaicos en uno de esos tableros de damas, si es par o impar, vamos a decidir si necesitamos o no invertir el primer color para que todo se alinee bien y obtengamos el patrón alternante. Pero esto es básicamente todo. Así que, lo que tenemos ahora es algo de programación funcional usable. Estoy bastante orgulloso de nosotros. No sé ustedes. Pero sí. ¡Uf!

Así que, el tiempo no estoy seguro ahora porque no lo tengo, pero voy a seguir adelante porque lo que hemos estado viendo hasta ahora son cosas que son realmente regulares y realmente predecibles. Así que, ahora intentemos hacer las cosas un poco más interesantes añadiendo algo de irregularidad. ¿Cómo hacemos eso? ¿Cómo añadimos un poco de variación orgánica a nuestro arte? ¿Cómo incorporamos la aleatoriedad es lo que te estoy preguntando?

Entonces, ¿cómo maneja la programación funcional la aleatoriedad? Bueno, probablemente puedas adivinar. No lo hace. No hacemos aleatoriedad en programación funcional. Porque si lo hiciéramos, entonces no podríamos predecir cuál debería ser el valor de retorno dado ciertos inputs, ¿verdad? Y eso rompería todo nuestro cerebro y todas las maravillosas ventajas de predictibilidad y capacidad de depuración y prueba.

Así que, vamos a hacer lo mismo que hace cualquier otra pieza de computación porque en realidad todas las computadoras son deterministas incluso cuando pretenden no serlo. Y vamos a usar pseudoaleatoriedad. Donde vamos a generar valores que tienen la misma distribución que los valores aleatorios, pero en realidad podemos predecir qué valores vamos a generar basándonos en una semilla que damos a un generador de números pseudoaleatorios. Entonces, el generador de números aleatorios que podemos usar, el generador de números pseudoaleatorios podría ser algo como Simplex Noise. Simplex Noise es realmente genial para el arte generativo, porque básicamente lo que hace es generar un campo de valores, como una cuadrícula de valores para ti, que si haces zoom y lo miras a gran escala, parece totalmente aleatorio. Pero si haces zoom y miras una porción más pequeña del campo de ruido que genera, en realidad puedes ver que los valores están relacionados unos con otros, por lo que obtienes esta agradable transición suave y orgánica de un valor pseudoaleatorio al siguiente. Así que este es un algoritmo realmente útil para hacer arte generativo. Y entonces lo que podemos hacer es obtener un paquete de Simplex Noise de una fuente muy impura del mundo exterior, pero luego lo que podemos hacer es impuramente obtener un campo de ruido que nos dará de manera predecible los mismos valores aleatorios. Entonces, cómo funciona esto es si instancio un campo de ruido con este algoritmo, con una cadena particular como semilla, obtengo una cierta cuadrícula 2D que luego puedo consultar en un cierto punto y obtener un cierto valor. Así que tomo mi campo 2D. Le doy una coordenada x, y y obtengo un valor. Y si genero este campo con una semilla diferente, obtendré un valor diferente. Si genero un nuevo campo con la misma semilla, obtengo el mismo valor. Así que esto es determinista. Es pseudoaleatorio, no es realmente aleatorio. Pero para nuestros propósitos, funciona igual de bien. Y entonces lo que tenemos ahora, podemos hacer como una función make random tile, donde voy a pasar el campo de ruido como datos que esto importa y algunos colores y un índice para cada mosaico para representar cada mosaico. Y luego voy a usar ese índice de mosaico para determinar un valor aleatorio específico del campo de ruido que representará este mosaico, usar eso para elegir aleatoriamente un color para este pequeño mosaico, y luego incrementar mi índice de mosaico en cada llamada a esta función para que esté obteniendo un valor diferente para cada mosaico diferente. Y lo que esto me da entonces es un campo algo ruidoso pero elegido de los colores que elegí un tipo de campo ruidoso. Y a dónde podemos llevar esto es a comenzar a cambiar aleatoriamente o agitar alguna propiedad de nuestro arte basado en estos valores que son pseudoaleatorios pero lo suficientemente diferentes de mosaico a mosaico, que parecen aleatorios para nosotros, para nuestros ojos humanos tontos. Así que lo que tengo aquí es que estoy dibujando estos pequeños relojes. Cada uno de estos mosaicos va a ser un círculo con un color particular y una manecilla de reloj particular que está rotada un cierto número de grados. Y todo lo que estoy haciendo es usar el mismo concepto, usando el índice de mosaico para determinar un número aleatorio de grados para rotar este mosaico. Y en este caso, en realidad no estoy eligiendo un color aleatorio.

Y en este caso, en realidad no estoy eligiendo un color aleatorio. Estoy alternando los colores, igual que hicimos en nuestro tablero de ajedrez, para crear este tipo de patrón agradable que se repite pero también es aleatorio. Así que este es un ejemplo de cómo podemos, incluso en un mundo puramente funcional, incorporar esa variación orgánica y pretender que tenemos aleatoriedad.

Bien. Estoy muy pasado de tiempo. Así que recapitulemos rápidamente. Mira todo lo que hicimos. Descubrimos cómo hacer efectos secundarios. De hecho, dibujamos algunas cosas en la pantalla poniéndolas todas en una capa imperativa alrededor de nuestro núcleo puramente funcional. Descubrimos cómo hacer repetición. Siempre con recursión. No necesitamos bucles for aquí. Estamos bien. Tenemos recursión. Descubrimos cómo hacer un seguimiento del estado básicamente tratándolo como más datos y asegurándonos de que si necesitamos cambiar algo en el estado, devolvemos nuevos datos en su lugar. Y descubrimos cómo lidiar con la aleatoriedad generando en nuestra capa imperativa un campo de valores que luego podemos usar para simular aleatoriedad en nuestros programas.

Así que acabamos de hacer mucho arte funcional. Estén muy emocionados y orgullosos de ustedes mismos. Creo que hicimos un gran trabajo. Puedes revisar el código de estos ejemplos en observableHQ.com. Puedes seguirme en Twitter.