Ordenar matrices en JavaScript

Sí, ya se que el título no parece prometer gran cosa. Ordenar una matriz en JavaScript es un simpleza. Basta con un matriz.sort() y, hala, ya está ordenada… ¿O no?. Sí, si se trata de una matriz “normal” de JavaScript. Sabemos que JavaScript, de forma nativa, sólo gestiona matrices unidimensionales, indexadas. Son un modelo de colección de datos inherentemente simple, en el que cada dato tiene un índice que lo identifica. Estos índices son numéricos, consecutivos, empezando desde 0. Realmente, es un modelo simple y, a la postre, insuficiente para cubrir muchas necesidades de hoy en día. Si quieres una matriz bidimensional, en realidad, lo que manejas es una matriz de matrices. Cada elemento de la matriz bidimensional es, a su vez, una simple matriz unidimensional. Además, si quieres una matriz asociativa, al estilo de las que maneja, por ejemplo, PHP, ya tienes que recurrir a parsear un objeto JSON. Y ahora viene lo bueno. Si tienes una matriz bidimensional asociativa (creada a partir de un JSON), y quieres ordenar sus elementos por uno de los campos de forma que se mantengan las relaciones de los demás elementos, ¿cómo hacerlo? Vamos a ello.

Prevalidar ficheros en el lado del cliente

A menudo nos encontramos con que, en un formulario, debemos incluir un campo que permita al usuario enviar archivos al servidor (imágenes, documentos pdf, etc). En los formularios tradicionales, una vez enviado el formulario se comprobaban los ficheros en el servidor (tipo de archivo, peso, etc). Esto supone un problema por cuanto que los archivos deben ser, necesariamente, enviados al servidor (con el consumo de recursos que esto conlleva) y, una vez allí, si no son adecuados, hay que volver a cargar el formulario, recuperando los datos ya enviados para que el usuario no deba teclearlos de nuevo. El problema se ve agravado con los campos de tipo file de HTML 5. Hasta HTML 4, estos campos sólo podían recibir un archivo cada uno, con lo que podíamos limitar el número de archivos que le permitíamos enviar al usuario, simplemente poniendo un campo de tipo file por cada archivo que esperamos. Esto era bastante engorroso. Con HTML 5 los campos de tipo file pueden llevar el atributo multiple, lo que permite, en un solo campo, enviar varios archivos. No obstante, debemos prever un mecanismo para limitar el número máximo de archivos.

Eliminar elementos en una matriz JavaScript

Las matrices en JavaScript son un recurso muy interesante (imprescindible, en muchos casos) a la hora de gestionar datos en el lado del cliente. Desafortunadamente, la gestión de matrices en JavaScript adolece de ciertas limitaciones importantes que los desarrolladores acostumbrados al backend y sus poderosas herramientas (léase PHP, por ejemplo) acusamos en gran manera. Sin embargo, sí cuentan con determinadas funcionalidades que es importante conocer. Una de estas, que vamos a tratar en este artículo, es la eliminación de un determinado elemento situado en un lugar concreto dentro de una matriz.

JavaScript 2015 (I). Introducción.

¿Qué es JavaScript 2015? Bueno. Empecemos por el principio. Parto de la base de que eres desarrollador web (ya sea profesional o aficionado) y que estás familiarizado con JavaScript. Seguro que estás harto de usarlo. Puede que sólo lo uses a nivel básico, o que seas un avezado escritor de códigos de script del lado del cliente. Da igual. La especificación de JavaScript ha permanecido (casi) inamovible durante más de cinco años. Eso, en este sector, es inconcebible. Las razones por las que esto ha ocurrido así son, básicamente, tres: En su origen, la versión 5 de JavaScript era mucho más potente y flexible de lo que la mayoría de la gente cree. Por esta razón, ya se sabía que duraría mucho tiempo. Las carencias que presentaba el lenguaje en sí eran suplidas, de largo, con el uso de frameworks que han ido apareciendo en el mercado, como Angular, MooTools o jQuery. Ciertos navegadores (y todos sabemos de cual hablo, ¿verdad, señor Gates?) han marcado siempre una tendencia involucionista al negarse a adaptar su operativa a las normailizaciones y especificaciones aprobadas por el consorcio. Dada la cuota de mercado que este navegador llegó a tener en su momento, era muy …

Seguir leyendo

JavaScript 2015 (II). Constantes y variables.

En este artículo vamos a introducir dos conceptos. Por una parte, la creación de constantes, algo que, hasta ahora, estaba vedado en JavaScript. Por otro lado veremos que las variables pueden emplearse de una forma constreñida al contexto de un bloque de código. Son novedades ligeras, pero que nos dan algunas posibilidades que, hasta esta versión, se encontraban reservadas a otros lenguajes. Además, nos servirán como introducción para los siguientes artículos.

JavaScript 2015 (III). Interpolación y mapas.

En este artículo vamos a conocer dos nuevas aportaciones del estándar 2015 de JavaScript para el manejo de datos. Se trata de las interpolaciones y los mapas. Ambos se refieren al manejo de objetos y de arreglos, es decir, variables complejas o colecciones de variables. Estas técnicas (o sus equivalentes similares) existen, desde hace mucho tiempo, en otros lenguajes como PHP o Java. Sin embargo, en JavaScript se echaban en falta. La nueva normalización llena completamente este vacío, si bien emplea una sintaxis peculiar. No sabemos si, en posteriores versiones del lenguaje, la sintaxis se aproximará más a la de otros lenguajes, o se mantendrá como propia de Javascript (aunque todo apunta a esto último). Nosotros vamos a conocer lo que tenemos ahora y si, en el futuro evoluciona, nos adaptaremos (aunque, insisto, la tendencia parece ser a mantener la notación actual).

JavaScript 2015 (IV). Conjuntos y desestructuración.

Como hemos venido viendo en los artículos anteriores, en JavaScript 6 existen muchas alternativas a los arreglos. Hasta la llegada de esta versión, contábamos con las matrices tradicionales de toda la vida, y para de contar. En JS6 contamos con otras opciones que nos permiten mayor flexibilidad a la hora de tratar con datos. En este artículo vamos a conocer los conjuntos y las desestructuraciones. A pesar de sus rimbombantes nombres, verás que son dos técnicas extremadamente simples de manejar, heredadas, como las anteriores, de otros lenguajes de alto nivel. Con este artículo dejaremos sentadas las bases para seguir profundizando en el conocimiento de la nueva versión de JavaScript.

JavaScript 2015 (V). Bucles for…of.

Cuando hablamos de bucles en JavaScript estamos acostumbrados a pensar en los tradicionales. bucles for de toda la vida (sin contar los while). El que haya indagado un poco más, sabes que existen más sintaxis de for que la que usamos siempre. Tienes algunos ejemplos interesantes en este artículo. La nueva especificación nos trae una nueva sintaxis de for para iterar sobre arreglos. Es una forma simpleficada de recorrer los elementos de una matriz, haciendo, con cada uno de ellos, lo que consideremos oportuno.

JavaScript 2015 (VI). Generadores.

Cuando estamos recorriendo un bucle nos encontramos, en ocasiones, con que, dada una condición o evento determinado, es necesario interrumpir la ejecución de dicho bucle, retornando el control al proceso JavaScript que lo invocó. Al mismo tiempo, es necesario conservar el valor de una variable (o de más de una) de tal modo que, cuando vuelva a invocarse el bucle, no se inicialice de nuevo, sino que conserve el valor que tenía. Esta es una necesidad que se nos ha dado a todos alguna vez y, dado que, hasta ahora, no era posible hacer esto, hemos obviado dicha necesidad, buscando soluciones alternativas, en ocasiones muy enrevesadas, para lograr el resultado deseado. Por primera vez, JavaScript nos ofrece la posibilidad de ejecutar un bucle, interrumpiendolo cuando sea necesario, y manteniendo los valores adquiridos en el mismo por una o más variables. Estas herramientas se conocen con el nombre de Generadores.

JavaScript 2015 (VII). Funciones de usuario.

Las funciones de usuario son imprescindibles en casi cualquier código javaScript y, hasta ahora, en nuestros desarrollos, han sido una inestimable aportación. JS6 añade nuevas funcionalidades, que otros lenguajes de alto nivel ya implementan desde hace años, permitiéndonos muchas más posibilidades. En este artículo vamos a conocer las características que el nuevo estándar nos ofrece, para que podamos incluirlas en nuestros códigos.