3 cosas que no sabes sobre matrices de JavaScript

Arrays son una característica ampliamente utilizada de los lenguajes de programación; son variables especiales que se puede utilizar para almacenar varios valores al mismo tiempo. Sin embargo, cuando se trata de JavaScript, tan fácil como es aprender, siempre hay más para explorar..

En esta publicación, veremos tres características menos conocidas pero importantes de los arreglos de JavaScript que quizás no conocías antes.

1. Agregar propiedades personalizadas a matrices

Si tuviera que buscar en Internet buscando una definición completa de las matrices de JavaScript, encontrará que casi todas las fuentes sin errores mostrarán la matriz como lo que es. De Verdad es, un objeto.

De hecho, casi todo lo que tratamos en JavaScript lo hará. resulta ser un objeto. Hay dos tipos de tipos de datos en JavaScript, primitivas y objetos, pero Los primitivos siempre están envueltos dentro de objetos..

Array, Función, Fecha, etc. son objetos JavaScript predefinidos que tienen métodos incorporados, propiedades y su propia sintaxis estandarizada.

Los arrays de JavaScript pueden tener tres tipos diferentes de propiedades:

1. Índices de una matriz tambien son propiedades
2. Propiedades incorporadas
3. Propiedades personalizadas puedes agregar por ti mismo

Los dos primeros son más conocidos, puede usarlos todos los días, pero veamos rápidamente antes de ver cómo puede agregar su propia propiedad personalizada a una matriz..

Índices como propiedades

Matrices de JavaScript utilizan el sintaxis de corchete, como var ary = ["naranja", "manzana", "lichi"];.

Los índices de elementos de matriz son básicamente propiedades donde el nombres de propiedades son siempre enteros no negativos.

los par índice-elemento de una matriz es similar a la par clave-valor de un objeto.

Los índices son una característica única del objeto Array y, a diferencia de sus otras propiedades integradas, pueden ser establecer con la sintaxis de los corchetes solo, como ary [3] = "melocotón";.

Propiedades incorporadas

Matrices también tienen propiedades incorporadas, como array.length. los longitud propiedad lleva un valor entero que denota la longitud de una matriz.

En general, las propiedades integradas se pueden encontrar con frecuencia en objetos de JavaScript predefinidos como matrices. Junto con los métodos incorporados, ayudan Personalice objetos genéricos para que los objetos se ajusten a diferentes necesidades..

Se puede acceder a las propiedades incorporadas con cualquiera de los dos object.key o la objeto ["clave"] sintaxis. Así que también puedes escribir ary ["longitud"] para acceder a la longitud de una matriz.

Crear propiedades personalizadas para el objeto de matriz

Ahora hablemos de añadiendo sus propias propiedades a matrices. Las matrices son objetos predefinidos que almacenan diferentes tipos de valores en diferentes índices.

Normalmente no hay mucha necesidad de agregar propiedades personalizadas a una matriz; Esta es una de las razones por las que a los principiantes no se les enseña sobre esta característica. De hecho, si desea tratar una matriz como un objeto normal agregándole pares clave-valor, también podría Usa un objeto normal para tu propósito. Pero, esto no significa que no haya casos especiales donde puede hacer uso del hecho de que una matriz es un objeto, agregándole una o más propiedades personalizadas.

Por ejemplo, puede agregar una propiedad personalizada a una matriz que identifica el "tipo" o la "clase" de sus elementos, Como puedes verlo en el siguiente ejemplo.

 var ary = ["naranja", "manzana", "lichi"]; ary.itemClass = "frutas"; console.log (ary + "are" + ary.itemClass); // "naranja, manzana, lichi son frutas" 

Tenga en cuenta que la propiedad personalizada que agrega a una matriz es enumerable, lo que significa que será recogido por bucles como el para ... en declaración.

2. Recorrer a través de elementos de matriz

Probablemente digas "Ya lo sé", lo cual es muy probable que ya sepas cómo pasar por los elementos de la matriz. Pero también es cierto que decir "bucle a través de elementos de matriz" es un poco abstracto, ya que en realidad lo que hacemos es índices de la matriz.

Dado que los índices de matrices solo están compuestos de enteros no negativos, iteramos un valor entero que normalmente comienza desde cero y termina en la longitud completa de la matriz, luego usamos ese valor iterado para acceder al elemento de la matriz en un índice dado.

Sin embargo, desde ECMAScript6, hay una manera de directamente en bucle a través de valores de matriz sin molestarse con los índices, y eso se puede hacer usando el para ... de lazo.

En una matriz, la para ... de el bucle recorrerá los elementos de la matriz en el orden de los indices, en otras palabras, se ocupará de iterar sobre los índices y conseguir una valor de matriz existente en un determinado índice. Este bucle es ideal si solo desea recorrer todos los elementos de la matriz y trabajar con ellos.

 var ary = ["naranja", "manzana", "lichi"]; para (deja el artículo de ary) console.log (artículo);  // "naranja", "manzana", "lichi" 

Para comparar, con el regular para bucle, obtenemos los índices en lugar de los valores como salida.

 var ary = ["naranja", "manzana", "lichi"]; para (var item = 0; item < ary.length; item++) console.log(item);  // 0, 1, 2

3. El número de elementos no es su longitud

Típicamente, cuando hablamos de la longitud de una matriz, pensamos que es el número de valor que contiene una matriz o la longitud que le hemos dado manualmente a la matriz. Sin embargo, en realidad, la longitud de una matriz depende de el mayor índice existente dentro de ella.

La longitud es un propiedad muy flexible. Ya sea que hayas arreglado previamente la longitud de una matriz o no, si sigues agregando valores a la matriz, su longitud sigue aumentando en consecuencia.

 var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6

En el ejemplo anterior, puede ver que le di a la matriz solo un valor en el índice 5, y la longitud se convierte en 6. Ahora, si piensa que al agregar un valor en el índice 5, la matriz creó los índices de 0 a 4 automáticamente. , entonces tu suposición es incorrecta. Hay realmente No existen índices de 0 a 4. en esa matriz. Puedes verificar esto usando el en operador.

 var ary = []; ary.length = 3; console.log (ary.length); // 3 ary [5] = "abcd"; console.log (ary.length); // 6 console.log (0 en ary); // falso

La matriz aria es lo que llamamos un matriz "dispersa", una matriz donde los índices no son creados continuamente, y tener brechas. El opuesto de una matriz "dispersa" es el matriz "densa" donde los índices existen continuamente en la matriz, y el número de elementos es el mismo que el longitud.

los longitud propiedad también es capaz de truncar una matriz, asegurándose de que el índice más alto presente en la matriz es siempre menos que sí mismo, como longitud siempre es numéricamente mayor que el índice más alto por defecto.

En el siguiente ejemplo, puede ver cómo perdemos el elemento en el índice 5 al disminuir el longitud del aria formación.

 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]); // indefinido

Otras lecturas

• 10 términos de JavaScript que ya deberías saber
• 4 declaraciones de Javascript no tan comunes pero útiles que deberías saber
• Optimización de código con JS Hint - una herramienta para alinear Javascript