Array

Resum

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"]

Sintaxi

[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.

Descripció

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.

Accedir als elements d'un array

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']);

Relació entre `length` i propietats numèriques

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.

Crear un array utilitzant el resultat d'una expressió regular

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:

Propietat/Element	Descripció	Exemple
`input`	Propietat només de lectura que representa el string original contra el que s'ha aplicat la expressió regular.	cdbBdbsbz
`index`	Propietat només de lectura que representa la posició on s'ha trobat coincidència (considerant zero la primera posició)	1
`[0]`	element només de lectura que especifica els últims caràcters que han coincidit.	dbBd
`[1], ...[n]`	Elements només de lectura que especifiquen coincidències parcials en parèntesi, si aquests s'inclouen a l'expressió regular. El nombre de possibles coincidències parcials en parèntesi és il·limitat.	[1]: bB [2]: d

Propietats

For propietats available on Array instances, see Propietats of Array instances.

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.

Mètodes

For methods available on Array instances, see Methods of Array instances.

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.

Instàncies de `Array`

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.

Propietats

Array.prototype.constructor: Specifies the function that creates an object's prototype.
Array.prototype.length: Reflects the number of elements in an array.

Mètodes

Mètodes de mutació

These methods modify the array:

Array.prototype.copyWithin(): Copies a sequence of array elements within the array.
Array.prototype.fill(): Fills all the elements of an array from a start index to an end index with a static value.
Array.prototype.pop(): Removes the last element from an array and returns that element.
Array.prototype.push(): Adds one or more elements to the end of an array and returns the new length of the array.
Array.prototype.reverse(): Reverses the order of the elements of an array in place — the first becomes the last, and the last becomes the first.
Array.prototype.shift(): Removes the first element from an array and returns that element.
Array.prototype.sort(): Sorts the elements of an array in place and returns the array.
Array.prototype.splice(): Adds and/or removes elements from an array.
Array.prototype.unshift(): Adds one or more elements to the front of an array and returns the new length of the array.

Mètodes d'accés

These methods do not modify the array and return some representation of the array.

Array.prototype.concat(): Returns a new array comprised of this array joined with other array(s) and/or value(s).
Array.prototype.includes(): Determines whether an array contains a certain element, returning true or false as appropriate.
Array.prototype.join(): Joins all elements of an array into a string.
Array.prototype.slice(): Extracts a section of an array and returns a new array.
Array.prototype.toSource(): Returns an array literal representing the specified array; you can use this value to create a new array. Overrides the Object.prototype.toSource() method.
Array.prototype.toString(): Returns a string representing the array and its elements. Overrides the Object.prototype.toString() method.
Array.prototype.toLocaleString(): Returns a localized string representing the array and its elements. Overrides the Object.prototype.toLocaleString() method.
Array.prototype.indexOf(): Returns the first (least) index of an element within the array equal to the specified value, or -1 if none is found.
Array.prototype.lastIndexOf(): Returns the last (greatest) index of an element within the array equal to the specified value, or -1 if none is found.

Mètodes d'iteració

Several methods take as arguments functions to be called back while processing the array. When these methods are called, the length of the array is sampled, and any element added beyond this length from within the callback is not visited. Other changes to the array (setting the value of or deleting an element) may affect the results of the operation if the method visits the changed element afterwards. While the specific behavior of these methods in such cases is well-defined, you should not rely upon it so as not to confuse others who might read your code. If you must mutate the array, copy into a new array instead.

Array.prototype.forEach(): Calls a function for each element in the array.
Array.prototype.entries(): Returns a new Array Iterator object that contains the key/value pairs for each index in the array.
Array.prototype.every(): Returns true if every element in this array satisfies the provided testing function.
Array.prototype.some(): Returns true if at least one element in this array satisfies the provided testing function.
Array.prototype.filter(): Creates a new array with all of the elements of this array for which the provided filtering function returns true.
Array.prototype.find(): Returns the found value in the array, if an element in the array satisfies the provided testing function or undefined if not found.
Array.prototype.findIndex(): Returns the found index in the array, if an element in the array satisfies the provided testing function or -1 if not found.
Array.prototype.keys(): Returns a new Array Iterator that contains the keys for each index in the array.
Array.prototype.map(): Creates a new array with the results of calling a provided function on every element in this array.
Array.prototype.reduce(): Apply a function against an accumulator and each value of the array (from left-to-right) as to reduce it to a single value.
Array.prototype.reduceRight(): Apply a function against an accumulator and each value of the array (from right-to-left) as to reduce it to a single value.
Array.prototype.values(): Returns a new Array Iterator object that contains the values for each index in the array.
Array.prototype[@@iterator](): Returns a new Array Iterator object that contains the values for each index in the array.

Mètodes genèrics de `Array`

Els genèrics de Array no formen part de cap standard, estan en desús i poden ser esborrats en el futur. Noteu que no funcionen a tots els navegadors, tot i que hi ha una correcció de compatibilitat disponible a GitHub.

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]);
  }
}());

Exemples

Crear un array

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.');
}

Crear un array de dues dimensions (bidimensional)

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

Especificacions

Especificació	Estat	Comentaris
ECMAScript 1st Edition (ECMA-262)	Standard	Definició inicial.
ECMAScript 5.1 (ECMA-262) The definition of 'Array' in that specification.	Standard	S'afegeixen més mètodes: `Array.isArray`, `indexOf`, `lastIndexOf`, `every`, `some`, `forEach`, `map`, `filter`, `reduce`, `reduceRight`
ECMAScript 2015 (6th Edition, ECMA-262) The definition of 'Array' in that specification.	Standard	S'afegeixen més mètodes: `Array.from`, `Array.of`, `find`, `findIndex`, `fill`, `copyWithin`

Característica	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Suport bàsic	(Yes)	(Yes)	(Yes)	(Yes)	(Yes)

Característica

Android

Chrome for Android

Firefox Mobile (Gecko)

IE Mobile

Opera Mobile

Safari Mobile

Suport bàsic

(Yes)

Vegeu també

Document Tags and Contributors

Contributors to this page: enTropy

Last updated by: enTropy, 30 set. 2015, 6:02:33

Array

Resum

Sintaxi

Descripció

Accedir als elements d'un array

Relació entre length i propietats numèriques

Crear un array utilitzant el resultat d'una expressió regular

Propietats

Mètodes

Instàncies de Array

Propietats

Mètodes

Mètodes de mutació

Mètodes d'accés

Mètodes d'iteració

Mètodes genèrics de Array

Exemples

Crear un array

Crear un array de dues dimensions (bidimensional)

Especificacions

Compatibilitat amb navegadors

Vegeu també

Document Tags and Contributors

Learn the best of web development

Thanks! Please check your inbox to confirm your subscription.

Relació entre `length` i propietats numèriques

Instàncies de `Array`

Mètodes genèrics de `Array`