Lo que vas a encontrar...
Las matrices, array o arreglos son una característica ampliamente utilizada de lenguajes de programación; son variables especiales que se pueden utilizar para almacenar varios valores al mismo tiempo. Sin embargo, cuando se trata de los Array en JavaScript, es bastante fácil para aprender, aun así hay mucho por explorar 😉
En este articulo, vamos a echar un vistazo a tres importantes características que pocos conocen sobre los arreglos de JavaScript, y es posible que haya por lo menos uno que no conozcas.
1. Agregar propiedades personalizadas a los Array en JavaScript
Casi todo lo que nos ocupamos en JavaScript va a llegar a ser un objeto. Hay dos clases de tipos de datos en JavaScript, primitivas y objetos, pero primitivas siempre están envueltos en objetos.
Los Array, funciones, fecha, etc., son objetos predefinidos de JavaScript que se han incorporado en los métodos, propiedades y su propia sintaxis normalizada.
Los arrays en JavaScript pueden tener tres tipos diferentes de propiedades:
- Los índices de una matriz también son propiedades
- Propiedades integradas
- Las propiedades personalizadas se pueden añadir por sí mismas
Los dos primeros son más conocidas, es posible que las uses todos los días, pero vamos a ver de forma rápida antes de saltar en cómo se puede añadir su propiedad personalizada a un array.
Índices como propiedades
Las matrices de JavaScript usan la sintaxis de corchetes, como var nombre= ["naranja", "manzana", "lichi"];.
Los índices de elementos de la matriz son básicamente las propiedades donde los nombres de propiedad son siempre números enteros no negativos.
El par de índice de elemento de una matriz es similar a la par clave-valor de un objeto.
Los índices son una característica única del objeto Array, ya diferencia de su otro propiedades integradas, que se pueden configurar con la sintaxis soportes solos, como nombreArreglo[3] = «melocotón»;.
Construyendo Propiedades
Las matrices también se han incorporado en las propiedades, como Array.length. La propiedad de longitud lleva a un valor entero que indica la longitud de una matriz.
En general, una función de las propiedades se pueden encontrar con frecuencia en los objetos predefinidos de JavaScript como matrices. Junto con los métodos incorporados, ayudan a personalizar los objetos genéricos para que los objetos son aptos para diferentes necesidades.
Las propiedades integradas se pueden acceder ya sea con el object.key o el objeto [«llave»]. Así también se puede escribir nombreVariable[«length»] para acceder a la longitud de una matriz.
Crear propiedades personalizadas para el objeto de matriz
Ahora, vamos a hablar de la adición de sus propias propiedades de las matrices. Las matrices son objetos predefinidos que almacenan diferentes tipos de valores en diferentes índices.
No hay por lo general mucho necesidad de agregar propiedades personalizadas a una matriz; esta es una de las razones principiantes por lo general no se les enseña acerca de esta característica. De hecho, si usted quiere tratar una matriz como un objeto normal, mediante la adición de pares de valores clave a la misma, que también podría utilizar un objeto normal para su propósito. Sin embargo, esto no quiere decir que no hay casos especiales donde se puede hacer uso del hecho de que una matriz es un objeto, mediante la adición de una o más propiedades personalizadas a ella.
Por ejemplo, puede agregar una propiedad personalizada a una matriz que identifica el «tipo» o la «clase» de sus elementos, como se puede ver en el siguiente ejemplo.
|
1 2 3 4 5 |
var nombreArreglo= ["naranja","manzana","banano"]; nombreArreglo.itemClass = "frutas"; console.log(nombreArreglo+ " son" + nombreArreglo.itemClass); // "naranja,manzana,bananoare frutas" |
Tenga en cuenta que la propiedad personalizada que se agrega a una matriz es enumerable, lo que significa que será recogido por los bucles tales como la sentencia for.
2. Ciclos mediante los elementos de matriz
Es probable que diga «esto ya lo sé», y tal vez sea así. Pero también es cierto decir un «bucle a través de elementos de la matriz» es un poco abstracto, ya que en realidad son ciclos a través de los índices de la matriz.
Dado que los índices de matriz único se componen de números enteros no negativos, iteramos un valor entero generalmente a partir de cero y terminando en toda la longitud de la matriz, a continuación, utilizar ese valor iterado para acceder al elemento de matriz a un índice dado.
Sin embargo, desde ECMAScript6, hay una forma de bucle directamente a través de valores de la matriz sin molestarse con los índices, y que se puede hacer mediante el uso del ciclo for.
«La sentencia for crea una iteración del bucle sobre los objetos iterables (incluyendo Array, Map, Set, String, TypedArray, argumentos objeto y así sucesivamente), invocando una iteración personalizado con sentencias que se ejecutarán por el valor de cada propiedad distinta. – MDN «
En una matriz, la sentencia for a través de los elementos de la matriz en el orden de los índices, en otras palabras, se hará cargo de la iteración en los índices y obtendrá un valor de matriz existente en un determinado índice. Este bucle es ideal si lo que desea es recorrer todos los elementos de la matriz, y trabajar con ellos.
|
1 2 3 4 5 6 |
var nombre= ["naranja","manzana","durazno"]; for (let item of nombre){ console.log(item); } // "naranja", "manzana", "durazno" |
En comparación con el bucle clásico, se obtienen los índices en lugar de los valores como la salida.
|
1 2 3 4 5 6 |
var nombre = ["naranja","manzana","durazno"]; for (var item = 0; item < nombre.length; item++){ console.log(item); } // 0, 1, 2 |
3. El número de elementos no es su longitud
Por lo general, cuando hablamos de la longitud de una matriz, pensamos que es ya sea el número (como valor) de una matriz, o la longitud que hemos dado a la matriz de forma manual. Sin embargo, en la realidad, la longitud de una matriz depende del índice mayor existente dentro de ella.
La longitud es una propiedad muy flexible. Tanto si ya has arreglado la longitud de una matriz de antemano o no, si se mantiene la adición de los valores de la matriz, su longitud sigue aumentando en consecuencia.
|
1 2 3 4 5 6 7 8 |
var ary = []; ary.length = 3; console.log(ary.length); // 3 ary[5] = "abcd"; console.log(ary.length); // 6 |
En el ejemplo anterior, se puede ver que di a la matriz sólo un valor en el índice 5, y la longitud se convierte 6. Ahora, si usted piensa que mediante la adición de un valor en el índice 5, la matriz creó los índices de 0 a 4 automáticamente , a continuación, su suposición es incorrecta. En realidad no hay índices existentes de 0 a 4 en la matriz. Esto se puede comprobar mediante el operador in.
|
1 2 3 4 5 6 7 8 9 10 11 |
var ary = []; ary.length = 3; console.log(ary.length); // 3 ary[5] = "abcd"; console.log(ary.length); // 6 console.log(0 in ary); // false |
La matriz ary es lo que se llama una matriz de «dispersa», una matriz en donde los índices no se crean de forma continua, y tienen espacios «vacios». Lo contrario de un array «disperso» es la matriz «densa» donde existen índices de forma continua en la matriz, y el número de elementos son los mismos que la longitud.
La propiedad de longitud también es capaz de truncar una matriz, asegurándose de que el índice más alto presente en la matriz es siempre menor que él, como la longitud siempre es numéricamente mayor que el más alto índice de forma predeterminada.
En el siguiente ejemplo, se puede ver cómo perdemos el elemento en el índice 5 al disminuir la longitud de la matriz ary.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 |
var ary = []; ary.length = 3; console.log(ary.length); // 3 ary[5] = "abcd"; console.log(ary.length); // 6 ary.length = 2; console.log(ary.length); // 2 console.log(ary[5]); // undefined |
