{"id":9095,"date":"2022-08-16T18:38:25","date_gmt":"2022-08-16T18:38:25","guid":{"rendered":"https:\/\/temperies.com\/?p=9095"},"modified":"2022-08-18T17:35:08","modified_gmt":"2022-08-18T17:35:08","slug":"programacion-reactiva","status":"publish","type":"post","link":"https:\/\/temperies.com\/es\/2022\/08\/16\/programacion-reactiva\/","title":{"rendered":"Programaci\u00f3n Reactiva"},"content":{"rendered":"<div data-elementor-type=\"wp-post\" data-elementor-id=\"9095\" class=\"elementor elementor-9095\">\n\t\t\t\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6888917 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"6888917\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-d3b5ffb\" data-id=\"d3b5ffb\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-ab0e693 elementor-widget elementor-widget-heading\" data-id=\"ab0e693\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Programaci\u00f3n Reactiva<\/h2>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bed0501 elementor-widget elementor-widget-spacer\" data-id=\"bed0501\" data-element_type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-30ecef8 elementor-widget elementor-widget-heading\" data-id=\"30ecef8\" data-element_type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<h6 class=\"elementor-heading-title elementor-size-default\">Autor: Jorge Mendiola<\/h6>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-205f38d elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"205f38d\" data-element_type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-9a7ceb3\" data-id=\"9a7ceb3\" data-element_type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d2c197f elementor-widget elementor-widget-text-editor\" data-id=\"d2c197f\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>La <strong>programaci\u00f3n reactiva<\/strong> es un paradigma de programaci\u00f3n del cual seguramente ya han escuchado hablar. Es com\u00fan que este paradigma se mezcle con el de programaci\u00f3n orientada a objetos y con el paradigma funcional.<\/p><p>La programacion reactiva tiene dos <strong>objetivos<\/strong> principales:<\/p><ul><li aria-level=\"1\">Propagar los cambios que ocurren sobre las variables del sistema de manera r\u00e1pida y sin mucho esfuerzo.<\/li><li aria-level=\"1\">Trabajar con flujos as\u00edncronos de datos.<\/li><\/ul><p>\u00a0<\/p><p>Veamos algunos ejemplos, para ilustrar ambos objetivos. Para el caso de <strong>propagaci\u00f3n de cambios<\/strong>, imaginemos una hoja de c\u00e1lculo en la que tomamos una celda y colocamos una f\u00f3rmula en la que depende de valores de otras dos celdas. Luego cuando colocamos los valores en las celdas que participan de la f\u00f3rmula autom\u00e1ticamente cambia el valor resultado de la f\u00f3rmula en esa celda. Haciendo que efectivamente los cambios se propaguen en nuestro sistema.<\/p><p>\u00a0<\/p><p>Para comprender el segundo objetivo, imaginemos una hoja en el procesador de texto y cada vez que presionamos una tecla est\u00e1 enviando un dato, entonces el procesador de texto reacciona de acuerdo a como ha sido programado. En este caso colocar la letra donde corresponde. Este flujo es <strong>as\u00edncrono<\/strong> debido a que el programa no sabe cuando vamos a escribir la siguiente letra.\u00a0\u00a0<\/p><p>\u00a0<\/p><p>Si est\u00e1s familiarizado con la programaci\u00f3n orientada objetos te dar\u00e1s cuenta que este paradigma est\u00e1 fuertemente relacionado con el de observer y observable.<\/p><p>\u00a0<\/p><p>Es com\u00fan cuando buscamos por internet sobre programaci\u00f3n reactiva nos encontremos con la mezcla de dos paradigmas, el funcional y reactivo. Que <b>NO<\/b> es lo mismo que la programaci\u00f3n reactiva. La programaci\u00f3n funcional por s\u00ed misma merece su propio art\u00edculo ya que amerita una explicaci\u00f3n much\u00edsimo m\u00e1s amplia. Pero basta con decir que <strong>la programaci\u00f3n funcional reactiva<\/strong> nos permite filtrar, transformar y resumir los flujos de datos as\u00edncronos para obtener otros tipos de datos que sirvan para nuestra aplicaci\u00f3n. Pensando en el ejemplo del procesador de texto, se podr\u00eda utilizar cuando se realiza una combinaci\u00f3n de teclas y el mismo no sabe interpretarlas por lo que se termina filtrando esa combinaci\u00f3n.\u00a0<\/p><p>\u00a0<\/p><p>Una de las cosas que me resultaron confusas al principio cuando comenc\u00e9 a estudiar y a analizar este paradigma es el siguiente diagrama:<\/p><p>\u00a0<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c9ad2ab elementor-widget elementor-widget-image\" data-id=\"c9ad2ab\" data-element_type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" width=\"512\" height=\"244\" src=\"https:\/\/temperies.com\/wp-content\/uploads\/2022\/08\/unnamed-12.png\" class=\"attachment-large size-large wp-image-9099\" alt=\"\" srcset=\"https:\/\/temperies.com\/wp-content\/uploads\/2022\/08\/unnamed-12.png 512w, https:\/\/temperies.com\/wp-content\/uploads\/2022\/08\/unnamed-12-18x9.png 18w\" sizes=\"(max-width: 512px) 100vw, 512px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-cd38b4a elementor-widget elementor-widget-text-editor\" data-id=\"cd38b4a\" data-element_type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<p>En donde aparece en la parte superior el flujo o los flujos de datos provenientes de cualquier fuente, en el medio la operaci\u00f3n que se le est\u00e1 aplicando al flujo y debajo el flujo resultante, solamente de eso se trata. Se pueden ver estos diagramas de manera interactiva en rxviz.com o en rxmarbles.com.<\/p><p>\u00a0<\/p><p>Ahora algunos lenguajes de programaci\u00f3n ya proveen la forma de implementar la programaci\u00f3n reactiva, pero por qu\u00e9 no tomar ventaja de lo que la comunidad ya ha probado y desarrollado de manera exitosa? en este caso me refiero a una <strong>API llamada como las extensiones reactivas o reactive extension<\/strong> o Rx simplemente. Esta implementaci\u00f3n de la programaci\u00f3n reactiva nos permite crear y consumir flujos de datos de manera sencilla y uniforme. La sintaxis cambia pero los conceptos se mantienen.\u00a0<\/p><p>\u00a0<\/p><p>Es bueno mencionar que aunque entendamos para que se usa y sepamos que existan las librer\u00edas no significa que lo debemos usar en cada lugar donde estemos desarrollando. Por lo que debemos considerar que la programaci\u00f3n reactiva como tal es una <strong>herramienta<\/strong> y siempre hay que intentar encontrar la mejor herramienta para el trabajo que vamos a realizar.\u00a0<\/p><p>\u00a0<\/p><p>Veamos algunos casos donde es <strong>conveniente<\/strong> utilizar la programaci\u00f3n reactiva. El primer caso es <strong>cuando el usuario interact\u00faa con una interfaz gr\u00e1fica<\/strong>. Otro buen candidato para ser modelado con programaci\u00f3n funcional reactiva son aplicaciones en las que trabajen con <strong>datos en tiempo real<\/strong> por ejemplo la lectura de un term\u00f3metro o un sism\u00f3grafo, o de inmensa cantidad de datos que se obtienen a trav\u00e9s de los sensores de los auto aut\u00f3nomos. El tercera y \u00faltimo caso podr\u00eda darse cuando trabajamos con <strong>flujos interminables de datos<\/strong>, como por ejemplo, la cantidad de twits que existen y que se crean d\u00eda a d\u00eda o las transferencias bancarias que ocurren a lo largo de una semana.<\/p><p>\u00a0<\/p><p>Bueno eso es todo, espero que les haya gustado el art\u00edculo tanto como a mi escribirlo. En el pr\u00f3ximo art\u00edculo intentar\u00e9 dar un ejemplo paso a paso de como utilizar esta librer\u00eda. Hasta la pr\u00f3xima.<\/p><p>\u00a0<\/p>\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t\t\t\t<\/div>","protected":false},"excerpt":{"rendered":"<p>La programaci\u00f3n reactiva es un paradigma de programaci\u00f3n que seguramente ya han escuchado hablar. Es com\u00fan que este paradigma se mezcle con el de programaci\u00f3n orientado a objetos y con el paradigma funcional.<\/p>","protected":false},"author":1,"featured_media":9098,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[45,43,46],"tags":[],"_links":{"self":[{"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/posts\/9095"}],"collection":[{"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/comments?post=9095"}],"version-history":[{"count":11,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/posts\/9095\/revisions"}],"predecessor-version":[{"id":9155,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/posts\/9095\/revisions\/9155"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/media\/9098"}],"wp:attachment":[{"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/media?parent=9095"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/categories?post=9095"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/temperies.com\/es\/wp-json\/wp\/v2\/tags?post=9095"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}