Всё только о JavaScript

/ Статьи / Массивы в JavaScript

Добавление и удаление элементов

Добавлять элементы в массив, равно как и удалять их, можно также, как и обычные свойства любых других объектов. С тем лишь отличием, что при добавлении числовых свойств может изменятся свойство length, а при изменении свойства length могут удаляться числовые свойства. В общем случае алгоритм установки свойств у массивов примерно следующий:

var a = [0, 1, 2];
alert(a.length);  // 3
a[5] = 5;
alert(a.length);  // 6
delete a[5];
alert(a.length);  // 6: при удалении элементов length не изменяется.
a.length = 1;
alert([0 in a, 1 in a, 2 in a]);   // true,false,false: элементы с индексами 1 и 2 удалены
try {
    a.length = -1;
} catch (e) {
    alert(e.message);  // RangeError
}

Из того факта, что при установке length удаляются "лишние" элементы, следует способ очистки массива. Если вас по какой-то причине не устраивает присваивание переменной нового пустого массива, а нужно именно обнулить существующий, то достаточно присвоить его свойству length значение 0.

var a = [0, 1, 2, 3, 4, 5], b = a;
// Имеем две переменных, хранящих ссылки на один и тот же массив
a = [];    // Если сделаем так, то в a и b будут лежать ссылки на разные массивы
alert([a.length, b.length]);  // 0,6

var a = [0, 1, 2, 3, 4, 5], b = a;
a.length = 0; // Очистили массив, на который ссылаются значения обеих переменных
alert([a.length, b.length])   // 0,0

Методы push, pop, shift и unshift

Несмотря на то, что можно и вручную изменять элементы массива, рекомендуется использовать для этого встроенные методы, что будет гарантировать отсутствие пропусков в массиве и корректное значение свойства length. Корректное в том смысле, что оно будет равно количеству элементов массива.

Метод push добавляет переданные элементы в конец массива. Метод pop возвращает последний элемент массива и удаляет его.

var a = [];
a.push(5, 6, 7);
alert(a.length + ';' + a);  // 3;5,6,7
alert(a.pop());  // 7
alert(a.length + ';' + a);  // 2;5,6

Метод unshift добавляет переданные элементы в начало массива. Элементы будут располагаться в том же порядке, в каком они были переданы. Метод shift возвращает первый элемент массива и удаляет его.

var a = [1];
a.unshift(9, 8, 7);
alert(a.length + ';' + a);  // 4;9,8,7,1
alert(a.shift());  // 9
alert(a.length + ';' + a);  // 3;8,7,1

В Internet Explorer младше 8-й версии unshift возвращает undefined, во всех остальных браузерах — новое значение length. Так что лучше не надеяться на возвращаемое от unshift значение.

var a = [];
alert(a.unshift(1, 2, 3));   // IE 6,7: undefined
                             // IE8 и остальные: 3

Добавление/удаление элементов в середине массива

Метод splice имеет сигнатуру Array.prototype.splice(start, deleteCount [, item1 [, item2 [, ...]]]).

Он удаляет из массива deleteCount элементов начиная с индекса start. Если передано больше двух аргументов, то третий и последующие аргументы вставляются в массив заместо удалённых. Если start отрицательный, то индекс, с которого начнётся удаление, будет равен length + start. Возвращает массив из удалённых элементов. Таким образом с помощью метода splice можно удалять элементы из середины массива или добавлять произвольное количество в произвольное место массива.

var a = [0, 1, 2, 3, 4, 5, 6];
// Удалим три средних элемента
a.splice(2, 3);
alert(a);  // 0,1,5,6
// Добавим два элемена перед последним
a.splice(-1, 0, 7, 8);
alert(a);  // 0,1,5,7,8,6
// Заменим второй и третий элементы на три строки
a.splice(1, 2, 'a', 'b', 'c');
alert(a);  // 0,a,b,c,7,8,6

В простейшем случае, если нужно удалить элемент с индексом i, то нужно у массива вызвать метод splice с аргументами i и 1.

Вообще говоря, второй аргумент у метода splice необязательный, но поведение функции с одним аргументов отличается в разных браузерах.

Поэтому всегда следует передавать в этот метод как минимум два элемента.