En este tutorial, aprenderá sobre la matriz de JavaScript con la ayuda de ejemplos.
Como sabe, una variable puede almacenar un solo elemento. Si necesita almacenar varios elementos a la vez, puede usar una matriz.
Una matriz es un objeto que puede almacenar varios elementos . Por ejemplo,
const myArray = ('hello', 'world', 'welcome');
Crear una matriz
Puede crear una matriz de dos formas:
1. Usando un literal de matriz
La forma más sencilla de crear una matriz es utilizando un literal de matriz (). Por ejemplo,
const array1 = ("eat", "sleep");
2. Usando la nueva palabra clave
También puede crear una matriz utilizando la newpalabra clave de JavaScript .
const array2 = new Array("eat", "sleep");
En los dos ejemplos anteriores, hemos creado una matriz que tiene dos elementos.
Nota : se recomienda utilizar un literal de matriz para crear una matriz.
Aquí hay más ejemplos de matrices:
// empty array const myList = ( ); // array containing number values const numberArray = ( 2, 4, 6, 8); // array containing string values const stringArray = ( 'eat', 'work', 'sleep'); // multiple data types array const newData = ('work', 'exercise', 1, true);
También puede almacenar matrices, funciones y otros objetos dentro de una matriz. Por ejemplo,
const newData = ( ('task1': 'exercise'), (1, 2 ,3), function hello() ( console.log('hello')) );
Acceder a elementos de una matriz
Puede acceder a los elementos dentro de una matriz utilizando índices (0, 1, 2…) . Por ejemplo,
const myArray = ('h', 'e', 'l', 'l', 'o'); // first element console.log(myArray(0)); // "h" // second element console.log(myArray(1)); // "e" 
Indexación de matrices en JavaScript
Nota : El índice de Array comienza con 0, no 1.
Agregar un elemento a una matriz
Puede utilizar el método integrado push()y unshift()agregar un elemento a una matriz.
El push()método agrega un elemento al final de una matriz y devuelve la longitud de una nueva matriz. Por ejemplo,
let dailyActivities = ('eat', 'sleep'); // add an element at the end of the array dailyActivities.push('exercise'); console.log(dailyActivities); // ('eat', 'sleep', 'exercise')
El unshift()método agrega un nuevo elemento al comienzo de una matriz y devuelve la nueva longitud de una matriz. Por ejemplo,
let dailyActivities = ('eat', 'sleep'); //add an element at the end of the array dailyActivities.unshift('work'); console.log(dailyActivities); // ('work', 'eat', 'sleep', 'exercise'')
Cambiar los elementos de una matriz
También puede agregar elementos o cambiar los elementos accediendo al valor del índice.
let dailyActivities = ( 'eat', 'sleep'); // this will add the new element 'exercise' at the 2 index dailyActivities(2) = 'exercise'; console.log(dailyActivities); // ('eat', 'sleep', 'exercise')
Supongamos que una matriz tiene dos elementos. Si intenta agregar un elemento en el índice 3 (cuarto elemento), el tercer elemento no estará definido. Por ejemplo,
let dailyActivities = ( 'eat', 'sleep'); // this will add the new element 'exercise' at the 3 index dailyActivities(3) = 'exercise'; console.log(dailyActivities); // ("eat", "sleep", undefined, "exercise")
Básicamente, si intenta agregar elementos a índices altos, los índices intermedios tendrán un valor indefinido.
Eliminar un elemento de una matriz
Puede utilizar el pop()método para eliminar el último elemento de una matriz. El pop()método también devuelve el valor devuelto. Por ejemplo,
let dailyActivities = ('work', 'eat', 'sleep', 'exercise'); // remove the last element dailyActivities.pop(); console.log(dailyActivities); // ('work', 'eat', 'sleep') // remove the last element from ('work', 'eat', 'sleep') const removedElement = dailyActivities.pop(); //get removed element console.log(removedElement); // 'sleep' console.log(dailyActivities); // ('work', 'eat')
Si necesita eliminar el primer elemento, puede utilizar el shift()método. El shift()método elimina el primer elemento y también devuelve el elemento eliminado. Por ejemplo,
let dailyActivities = ('work', 'eat', 'sleep'); // remove the first element dailyActivities.shift(); console.log(dailyActivities); // ('eat', 'sleep')
Longitud de la matriz
Puede encontrar la longitud de un elemento (el número de elementos en una matriz) usando la lengthpropiedad. Por ejemplo,
const dailyActivities = ( 'eat', 'sleep'); // this gives the total number of elements in an array console.log(dailyActivities.length); // 2
Métodos de matriz
En JavaScript, hay varios métodos de matriz disponibles que facilitan la realización de cálculos útiles.
Algunos de los métodos de matriz de JavaScript más utilizados son:
| Método | Descripción |
|---|---|
| concat () | une dos o más matrices y devuelve un resultado |
| índice de() | busca un elemento de una matriz y devuelve su posición |
| encontrar() | devuelve el primer valor de un elemento de matriz que pasa una prueba |
| findIndex () | devuelve el primer índice de un elemento de matriz que pasa una prueba |
| para cada() | llama a una función para cada elemento |
| incluye () | comprueba si una matriz contiene un elemento especificado |
| empujar() | agrega un nuevo elemento al final de una matriz y devuelve la nueva longitud de una matriz |
| unshift () | adds a new element to the beginning of an array and returns the new length of an array |
| pop() | removes the last element of an array and returns the removed element |
| shift() | removes the first element of an array and returns the removed element |
| sort() | sorts the elements alphabetically in strings and in ascending order |
| slice() | selects the part of an array and returns the new array |
| splice() | removes or replaces existing elements and/or adds new elements |
Example: JavaScript Array Methods
let dailyActivities = ('sleep', 'work', 'exercise') let newRoutine = ('eat'); // sorting elements in the alphabetical order dailyActivities.sort(); console.log(dailyActivities); // ('exercise', 'sleep', 'work') //finding the index position of string const position = dailyActivities.indexOf('work'); console.log(position); // 2 // slicing the array elements const newDailyActivities = dailyActivities.slice(1); console.log(newDailyActivities); // ( 'sleep', 'work') // concatenating two arrays const routine = dailyActivities.concat(newRoutine); console.log(routine); // ("exercise", "sleep", "work", "eat")
Note: If the element is not in an array, indexOf() gives -1.
Visit JavaScript Array Methods to learn more.
Working of JavaScript Arrays
In JavaScript, an array is an object. And, the indices of arrays are objects keys.
Dado que las matrices son objetos, los elementos de la matriz se almacenan por referencia. Por lo tanto, cuando se copia un valor de matriz, cualquier cambio en la matriz copiada también se reflejará en la matriz original. Por ejemplo,
let arr = ('h', 'e'); let arr1 = arr; arr1.push('l'); console.log(arr); // ("h", "e", "l") console.log(arr1); // ("h", "e", "l")
También puede almacenar valores pasando una clave con nombre en una matriz. Por ejemplo,
let arr = ('h', 'e'); arr.name = 'John'; console.log(arr); // ("h", "e") console.log(arr.name); // "John" console.log(arr('name')); // "John" 
Indexación de matrices en JavaScript
Sin embargo, no se recomienda almacenar valores pasando nombres arbitrarios en una matriz.
Por lo tanto, en JavaScript, debe usar una matriz si los valores están en una colección ordenada. De lo contrario, es mejor usar object con ( ).
Artículos recomendados
- JavaScript para cada uno
- JavaScript para… de
- Matriz multidimensional de JavaScript
