Hoy una curiosidad rápida y simple pero puede que de interés, surgida a partir de la pregunta de un alumno y que tiene que ver con la manera de gestionar la misma información que tienen los navegadores dependiendo de si se hace en la interfaz de usuario o en la consola, la cual además puede variar de un navegador a otro. Tiene poca incidencia práctica, pero puede ser interesante... [Más]

Las expresiones regulares son uno de los mejores inventos de la historia de la programación. Yo las uso para todo. El problema de las expresiones regulares es que, aunque lo básico es sencillo, pueden llegar a ser muy fastidiadas. Hay algunas que, para calcularlas, de entrada pueden parecer muy simples pero que te puede llevar horas dar con ellas. Son casi un lenguaje de programación en si mismas 😊 Otra cosa que hay que saber es que Internet está lleno de páginas con información equivocada o directamente errónea sobre expresiones regulares. En este post analizo detalladamente la construcción de una expresión regular que parece sencilla de entrada, pero que requiere dominar varias cosas importantes que no son tan evidentes para la mayoría. [Más]

Una cuestión que puede resultar muy útil en una página o aplicación web es la posibilidad de detectar cuándo aparece o desaparece de la pantalla un elemento determinado debido a las acciones del usuario. Por ejemplo, si desaparece una pieza de información importante porque el usuario hace scroll moviendo los contenidos, podemos sacar una nota resumen, recordatorio o acceso directo para ir verla de nuevo, y ocultarlo de nuevo cuando vuelva a aparecer. Cosas por el estilo. Esta funcionalidad no se incluye nativamente en HTML/JavaScript. He desarrollado una biblitoeca JavaScript que añade eventos a la página para detectar los cambios de visibilidad de cualquier elemento. [Más]

Una de las novedades que trae Chrome 73 es pequeña pero súper-interesante. Se trata de los Logpoints. Un logpoint es un tipo especial de punto de interrupción que podemos añadir a nuestro código JavaScript y que, en lugar de detener la ejecución del código, se limita a "loguear" a la consola lo que le digamos. Esto nos evita tener que andar metiendo console.log constantemente en el código tan solo para ver algunos valores. Te lo cuento... [Más]

Cuando estamos depurando paso a paso, poniendo puntos de interrupción en ciertas líneas para luego ir ejecutando el código instrucción por instrucción, no tiene mucho sentido que, de repente, se nos abra el código fuente de algunas bibliotecas estándar que están muy probadas y son robustas (jQuery, lodash, Angular, Vue...), pues no vamos a depurarlo. Y mucho menos si lo estamos usando ya minimizado y listo para producción, puesto que encima no veremos gran cosa tampoco. Vamos a ver cómo hacer que el depurador de Chrome se salte archivos completos que no nos interesa depurar, ahorrando tiempo y ganando productividad. [Más]

Pues sí: aunque estamos acostumbrados a pensar que en JavaScript tenemos un valor para el número 0 y este es el único que hay, en realidad es interesante conocer qué existen dos valores diferentes para el número 0 y que no son el mismo ni se obtienen de la misma manera. De hecho esto ocurre en la mayor parte de los lenguajes de programación ya que utilizan el estándar IEEE 745 para representar números, por lo que se comportan de la misma manera. En la práctica pocas veces veremos que este hecho nos impacte pero, aparte de ser un tema muy interesante, en algunas aplicaciones y algoritmos (sobre todo si involucran a las matemáticas) es importante conocer esta distinción. Te la cuenta en este artículo que pensé en escribir muy rápido pero al final se ha ido extendiendo más de la cuenta, como siempre 😉 [Más]

Cuando uno programa para la Web en la parte Front-End tiene muy interiorizados algunos conceptos que no siempre son correctos. Una confusión habitual (o al menos algo que no siempre se tiene claro) es la relación que existe entre los atributos de las etiquetas HTML y las propiedades de los objetos del DOM que representan a dichas etiquetas, a las que accedemos desde JavaScript. Muchas veces se piensa que existe una relación directa y bidireccional entre ellas, de modo que si cambias una propiedad se está cambiando el atributo y viceversa. Y aunque esto es cierto en algunos casos, existen otras casuísticas que pueden complicarte la vida si no las tienes en cuenta. Vamos a verlo... [Más]

En muchas ocasiones tenemos la necesidad de ejecutar en una aplicación la misma función JavaScript muchas veces seguidas, incluso sin pretenderlo. Por ejemplo un evento costoso que repinta un canvas a medida que redimensionamos la pantalla o que hace llamadas AJAX cuando un usuario teclea en un cuadro de texto. Pueden provocar muchas llamadas innecesarias y sería muy útil poder limitar el número máximo de veces que permitimos hacer una llamada a ciertas funciones. Para conseguirlo puedes crear un método regulador. Es lo que vamos a ver en este artículo. [Más]

El mes pasado os hablaba aquí de una manera sencilla y soportada por todos los navegadores para acceder al portapapeles desde código JavaScript en el navegador. Es un método simple pero un poco engorroso de implementar, puesto que hay que seleccionar rangos en la página para poder copiar su contenido. Además, su implementación varía ligeramente de un navegador a otro porque no está estandarizada. Otra pega importante que tiene el método "clásico" es que es síncrono. Para solucionar todos estos problemas la W3C ha creado la Async Clipboard API. A continuación te cuento cómo sacarle partido. [Más]

Hasta no hace muchos años, facilitar programáticamente que la gente pudiera copiar (o cortar) contenido de una página para llevárselo al portapapeles no era tarea tan fácil. Es decir, si por ejemplo tenías un fragmento de código en tu página de contenidos, y querías ponerle un botón de "Copiar" para facilitar a tus visitantes su copiado al portapapeles, la cosa no era tan fácil. De hecho si querías asegurar que iba a funcionar en todos los navegadores debías recurrir al uso de Flash =:-O En la actualidad la forma de hacerlo está estandarizada y extendida, por lo que resulta más fácil, pero lo curioso es que lo complicado del caso no es tanto copiar al portapapeles sino cómo decidir qué es lo que se va a copiar, así como las pequeñas diferencias entre navegadores a la hora de hacerlo. En este artículo te lo cuento... [Más]