Las colecciones indexadas son colecciones que tienen índices numéricos, es decir, las colecciones de datos que están ordenadas por un valor de índice. En JavaScript, una array es una colección indexada. Una array es un conjunto ordenado de valores que tiene un índice numérico. Por ejemplo, una array llamada ‘estudiante’ que contiene el nombre de los estudiantes y los valores del índice son los números de lista de los estudiantes. JavaScript no tiene un tipo de datos de array explícito. Sin embargo, podemos usar el objeto Array predefinido en JavaScript y sus métodos para trabajar con arrays. Creación de una array: hay muchas formas de crear e inicializar una array que se enumeran a continuación:
- Creación de arrays sin definir la longitud de la array. En este caso, la longitud es igual al número de argumentos.
var arr = new Array( element0, element1, ... ); var arr = Array( element0, element1, ... ); var arr = [ element0, element1, ... ];
- Crear una array con el tamaño dado
var arr = new Array(6); var arr = Array(6); var arr = []; arr.length = 6;
- Crea una array de longitud variable y agrega tantos elementos como necesites.
// First method: Initialize an empty // array then add elements var students = []; students [0] = 'Sujata Singh'; students [1] = 'Mahesh Kumar'; students [2] = 'Leela Nair'; // Second method: Add elements to // an array when you create it var fruits = ['apple', ‘mango', 'Banana'];
Acceso a los elementos de la array: use índices para acceder a los elementos de la array. Los índices de las arrays se basan en cero, lo que significa que el índice de los elementos comienza en cero.
javascript
<script> var fruits = ['Apple', 'Mango', 'Banana']; console.log(fruits [0]); console.log(fruits[1]); </script>
Producción:
Apple Mango
Obtención de la longitud de la array: para obtener la longitud de una array, use la propiedad array_name.length.
javascript
<script> var fruits = ['Apple', 'Mango', 'Banana']; console.log(fruits.length) </script>
Producción:
3
Iterando sobre arrays: hay muchas formas de iterar los elementos de la array.
- Uso de for loop: for loop proporciona una forma concisa de escribir la estructura del bucle. A diferencia de un bucle while, una instrucción for consume la inicialización, la condición y el incremento/decremento en una línea, lo que proporciona una estructura de bucle más corta y fácil de depurar.
javascript
<script> var fruits = ['Apple', 'Mango', 'Banana']; for (var i = 0; i < fruits.length; i++) { console.log(fruits[i]); } </script>
- Producción:
Apple Mango Banana
- Usando forEach() Loop : La función forEach() proporciona una vez para cada elemento de la array. La función proporcionada puede realizar cualquier tipo de operación en los elementos de la array dada.
javascript
<script> var fruits = ['Apple', 'Mango', 'Banana']; fruits.forEach( function(fruit) { console.log(fruit); }); </script>
Apple Mango Banana
- Usando forEach Loop con funciones de flecha:
javascript
<script> var fruits = ['Apple', 'Mango', 'Banana']; fruits.forEach(fruit => console.log(fruit)); </script>
Apple Mango Banana
Métodos de array: Hay varios métodos de array disponibles para trabajar en arrays. Estos son:
- Método push() : este método agrega uno o más elementos al final de una array y devuelve la longitud resultante de la array.
javascript
<script> var numbers = new Array('1', '2'); numbers.push('3'); console.log(numbers); </script>
- Producción:
["1","2","3"]
- Método pop() : este método elimina el último elemento de una array y devuelve ese elemento.
javascript
<script> var numbers = new Array('1', '2', '3'); var last = numbers.pop(); console.log(last); </script>
3
- Método concat() : este método une dos arrays y devuelve una nueva array.
javascript
<script> var myArray = new Array('1', '2', '3'); myArray = myArray.concat('a', 'b', 'c'); console.log(myArray); </script>
- Producción:
["1","2","3","a","b","c"]
- Método join() : este método crea una string uniendo todos los elementos de una array.
javascript
<script> var students = new Array('john', 'jane', 'joe'); var list = students.join(' - '); console.log(list); </script>
- Producción:
john - jane - joe
- Método sort() : este método ordena los elementos de una array.
javascript
<script> var myArray = new Array('West', 'East', 'South'); myArray.sort(); console.log(myArray); </script>
- Producción:
["East","South","West"]
- Método indexOf() : este método busca el elemento en la array y devuelve el índice de la primera aparición del elemento.
javascript
<script> var myArr = ['a', 'b', 'a', 'b', 'a']; console.log(myArr.indexOf('b')); </script>
- Producción:
1
- Método shift() : este método elimina el primer elemento de una array y devuelve ese elemento.
javascript
<script> var myArr = new Array('a', 'b', 'c'); var first = myArr.shift(); console.log(first); </script>
- Producción:
a
- método reverse() : este método invierte el primer elemento de la array se convierte en el último y el último se convierte en el primero. Transpone todos los elementos de una array de esta manera y devuelve una referencia a la array.
javascript
<script> var myArr = new Array('a', 'b', 'c'); myArr.reverse(); console.log(myArr); </script>
- Producción:
["c","b","a"]
- Método map() : este método devuelve una nueva array del valor devuelto al ejecutar la función en cada elemento de la array.
javascript
<script> var myArr1 = ['a', 'b', 'c']; var a2 = myArr1.map(function(item) { return item.toUpperCase(); }); console.log(a2); </script>
- Producción:
["A","B","C"]
- Método filter() : este método devuelve una nueva array que contiene los elementos para los que la función devolvió verdadero.
javascript
<script> var myArr1 = ['a', 10, 'b', 20, 'c', 30]; var a2 = myArr1.filter(function(item) { return typeof item === 'number'; }); console.log(a2); </script>
- Producción:
[10,20,30]