Массивы JavaScript можно создавать как объекты. При этом конструктору передаётся один или несколько параметров. Если передаётся один параметр числового типа, создаётся массив, содержащий соответствующее число количество элементов, естественно неопределённых. Если передаётся несколько параметров или один параметр несовместимого типа, эти параметры используются как элементы массива. Если вообще не заданы параметры, создаётся массив нулевой длины, т.е. совсем без элементов. В остальном работа с массивами не отличается от работы в других языках.
Например: arr = new Array(54,21,43,78,97,65)
Document.write(a[4]);
В результате будет напечатан четвёртый элемент массива – т.е. число 97 (нумерация начинается с 0).
Рассмотрим примеры работы с методами этого объекта. Пример_24
Создано два массива, заданных явно:
A = new Array(1,56,34,87,45);
B = new Array(33,68,44,90);
и один неопределённый массив:
C = new Array()
Выведем элементы массива:
document.write("Массив A =");
document.write(A);
document.write("<br>");
document.write("Массив B =");
document.write(B);
Таким образом, распечатать массив можно просто указав его имя.
Метод join(разделитель) возвращает строку, которая состоит из элементов массива (к которому применили метод) разделённых знаком, указанным в качестве параметра (разделитель должен быть заключён в кавычки):
n=A.join("==");
document.write("Строка, получившаяся в результате работы метода А.join ('=='): ");
document.write(n);
Метод pop( ) удаляет последний элемент в массиве и возвращает его:
A.pop();
document.write("Новый массив A - результат работы метода A.pop(): ");
document.write(A);
Метод push(список добавляемых элементов) добавляет в конец массива элементы. Заметим, что добавляемыми элементами могут быть и массивы, и элементы других типов:
n=B.push(A,45,"fgf");
document.write("Новый массив B - результат работы метода B.push(A,45,"fgf"): ");
document.write(B);
document.write("<br>");
document.write("Длина нового массива B: "+n);
Но с возвращаемым значением не так всё просто: в [1] утверждается, что метод возвращает новую длину массива, но следует учитывать следующее: если был добавлен массив, то он считается как один элемент, если даже он содержал большее количество элементов. Так в нашем примере новый массив выглядит следующим образом:
33,68,44,90,1,56,34,87,4,fgf
Ожидаемое значение, которое вернёт метод push() будет 10. Но практика показывает, что на самом деле будет возвращено 7. Массив А=[1,56,34,87] расценивается как один добавленный элемент.
Метод reverse не вызывает затруднений и его работа очевидна. Но следует учитывать, что он не изменяет последовательность элементов в «своём» массиве – он возвращает новый массив, в котором уже изменен порядок следования элементов.
Метод Shift() удаляет первый элемент массива и возвращает его.
Метод slice(index1, index2) возвращает массив, состоящий из элементов начиная с элемента с номером index1 исключительно до элементов с номером index2 включительно. Но при работе с этом методом необходимо быть осторожным: если массив к которому применим этот метод содержит элементы другого массива, добавленного методом push, то эти элементы считаются как один элемент:
Массив B=[ 4,1,56,34,87,90,44,68,33] – подчёркнутые элементы – это добавленный массив A (см.выше)
C=B.slice(3,7);
document.write("Новый массив C - результат работы метода C=B.slice(3,7);: ");
document.write(C);
В результате подчёркнутые элементы считаются как один элемент – в результате вместо ожидаемого массива C = [34,87,90,44] массив C = [44,68,33]
Метод splice(index1,col,[список элементов ч.з. запятую]) удаляет начиная c элемента с номером index1 сol элементов и вместо них вставляет элементы из списка. Возвращает массив удалённых элементов. Остальные методы либо не вызывают сложностей, либо аналогичны уже рассмотренным.
В основном массивы используются для хранения возможных значений свойств объектов, например цвета, размеры, наименования, координаты.
Рассмотрим пример, в котором массив используется для хранения значений цветов.
Пример 25
В этом примере изменяется цвет фона. Прежде чем начать изменять цвета необходимо занести их возможные значения в массив:
…
var colors=new Array("red","blue","green","purple","black","tan","red");
Таким образом, массив colors содержит 7 значений цветов. Теперь необходимо объявить переменную, которая указывала бы на номер цвета в массиве. Пусть она указывает на первый элемент массива, т.е. на цвет «red»:
var nc=0;
Теперь составим функцию, которая бы меняла фоновый цвет страницы. Принцип такой: установим фон таким цветом, на который в массиве colors указывает переменная nc. Затем, увеличив значение переменной nc на 1, заставим её указывать на следующий цвет в массиве. Снова вызываем функцию. Следует следить, чтобы значение nc не вышло за пределы размера массива colors. Очевидно, что значение nc не может быть более 7, поэтому если оно равно семи начинаем просмотр цветов в массиве с начала, т.е. обнуляем значение nc.
Итак, установим цвет фона таким, на какой цвет указывает nc в массиве colors:
document.bgColor=colors[nc];
увеличиваем значение nc на 1:
nc++
Теперь проверяем значение nc на то, чтобы оно не выходило за пределы размерности массива, если вышло – обнуляем:
if (nc==7) nc=0
Осталось вызвать снова функцию (функция st()) – это можно сделать, установив таймер, который будет вызывать функцию st каждые 500 миллисекунд:
window.setTimeout("st()",500);