Array

L'objecte de JavaScript Array és un objecte global que s'utilitza per a construir arrays; que són objectes d'al nivell que representen llistes.

Crear un Array

var fruites = ["Poma", "Pera"];

console.log(fruites.length);
// 2

Accedir (mitjançant la posició) a un element d'un Array

var primer = fruites[0];
// Poma

var ultim = fruites[fruites.length - 1];
// Pera

Recòrrer un Array

fruites.forEach(function (element, index, array) {
  console.log(element, index);
});
// Poma 0
// Pera 1

Afegir elements al final d'un Array

var nouTamany = fruites.push("Taronja");
// ["Poma", "Pera", "Taronja"]

Eliminar l'element del final d'un Array

var ultim = fruites.pop(); // Elimina Taronja (del final)
// ["Poma", "Pera"];

Eliminar l'element de l'inici d'un Array

var primer = fruites.shift(); // elimina Poma del principi del Array
// ["Pera"];

Afegir un element a l'inici d'un Array

var nouTamany = fruites.unshift("Maduixa") // Afegir al principi
// ["Maduixa", "Pera"];

Trobar la posició d'un element del Array

fruites.push("Mango");
// ["Maduixa", "Pera", "Mango"]

var pos = fruites.indexOf("Pera");
// 1

Eliminar un element segons la seva posició

var elementEliminat = fruites.splice(pos, 1); // així és com s'elimina un element
// ["Maduixa", "Mango"]

Copiar un Array

var shallowCopy = fruits.slice(); // així és com es copia
// ["Maduixa", "Mango"]

[element0, element1, ..., elementN]
new Array(element0, element1[, ...[, elementN]])
new Array(longitudArray)

elementN

S'inicialitza un array de JavaScript amb els elements donats, excepte si només es proporciona un sol argument al constructor Array i aquest argument és un nombre. (Vegeu a sota). Cal destacar que aquest cas especial només s'aplica a arrays de JavaScript creats mitjançant el constructor Array i no a literals array creats a partir de ls sintaxi de claus.

longitudArray

Si només es passa un sol argument al constructor Array i aquest argument és un nombre entre 0 2³²-1 (inclòs), aquest retorna un nou array de JavaScript amb la longitud especificada pel nombre passat com a argument. Si l'argument és qualsevol altre nombre es llença l'excepció RangeError.

Els arrays són objectes semblants a lliste el prototipus dels quals té mètodes que permeten realitzar operacions de travessa i mutació. Ni a longitud ni el tipus dels elements són fixos en els arrays de JavaScript. Com que el tamany d'un array pot canviar en qualsevol moment no es pot garantir la seva densitat. En general aquestes característiques són convenients; però si en algun cas aquestes característiques no fossin convenients es recomana considerar l'ús de arrays amb tipus.

Algunes persones creuen que no s'hauria de fer ús de arrays com amb finalitats associatives. En qualsevol cas sempre es pot utilitzar senzillament un objects per a tal fet instead, tot i que fer-ho també té els seus inconvenients. Vegeu el post Diccionaris de JavaScript lleugers amb claus arbitràries per a exemple.

Els arrays de JavaScript comencen el compte de posició (índex) amb el zero: és a dir, el primer element d'un array ocupa la posició 0 i l'últim element d'un array es troba a l'índex amb valor del  tamany de l'array menys 1.

var arr = ['aquest és el primer element', 'aquest és el segon element'];
console.log(arr[0]);              // mostra 'aquest és el primer element'
console.log(arr[1]);              // mostra 'aquest és el segon element'
console.log(arr[arr.length - 1]); // mostra 'aquest és el segon element'

Els elements d'un array són propietats de l'objecte de la mateixa que toString és una propietat, però intentar accedir un element d'un array de la manera que es mostra a continuació llença un error de sintaxi, ja que el nom de la propietat no és vàlid:

console.log(arr.0); // error de sintaxi

No hi ha res d'especial sobre els arrays de JavaScript i les propietats que causen aquest comportament. A JavaScript, les propietats que comencen amb un dígit no es poden referenciar amb la notació de punt; per a accedir-hi és necesari utilitzar la notació de claus. Per exemple, per a accedir a la propietat anomenada '3d' d'un objecte, l'única forma d'accedir-hi és mitjançant la notació de claus tal i com es mostra a continuació:

var anys = [1950, 1960, 1970, 1980, 1990, 2000, 2010];
console.log(anys.0);   // error de sintaxi
console.log(anys[0]);  // funciona

renderer.3d.setTexture(model, 'character.png');     // error de sintaxi
renderer['3d'].setTexture(model, 'character.png');  // funciona

Fixeu-vos que a l'exemple de 3d, '3d' necessita cometes. És possible utilitzar cometes amb les posicions d'un array (per exemple, anys['2'] en comptes de anys[2]), tot i que no és necesari. El 2 a anys[2] és transformat en un string pel motor de JavaScript implícitament mitjançant el mètode toString. Per aquesta raó '2' i '02' es referirien a dues propietats diferents de l'objecte anys i l'exemple següent podría retornar true:

console.log(anys['2'] != anys['02']);

De la mateixa manera, les propietats d'objectes que utilitzin paraules clau com a nom(!) només es poden accedir mitjançant literals string en notació de claus (però poden accedir-se mitjançant notació de punt com a mínim al firefox 40.0a2):

var promise = {
  'var'  : 'text',
  'array': [1, 2, 3, 4]
};

console.log(promise['array']);

La propietat length dels arrays de JavaScript està relacionada amb les propietats numèriques. Diversos mètodes pertanyent de forma nativa a l'objecte array (com ara join, slice, indexOf, etcètera.) tenen en compte el valor de la propietat length quan són cridats. Altres mètodes, com ara push o splice, també actualitzen el valor de la propietat length.

var fruites = [];
fruites.push('banana', 'poma', 'prèssec');

console.log(fruites.length); // 3

A l'hora d'assignar una propietat a un array de JavaScript, quan la propietat és una posició vàlida i aquesta posició cau fora dels límits que l'array té en aquell moment, el motor ha d'actualitzar la propietat length de l'array apropiadament:

fruites[5] = 'mango';
console.log(fruites[5]); // 'mango'
console.log(Object.keys(fruites));  // ['0', '1', '2', '5']
console.log(fruites.length); // 6

Incrementant la longitud amb length.

fruites.length = 10;
console.log(Object.keys(fruites)); // ['0', '1', '2', '5']
console.log(fruites.length); // 10

Decrementar la propietat length, per contra, elimina elements.

fruites.length = 2;
console.log(Object.keys(fruites)); // ['0', '1']
console.log(fruites.length); // 2

Aquest comportament s'explica amb més detall a la pàgina de Array.length.

El resultats obtinguts a l'aplicar una expressió regular sobre un string poden crear un array de JavaScript. Aquest array tindrà propietats i elements que ofereixen informació sobre les coincidències. Aquest tipus d'arrays és retornat pels mètodes RegExp.exec, String.match, i String.replace. Per a ajudar a entendre aquestes propietats i elements, vegeu l'exemple següent i la taula a continuació:

// Cerca una d seguida d'una o més b's seguides d'una d
// Desa les coincidències de b's amb una d a continuació
// No distingeix entre majúscules i minúscules

var myRe = /d(b+)(d)/i;
var myArray = myRe.exec('cdbBdbsbz');

Les propietats i elements retornats d'aplicar aquesta expressió regular al string són les següents:

Array.length

La propietat de longitud del constructor de Array. El seu valor és 1.

Array.prototype

Permet l'adició de propietats a tots els objectes array.

Array.from()

Crea una nova instància de Array a partir d'un objecte iterable o un objecte similar a un array.

Array.isArray()

Retorna true si una variable és un array. En cas contrari retorna false.

Array.observe()

Observa de forma asíncrona canvis en Arrays, de manera similar al mètode Object.observe() per a objectes. Proporciona una sequència de canvis ordenats per ordre d'ocurrència.

Array.of()

Crea una nova instància de Array amb un nombre variable d'arguments, sense importar el nombre o tipus d'arguments.

Totes les instàncies de Array hereten de Array.prototype. L'objecte prototipus del constructor de Array es pot modificar per a afectar a totes les instàncies de Array a l'hora.

Mètodes de mutació

Mètodes d'accés

Mètodes d'iteració

De vegades hom voldria aplicar mètodes de array a strings o altres objectes semblants a arrays (com ara la funció arguments). Per a aconseguir això, es tractaria un string com un array de caràcters (o en tot cas tractar un objecte que no sigui un array com a array). Per exemple, per a comprovar que tots els caràcters d'una variable str són lletres, es faria de la forma següent:

function isLetter(character) {
  return character >= 'a' && character <= 'z';
}

if (Array.prototype.every.call(str, isLetter)) {
  console.log("El string '" + str + "' només conté lletres!");
}

Aquesta notació és força molesta i JavaScript 1.6 va introduïr una abreviació genèrica:

if (Array.every(str, isLetter)) {
  console.log("El string '" + str + "' només conté lletres!");
}

Generics també estan disponibles a String.

Aquests no formen actualment part de cap standard ECMAScript (tot i que es pot utilitzar el mètode Array.from() de l'ECMAScript 6 per a aconseguir el mateix resultat). A continuació es presenta una correcció de compatibilitat per a permetre el seu ús a qualsevol navegador:

// Asumeix que els extres de Array són presents (també es poden utilitzar funcions Polifyll per a suplir això)
(function() {
  'use strict';

  var i,
    // També es podria construïr l'array de mètodes de la forma següent, però
    //   el mètode getOwnPropertyNames() no té cap corrector de compatibilitat:
    // Object.getOwnPropertyNames(Array).filter(function(methodName) {
    //   return typeof Array[methodName] === 'function'
    // });
    methods = [
      'join', 'reverse', 'sort', 'push', 'pop', 'shift', 'unshift',
      'splice', 'concat', 'slice', 'indexOf', 'lastIndexOf',
      'forEach', 'map', 'reduce', 'reduceRight', 'filter',
      'some', 'every', 'find', 'findIndex', 'entries', 'keys',
      'values', 'copyWithin', 'includes'
    ],
    methodCount = methods.length,
    assignArrayGeneric = function(methodName) {
      if (!Array[methodName]) {
        var method = Array.prototype[methodName];
        if (typeof method === 'function') {
          Array[methodName] = function() {
            return method.call.apply(method, arguments);
          };
        }
      }
    };

  for (i = 0; i < methodCount; i++) {
    assignArrayGeneric(methods[i]);
  }
}());

L'exemple següent crea un array, msgArray, amb un tamany de 0, després assigna valors a les posicions msgArray[0] i msgArray[99], canviant automàticament el tamany de l'array a 100.

var msgArray = [];
msgArray[0] = 'Hello';
msgArray[99] = 'world';

if (msgArray.length === 100) {
  console.log('The length is 100.');
}

L'exemple següent crea un tauler d'escacs com a array bidimensional de strings. El primer moviement es realitza tot copiant la 'p' de la posició (6,4) a (4,4). La posició anterior esdevé buïda.

var board = [
  ['R','N','B','Q','K','B','N','R'],
  ['P','P','P','P','P','P','P','P'],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  [' ',' ',' ',' ',' ',' ',' ',' '],
  ['p','p','p','p','p','p','p','p'],
  ['r','n','b','q','k','b','n','r'] ];

console.log(board.join('\n') + '\n\n');

// Movem el peó del Rei endevant dues caselles
board[4][4] = board[6][4];
board[6][4] = ' ';
console.log(board.join('\n'));

Aquesta seria la sortida:

R,N,B,Q,K,B,N,R
P,P,P,P,P,P,P,P
 , , , , , , ,
 , , , , , , ,
 , , , , , , ,
 , , , , , , ,
p,p,p,p,p,p,p,p
r,n,b,q,k,b,n,r

R,N,B,Q,K,B,N,R
P,P,P,P,P,P,P,P
 , , , , , , ,
 , , , , , , ,
 , , , ,p, , ,
 , , , , , , ,
p,p,p,p, ,p,p,p
r,n,b,q,k,b,n,r

• Guia de JavaScript: “Indexar propietats d'objectes”
• Guia de JavaScript: “Objectes bàsics predefinits: L'objecte Array”
• Array comprehensions
• Polyfill per a Genèrics d'Array a JavaScript 1.8.5 i Array Extras a l'ECMAScript 5
• Arrays amb tipus