El Arte de la Programación Funcional

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

Me llamo Anjana Vakil. Estoy aquí para hablarles sobre React. Solo bromeo. No. Estoy aquí para hablarles sobre la programación funcional. Que está relacionada 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 la programación funcional, porque creo que es un paradigma realmente hermoso. Una forma realmente hermosa de entender qué son los programas, de qué están hechas las entidades, cómo se comportan e interactúan esas entidades. En otras palabras, un paradigma de programación que creo que es bastante genial. Y no creo que sea el único.

Porque la programación funcional tiene algunas características realmente agradables. En primer lugar, los programas funcionales son muy fáciles de predecir. Son muy previsibles. Lo que significa que son fáciles de probar para asegurarnos de que estén haciendo lo correcto. Y son fáciles de depurar para asegurarnos de que cuando no estén haciendo lo correcto, descubramos por qué y lo solucionemos. Y por eso, como programadores, creo que la mayoría de nosotros encontramos la programación funcional bastante fácil de amar. Demos un aplauso si les gusta la programación funcional. ¡Sí! Funciones. Funciones. ¡Whoo! Pero en realidad creo que la programación funcional también puede dar miedo.

Levanten la mano si tienen un poco 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 bien merecida de ser este mundo académico muy opaco y aterrador lleno de palabras extrañas, como términos de 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 fundamentales, puede ser muy simple de entender. Y así que me he propuesto tratar de hacer que la programación funcional sea más accesible. Tal vez me conozcan por esta charla que di llamada Aprendiendo Programación Funcional en JavaScript. Si no han encontrado la programación funcional antes o si conocen a alguien que no lo ha hecho y quiere hacerlo, vean esa charla. Se adentra mucho más en cómo funciona realmente la programación funcional en el fondo. Y para profundizar aún más, también pueden ver un curso que tengo en frontend masters llamado Primeros Pasos en JavaScript Funcional. Esta charla no va a adentrarse realmente en los detalles de cómo hacemos programación funcional excepto en la medida en que responda las preguntas de cómo hacemos programación funcional en el mundo real.

Entonces, ¿qué es la programación funcional solo en un nivel alto? Bueno, es programar con funciones. Eso es muy perspicaz. Mi charla ha terminado. Adiós. Ok. Es broma. La programación funcional es programar con funciones, como probablemente ya saben. De hecho, es programar 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 una entrada en una 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. Por ejemplo, le puedes dar un ancho y una altura como entradas y tal vez devuelva ese relación de aspecto dividiéndolos como su salida. Muy simple, muy predecible, porque eso significa que una función pura es totalmente determinista. Entonces, 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, estos no existen en el mundo de la programación funcional. Entonces, cada vez que llames a una función con las mismas entradas, obtendrás la misma salida. Así que es determinista, seguro, predecible, lo cual hace felices a los programadores.

Esto también significa que las funciones puras no pueden tener efectos secundarios. Un efecto secundario es cualquier cosa que la función pueda hacer que no sea devolver su valor de retorno. Esto significa que hay muchas cosas que estamos acostumbrados a hacer que no podemos hacer en el mundo funcional. Por ejemplo, no podemos imprimir en la consola. Eso es un efecto secundario. No estamos devolviendo un valor. No podemos modificar el DOM. Eso es un efecto secundario. Estamos haciendo algo que no sea devolver un valor. Tampoco podemos mirar lo que hay en el DOM o mirar el estado del mundo exterior a nuestro programa. Por ejemplo, verificar el valor de cierto elemento para un atributo específico. 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 obtener un resultado diferente. No podemos permitir eso.

Entonces, no podemos imprimir cosas, no podemos modificar el DOM, ni siquiera podemos mirar el DOM o cualquier otra cosa fuera de las entradas. Cada función solo puede mirar sus entradas y devolver su salida. ¿De acuerdo? Todos estamos de acuerdo, ¿verdad? Sí. Sí. Genial. Esto significa que no podemos hacer nada. ¿Qué podemos hacer? Si no podemos tocar nada, no podemos afectar nada en el mundo, lo único que podemos hacer es devolver valores. ¿Qué se supone que debemos hacer? Bueno, la programación funcional puede hacer lo que necesitamos, pero tenemos que acostumbrarnos a algunas técnicas para relacionarnos con el mundo real y seguir manteniendo nuestro mundo funcional puro y determinista. Así que esto es lo que vamos a ver hoy, cómo funciona la programación funcional en el mundo real y no en los pequeños círculos académicos matemáticos donde existe en como este otro plano de realidad. Sino en nuestro mundo donde queremos dibujar cosas en pantallas, por ejemplo. ¿Qué tal si dibujamos algo de arte en la pantalla, sí? ¡Woo! De acuerdo. Vamos a hacer arte generativo y ver cómo eso nos ayuda a entender cómo la programación funcional se relaciona con el mundo real al intentar 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 capaz de hacer o no es muy buena en hacer. Así que el arte generativo generalmente necesita algún tipo de efectos secundarios.

Si estás tratando de hacer arte, debes dibujar algunos píxeles en la pantalla, ¿verdad? Probablemente necesitarás algún elemento de repetición. Querrás tener motivos recurrentes en tu obra artística. Es posible que necesites alguna representación del estado, porque tal vez quieras alterar diferentes partes de la imagen de diferentes maneras, cambiando valores, ¿verdad? Pero no tenemos estado, ¿entonces cómo lo hacemos? Y probablemente también quieras incluir algún elemento de variación orgánica, por lo general, el arte generativo involucra algún aspecto de aleatoriedad.

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

Entonces, efectos secundarios. ¿Cómo los maneja la programación funcional? Bueno, no lo hace. Sin embargo, lo que podemos hacer cuando necesitamos realizar efectos secundarios, como, por ejemplo, dibujar algo en la pantalla o manipular el DOM, es tomar esos efectos secundarios y empujarlos hacia el borde más externo de nuestro programa. Así podemos crear, como una especie de capa protectora alrededor de nuestro programa donde todas las cosas imperativas y desordenadas relacionadas con los efectos secundarios pueden residir en ese borde más externo. Y luego, dentro de eso, podemos mantener todas las partes internas del programa puras y funcionales, es decir, deterministas, seguras, predecibles, probables y depurables.

Entonces, lo que queremos hacer es empujar todos los efectos secundarios desordenados hacia el borde externo, la capa imperativa que envolverá un núcleo funcional puro. ¿Conmigo? Veamos cómo se ve eso en la vida real. Aquí hay un ejemplo, tengo un pequeño SVG que llamo arte. Veremos si eso sigue siendo cierto 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 llamo impure set SVG contents. Lo que hará es realizar todos los efectos secundarios. Va a tomar mi elemento de arte del DOM. Va a establecer rápidamente y de forma sucia su contenido interno HTML para básicamente hacer un efecto secundario aquí, cambiar algo en el documento. Y eso básicamente será nuestra capa imperativa externa. Así que este no es código funcional. 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 bonita capa que está haciendo los efectos secundarios por nosotros. Entonces, lo que puedo hacer entonces es obtener una función pura, que puedo llamar get art, que tomará los parámetros que necesito darle, y luego creará el contenido de una manera pura y determinista, que mi impure SVG contents colocará en la página de una manera imperativa y no funcional. ¿Genial? Muy bien. Veo algunas cabezas asintiendo y algunas personas que todavía están despertando después del café. Estoy con ustedes.

Entonces, hagamos algunos patrones, y tal vez esa sea una buena manera de completar nuestro contenido desde nuestro pequeño programa de capa imperativa. Los patrones son divertidos para el arte generativo. Entonces, ¿cómo podemos hacer patrones donde generalmente los patrones involucran algún elemento de repetición? ¿Cómo hacemos repetición en el mundo funcional? 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 iteración que hagas. Entonces, en lugar de esta forma imperativa de pensar en 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. La recursión será el subparadigma que usaremos para lograr la repetición en la programación funcional.

Probablemente no sea algo nuevo para la gente, pero es realmente interesante cómo se relacionan la iteración y la recursión, o al menos eso creo. Tengo otra charla donde profundizo más en 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 sobre recursión, iteración y JavaScript, una historia de amor, de JS Heroes 2018. Pero hoy nos vamos a centrar en la recursión, ¿cómo funciona?

Intentemos crear un pequeño patrón con 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é obtener patrón, porque soy muy bueno para poner nombres. Y esto tomará un par de colores y luego un ancho determinado para el tamaño que queremos que tenga este patrón. Y como cualquier función recursiva, esta será una buena función recursiva que no colapsará mi computadora, porque tiene dos partes. Tiene un caso base donde en realidad no hay recursión en absoluto, donde, básicamente, si tengo un ancho lo suficientemente pequeño, simplemente voy a devolver un rectángulo de un cierto color, 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 voy a devolver un rectángulo o un cuadrado, en este caso, de un cierto color, sino que también lo voy a rotar un poco y luego usar mi misma función obtener patrón, con los colores intercambiados, para generar un patrón rotado más pequeño de la misma estructura con la dirección opuesta de los colores. Y al llamarse recursivamente a sí misma, obtendremos este patrón repetitivo y alucinante dibujado. Recursión simple. ¿Estamos conmigo hasta ahora? ¿Todo bien? Veo pulgares arriba. Excelente. Pulgares arriba en la transmisión en vivo. Excelente. Muy bien. Fabuloso.

Ahora, este fue un ejemplo sencillo porque este patrón parece recursivo, ¿verdad? Parece ser recursivo. ¿Qué pasa con un patrón que no tiene esa vibra? ¿Qué tal una cuadrícula estándar? ¿Cómo dibujarías una cuadrícula estándar si no puedes usar un bucle for? Si no puedes usar la iteración. Te dejaré pensando en eso mientras tomo un sorbo. ¿Cómo dibujarías esta cuadrícula de forma recursiva? Vale. No puedo escuchar lo que estás diciendo, pero te aprecio. Veamos una forma en la que podríamos hacer esto. Si es lo que dijiste, solo grita sí. Entonces, lo que podemos hacer es comenzar con un caso base donde simplemente dibujamos una casilla.

Solo una casilla. No es mucho pedir. Y luego lo que podemos hacer es verificar. ¿Estamos intentando dibujar más casillas que esta? ¿Tenemos más columnas y filas para dibujar? Y si es así, entonces podemos tratar esas como cuadrículas más pequeñas y podemos dibujar cuadrículas de forma recursiva.

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

Entonces esto es lo que podría verse en código. Sé que esto es mucho. Ten paciencia. Pero lo que tenemos es un caso base donde básicamente estamos calculando a partir del ancho y alto que queremos y el número de columnas y filas que queremos, estamos calculando cuál debería ser el ancho y alto de esta casilla en particular. Y básicamente, lo estamos devolviendo. Y si no tenemos más columnas o filas además de 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 obtenerCasillas, para obtener este patrón de casillas. Vamos a llamar a obtenerCasillas para dibujar todo el resto de esta fila hacia la derecha. Básicamente, dibujando otra área de casillas que tiene un ancho reducido y solo una fila. ¿Entendido? Y luego, si tenemos más filas debajo de eso para dibujar, estamos haciendo, nuevamente, otra llamada a obtenerCasillas con un número reducido de filas y todas las columnas, por lo que básicamente estamos dibujando el resto completo del búho. ¿Entendido? Muy bien.

Entonces lo que tenemos es que podemos usar nuestra función obtenerCasillas. Y lo que estamos haciendo es pasar una pequeña función hacerCasilla. Esto también tiene una vibra muy funcional, ¿verdad? Pasar funciones. Porque luego podemos cambiar lo que hace esa hacerCasilla para dibujar cosas diferentes. Ahora mismo, estoy pasando una casilla muy básica que simplemente 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 obtenerCasillas con nuestra función hacerCasillaBásica. ¿De acuerdo? Genial. Ahora intentemos hacer algo más interesante.

Muy bien. Para hacer algo más interesante que tener 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 tierra funcional. Todo lo que tenemos son valores. No tienen tiempo. Cada llamada a cada función que hacemos con los mismos valores nos dará lo mismo. Entonces, ¿cómo manejamos el estado? Bueno, lo que podemos hacer es representar el estado que nos importa con data. Y en una determinada llamada a una función, vamos a pasar cualquier entrada que la función necesite, junto con el estado actual del mundo que esta función pueda necesitar. 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. Entonces, tratando el estado como data y tratándolo como parte del valor de retorno y la entrada podemos realizar un seguimiento de dónde estamos en la imagen o en el tiempo o en lo que estamos tratando de hacer. En este caso, será dónde estamos en la imagen. Entonces intentemos usar este principio para dibujar una pieza de arte un poco más interesante donde tenemos un tablero de damas. Ahora estoy usando la misma función obtenerCasillas donde va a dibujar una cuadrícula. Pero esta vez, en lugar de pasar mi casilla básica, voy a pasar una casilla a cuadros donde lo que vamos a hacer es pasar un array de colores y realizar un seguimiento del estado, entre comillas, con un índice que me dirá qué color estoy usando actualmente. Entonces, luego 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. Entonces, si paso dos colores, esto cambiará entre ellos. Y si paso un array más largo, rotará uno tras otro a través de ellos. ¿Genial? Así obtenemos este patrón de tablero de damas. ¿Conmigo? De acuerdo, muy bien.

Entonces, es como, genial, podemos jugar a las damas, supongo. Pero, ¿qué más podemos hacer con esto? Bueno, no sé si te has dado cuenta o si esto te recuerda algo, pero en realidad podemos hacer moda, chicos. ¡Whoo! Muy bien. Entonces, no sé si la gente en casa puede verlo, y pido disculpas por el caos geométrico de este atuendo. ¿Pero te gusta mi atuendo? Gracias. Es funcional. No, así que encontré estos pantalones en una tienda en Budapest, Hungría, llamada Palmetta Design, saludos a los diseñadores del mundo, haciéndolo posible. Y, por supuesto, pensé, A, necesito estos pantalones, B, necesito descubrir cómo hacer este patrón. Lo cual es lo que voy a hacer que todos ustedes hagan ahora mismo. Entonces, básicamente este es el patrón que necesitamos para hacer algo de moda genial. ¿Cómo harías esto utilizando solo lo que hemos visto hasta ahora? Oh, estamos pensando, estamos pensando. Veo mucho rascarse la cabeza, veo muchos asentimientos, veo mucho eh, muy bien, vamos a ver.

Entonces, porque lo que tenemos está un poco desequilibrado, primero vamos a tomar esto y notar que si rotáramos todo o desrotáramos, obtendríamos una cuadrícula con un aspecto más regular. Y si te fijas aquí, en realidad es la misma baldosa, el mismo patrón que se repite una y otra vez. Así que echemos un vistazo a uno de estos fragmentos de patrón y acércate, ¿notas algo? Esto son cuatro tableros de ajedrez diferentes. Entonces, lo que tenemos es un gran tablero de ajedrez cuadrado, que ya sabemos cómo dibujar, luego tenemos uno estrecho y uno ancho, que comienzan con el color alternado para que se alineen correctamente con la alternancia. Y luego tenemos otro pequeño cuadrado. Entonces, sabemos cómo dibujar estos cuatro tableros de ajedrez diferentes. Ya tenemos una función que lo hace. Entonces, lo que podemos hacer es tomar esos cuatro tableros de ajedrez y combinarlos en una sola baldosa y usarla como función de enlazado que pasamos a nuestro getTiles. Y luego rotamos todo y ya está.

Entonces, 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 simplemente elegimos una proporción de qué tan lejos queremos que sea esa división ancha y estrecha. Estamos calculando las dimensiones y luego estamos creando el tablero de ajedrez grande y cuadrado, el estrecho aplastado, el ancho aplastado y el pequeño cuadrado. Y básicamente los estamos concatenando todos juntos en un único valor de retorno. Y luego, la única parte interesante que estamos haciendo es verificar si, en función del número de casillas en uno de esos tableros de ajedrez, si es par o impar, vamos a decidir si necesitamos voltear el primer color para que todo se alinee correctamente y obtengamos el patrón alternado. Pero eso es básicamente todo. Entonces, lo que tenemos ahora es una programación funcional aplicada a la moda. Estoy bastante orgulloso de nosotros. No sé ustedes. Pero sí. ¡Uf! Ok.

Entonces, el tiempo del que 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 predecibles. Ahora intentemos hacer las cosas un poco más interesantes agregando algo de irregularidad. ¿Cómo hacemos eso? ¿Cómo agregamos un poco de variación orgánica a nuestro arte? ¿Cómo incorporamos la aleatoriedad es lo que les estoy preguntando?

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

Entonces, vamos a hacer lo mismo que cualquier otra pieza de cálculo porque en realidad todas las computadoras son deterministas incluso cuando pretenden no serlo. Y vamos a utilizar la pseudo-aleatoriedad. 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 en función de una semilla que le damos a un generador de números pseudo-aleatorios. Entonces, el generador de números aleatorios que podemos utilizar, el generador de números pseudo-aleatorios podría ser algo como el ruido Simplex. El ruido Simplex 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 te alejas y lo ves a gran escala, parece totalmente aleatorio. Pero si te acercas y ves una parte más pequeña del campo de ruido que genera, en realidad puedes ver que los valores están relacionados entre sí, por lo que obtienes esta agradable transición suave y orgánica de un valor pseudo-aleatorio al siguiente. Entonces, este es un algoritmo realmente útil para hacer arte generativo. Y lo que podemos hacer es obtener un paquete de ruido Simplex de una fuente muy impura del mundo exterior, pero luego podemos obtener de manera impura 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 en particular como una semilla, obtengo una cuadrícula 2D determinada que luego puedo consultar en un punto determinado y obtener un valor determinado. 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. Esto es determinista. Es pseudo-aleatorio, no es realmente aleatorio. Pero para nuestros propósitos, funciona igual de bien. Y lo que tenemos ahora, podemos hacer una función como make random tile, donde voy a pasar el campo de ruido como datos en los que se preocupa y algunos colores y un índice para cada casilla para representar cada casilla. Y luego voy a usar ese índice de casilla para determinar un valor aleatorio específico del campo de ruido que representará esta casilla, usar eso para elegir aleatoriamente un color para esta pequeña casilla, y luego incrementar mi índice de casilla en cada llamada a esta función para obtener un valor diferente para cada casilla diferente. Y lo que esto me da entonces es un campo ruidoso pero elegido de entre los colores que elegí. Y a partir de aquí, podemos comenzar a cambiar aleatoriamente o mover algunas propiedades de nuestro arte basado en estos valores que son pseudo-aleatorios pero lo suficientemente diferentes de casilla a casilla, que parecen aleatorios para nosotros, para nuestros tontos ojos humanos. Así que lo que tengo aquí es que estoy dibujando estos pequeños relojes. Cada una de estas casillas va a ser un círculo con un color particular y una manecilla de reloj particular que está girada un cierto número de grados. Y todo lo que estoy haciendo es usar el mismo concepto, usar el índice de casilla para determinar un número aleatorio de grados para girar esta casilla. 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 incorporar, incluso en un mundo funcional puro, esa variación orgánica y fingir que tenemos aleatoriedad.

De acuerdo. Estoy súper atrasado. Así que hagamos un resumen rápido. Miren todo lo que hicimos. Descubrimos cómo hacer efectos secundarios. En realidad, dibujamos algunas cosas en la pantalla al ponerlo todo en una estructura imperativa alrededor de nuestro núcleo funcional puro. 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 tratándolo básicamente 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 estructura imperativa un campo de valores que luego podemos usar para simular la 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. Pueden ver el código de estos ejemplos en observableHQ.com. Pueden seguirme en Twitter. Les agradezco mucho su tiempo, ¡y vayan y hagan arte! ¡Woo!