Многомерные массивы в JavaScript

⇐ ПредыдущаяСтр 24 из 36Следующая ⇒

В JavaScript многомерные массивы представляют собой массивы из массивов. Для получения доступа к элементу, скажем, двумерного массива, следует дважды указать оператор [].

Предположим, что переменная matrix представляет собой массив массивов целых чисел. Каждый из элементов matrix[j] представляет собой массив чисел. Для обращения к отдельному числу используем запись: matrix[j][k].

Пример. Используем для создания таблицы умножения двухмерный массив.

var matrix = new Array(10); // в матрице 10 строчек

for(var j = 0; j < matrix.length; j++)

matrix [j] = new Array(10); //d каждой строчке создали 10 столбцов

for(var row = 0; row < matrix.length; row++) {

for(col = 0; col < matrix [row].length; col++) {

matrix [row][col] = row*col; // заполнение элементов массива

}}

var rezult = matrix [6][4]; // результат умножения 24

Типичное использование двухмерного массива в JavaScript - создание массива опций пользовательского меню. Скажем, некоторым из опций главного меню соответствуют опции раскрывающегося подменю. Создадим массив, у которого длина соответствует числу опций главного меню. Элементами этого массива будут массивы наименований опций соответствующих им подменю.

mеnu = nеw Аrrаy();

mеnu[0] = nеw Аrrаy (" Опция 1.1", " Опция 1.2", ", " Опция 1.3" );

mеnu[1] = nеw Аrrаy (" Опция 2.1", " Опция 2. 2 " );

mеnu[2] = nеw Аrrаy(" Опция 3.1", " Опция 3.2", " Опция 3.3", " Опция 3.4" );

Для обращения к 1-й опции 2-го подменю, нужно написать:

menu[1][0] // значение равно " Опция 2.1";

Изменим конструкцию массива, чтобы он содержал и названия опций главного меню, и опций подменю:

mеnu = nеw Аrrау()

menu[0] = nеw Аrrау (" Меню1", " Меню2", " МенюЗ" );

menu [1] = nеw Аrrау ();

menu [1][0] = nеw Аrrау (" Опция 1.1". " Опция 1.2", " Опция 1.3" );

menu [1][1] = nеw Аrrау (" Опция 2.1", " Опция 2. 2 " );

menu [1][2] = nеw Аrrау (" Опция 3.1", " Опция 3. 2 " , " Опция З.3", " Опция 3.4" );

menu [0][1] // значение равно " Меню2"

menu [0][2] // значение равно " Меню3"

menu [1][1][0] // значение равно " Опция 2.1"

menu [1][2][3] // значение равно " Опция 3.2 "

Методы работы с массивами

В данном разделе рассмотрим методы, с помощью которых можно манипулировать элементами массивов.

join() – метод, преобразующий каждый из элементов массива в строку и объединяющий их. В качестве аргумента метода можно указывать необязательную строку, предназначенную для разделения отдельных элементов в итоговой строке. Если разделителя не указать, то для разделения по умолчанию используется запятая.

Пример.

var arr = [12, 23, 38]; // задан массив из трех элементов

var str = arr.join(); // значение str равно " 12, 23, 38"

str = arr.join("; " ); // str == " 12; 23; 38"

Как уже отмечалось ранее, метод Array.join() является обратным по отношению к строковому методу String.split(), разбивающему строки на элементы массива.

reverse() – метод, изменяющий порядок расположения элементов в массиве на противоположный. Данный метод не создает нового массива, а изменяет их порядок в исходном массиве.

Пример.

var arr = nеw Аrrау (1, 2, 3); // arr[0] = 1, arr[1] = 2, arr[2] = 3

arr.reverse(); // arr[0] = 3, arr[1] = 2, arr[2] = 1

var str = arr.jоin(); // str == " 3, 2, 1"

sort() – метод, сортирующий элементы массива на месте и возвращающий отсортированный массив. Если метод sort() вызывать без указания аргументов, он будет осуществлять сортировку элементов массива по алфавиту, для выполнения сравнения при необходимости преобразуя их временно в строковые значения.

var arr = nеw Аrrаy(" bаnаnа", " сhеrrу", " аррlе" );

arr.sort();

var str = arr.join(", " ); // str == " аррlе, bаnаnа, сhеrrу"

Если в составе массива имеется неопределенный элемент, он переносится в конец массива.

Для того, чтобы осуществить сортировку не в алфавитном порядке, а каком-то другом, передают методу sort() как аргумент функцию сравнения, задача которой является указания правила, по которому один из двух ее аргументов будет в отсортированном списке располагаться раньше. Если второму должен предшествовать первый аргумент, функция сравнения должна возвращать отрицательное значение. Если в отсортированном массиве первый аргумент должен следовать за вторым, то функция должна возвращать положительное число. Функция сравнения должна возвращать 0, если два значения являются эквивалентными, то есть их порядок не важен. Пример.

Произведем сортировку в числовом порядке.

var arr = [333, 44, 11111, 2222];

arr.sort(); // в алфавитном порядке: 11111, 2222, 333, 44

arr.sort(function(first, second) { //

return first - second; }); // Числовой порядок: 44, 333, 2222, 11111

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

Определяя другие функции сортировки, можно осуществлять самые разнообразные способы сортировки.

concat() – метод, создающий и возвращающий новый массив, в котором содержатся элементы исходного массива, дополненные значениями всех аргументов, указанных в методе concat(). В том случае, когда аргумент сам представляет собой массив, в итоговый массив добавятся его элементы. Но, следует обратить внимание, что рекурсии при разделении массивов из массивов не осуществляется.

var arr = [1, 2, 3];

arr.соncаt(4, 5) // результат [1, 2, 3, 4, 5]

arr. соncаt ([4, 5]); // результат [1, 2, 3, 4, 5]

arr. соncаt ([4, 5], [6, 7]) // результат [1, 2, 3, 4, 5, 6, 7]

arr. соncаt (4, [5, [6, 7]]) // результат [1, 2, 3, 4, 5, [6, 7]]

slice() – метод, возвращающий подмассив (фрагмент) исходного массива. У метода имеется два аргумента, которые указывают начало и конец возвращаемого подмассива. В возвращаемом массиве будут содержаться элементы, начиная с того, индекс которого указан первым аргументом, до того элемента, номер которого указан вторым аргументом, но не включая его.

Если указать единственный аргумент, в возвращаемом массиве будут содержаться элементы от позиции, определяемой аргументом, и до конца массива. Отрицательный аргумент указывает номер элемента массива с конца массива.

Пример.

var arr = [1, 2, 3, 4, 5];

arr.sliсе(0, 3); // вернет [1, 2, 3]

arr. sliсе (3); // вернет [4, 5]

arr. sliсе (1, -1); // вернет [2, 3, 4]

arr. sliсе (-3, -2); // вернет [3]

splice() - универсальный метод, который может быть использован и для добавления, и для удаления элементов массива, или для обеих операций одновременно. В результате работы метода исходный массив изменяется.

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

Пример.

var arr = [11, 22, 33, 44, 55, 66, 77, 88];

arr.splice(4); // вернет [55, 66, 77, 88]; arr станет равен [11, 22, 33, 44]

arr.splice(1, 2); // вернет [22, 33]; arr станет равен [11, 44, 55, 66, 77, 88]

После двух аргументов метода splice(), задающих подлежащие удалению элементы массива, могут следовать в любом количестве дополнительные аргументы, задающие вставляемые в массив элементы, начиная с индекса, заданного первым аргументом метода.

Пример.

var arr = [11, 22, 33, 44, 55];

arr.splice(2, 0, 'ab', 'cd'); /* вернет []; arr станет равен [11, 22, 'ab', 'cd', 33, 44, 55]*/

arr.splice(2, 2, [1, 2], 3); /* вернет ['ab', 'cd']; arr станет равен [11, 22, [1, 2], 3, 33, 44, 55] */

Следует учитывать тот факт, что метод splice() аргументы-массивы не разбивает на отдельные вставляемые элементы, а вставляет сам массив.

push() и pop() – методы, позволяющие использовать массивы как стеки. Метод push() добавляет в конец массива новые элементы и возвращает новую длину массива. Метод pop() удаляет последний элемент в массиве и возвращает в качестве результата работы удаленное значение.

Оба метода изменяют исходный массив. При использовании в коде комбинации методов push() и pop() в JavaScript можно с помощью массива создать стек с правилом обслуживания: «первым вошел – последним вышел».

Пример.

vаr stасk = []; // пустой стек

stасk.push(1, 2); // массив: [1, 2] вернет 2

stасk. рор (); // массив: [1] вернет 2

stасk.push(3); // массив: [1, 3] вернет 2

stасk.рор(); // массив: [1] вернет 3

stасk.push([4, 5]); // массив: [1, [4, 5]] вернет 2

stасk. рор () // массив: [1] вернет [4, 5]

stасk. рор (); // массив: [] вернет 1

unshift() и shift() – методы, работающие почти так же, как push() и pop(), но они вставка и удаление элементов осуществляется не в конце массива, а в начале.

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

Пример.

var arr = []; // arr: []

arr.unshift(1); // arr: [1] вернет 1

arr.unshift(22); // arr: [22, 1] вернет 2

arr.shift(); // arr: [1] вернет 22

arr.unshift(3, [4, 5]); // arr: [3, [4, 5], 1] вернет 3

arr.shift(); // arr: [[4, 5], 1] вернет 3

arr.shift(); // arr: [1] вернет [4, 5]

arr.shift(); // arr: [] вернет 1

При вызове метода unshift() с несколькими аргументами эти аргументы вставляются все сразу, а не по одному, как это происходит в методе splice(). То есть в итоговом массиве значения будут расположены в таком же порядке, в каком были записаны в списке аргументов при вызове метода.

toString() и toLocaleString() - методы, преобразующие каждый из элементов массива в строку и выводящие список полученных строк через запятую. Метод toString(), как уже отмечалось, имеется у любого объекта в JavaScript, и у массива в том числе. Обратите внимание, что в результате работы методов вокруг значений массива не остается ни квадратных скобок, ни каких-то других разделителей.

Пример.

[1, 2, 3].toString() // вернет '1, 2, 3'

[" а", " b", " с" ].tоString() // вернет 'а, b, c'

[1, [2, 'с']].tоString() // вернет '1, 2, с'

Метод toString() вернет такую же строку, как и метод join() в случае его вызова без параметров.

toLocaleString() – метод, при котором итоговые строки конкатенируются с использованием разделителя, специфического для региона.

Пример 1. Создание циклического баннера (слайд-шоу).

Создадим массив изображений, которые будут появляться на странице через некоторые промежутки времени.

< html>

< head>

< title> Смена изображений< /title>

< script language=" JavaScript" >

Slide = new Array("./pic/1.gif", "./pic/2.gif", "./pic/3.gif", "./pic/4.gif", "./pic/5.gif", "./pic/6.gif", "./pic/7.gif", "./pic/8.gif", "./pic/9.gif" );

//Изображения находятся во вложенной папке pic

k=0; Len=Slide.length;

function rotate(){

if (document.images){

k++;

if (k == Len) {

k=0; }

document.banner.src=Slide[k];

setTimeout (" rotate()", 1*1000);

} }

< /script> < /head>

< body onload=" rotate(); " >

< img src="./pic/1.gif" name=" banner" >

< /body> < /html>

Пример 2. Вывод случайного афоризма на странице. Случайный афоризм появляется при каждом обновлении страницы.

< html>

< head> < title> Случайный афоризм на странице< /title>

< script language=" JavaScript" >

quote= new Array();

author= new Array();

quote[quote.length]=" Одни едят, чтобы жить. Другие - живут, чтобы есть.";

author[author.length]=" Мольер";

quote[quote.length]=" Работа не волк, в лес не убежит";

author[author.length]=" Народная мудрость";

quote[quote.length]=" Узкий специалист подобен флюсу.";

author[author.length]=" Кoзьма Прутков";

quote[quote.length]=" Скорость процессоров каждые два года удваивается.";

author[author.length]=" Не помню";

quotes = new Array();

quotes = [quote, author]

function getSay() {

var k=Math.floor(Math.random()*(quote.length));

var tmp=(" Афоризм " +quotes[0][k]+ " Автор: " +quotes[1][k]+" < br> " );

return tmp; }

< /script>

< /head>

< body > < center>

< script language=" JavaScript" > document.write(getSay())< /script>

< /center>

< /body>

< /html>

Объект Date

В JavaScript объект Date предназначен для работы со значениями даты и времени. Создается экземпляр объекта конструктором Date() с использованием оператора new.

var nеw_day = new Date(); /* Создан экземпляр объекта, в котором хранится информация о текущем времени и дате (считываются показания системного времени компьютера). */

var Christmas = new Date(2016, 11, 25); /*Создан экземпляр объекта с датой Рождества. Номера месяцев отсчитываются с нуля, поэтому декабрь по порядку имеет номер 11 */

Методы, определенные для объекта Date(), позволяют устанавливать и сохранять различные значения времени и даты, выполнять над ними ряд действий с использованием либо локального времени, либо времени по Гринвичу (GMT).

Пример.

Christmas.setFullYear(xmas.getFullYear() + 1); /* Дата Рождества в следующем году */

var wееkdау = Christmas.getDay(); // День недели Рождества.

document.write(" Сегодня: " + nеw_day.toLocaleString()); // Строковое значение текущей даты и времени.

В JavaScript для объекта Date() определены функции (вызываются не через объект Date(), поэтому не методы, а функции) для преобразования даты, которая задана в числовой форме или в виде строки, во внутреннее представление в миллисекундах, использующееся в некоторых операциях с датами.

Конструктор при создании нового экземпляра объекта Date() можно использовать в следующих вариантах:

nеw Dаtе(); /*Конструктор Date() без аргументов создает объект, у которого значение равно текущей дате и времени. */

nеw Dаtе(число_миллисекунд); /* В конструкторе указано единственное числовое значение, оно используется как представление даты в миллисекундах, что аналогично такому значению, которое вернет метод getTime().*/

new Dаtе(дата_строковое_представление); /* Если в конструкторе указан один строковый аргумент, его рассматривают как строковое представление даты в формате, который принимает метод Date.parse(). */

new Dаtе(год, месяц, день, часы, минуты, секунды, миллисекунды); /* Конструктору может быть передано от двух до семи числовых аргументов, указывающих отдельные поля даты и времени. Кроме первых двух полей, указывающих год и месяц, все прочие аргументы являются необязательными. */

Date() может быть вызван как функция, без указания оператора new. В этом случае любые переданные аргументы игнорируются, возвращается текущие дата и время.

Укажем, какие значения могут принимать аргументы при использовании разных форм конструктора:

число_миллисекунд - количество миллисекунд в промежутке между нужной датой и полуночью 01 января 1970 года (UTC). Скажем, если аргумент равен 5000, будет создана дата, обозначающая пять секунд после полуночи 01.01.1970.

дата_строковое_представление – аргумент задает в виде строки дату и необязательное время. Строка должна быть указана в формате, понятном для метода Date.parse().

год - четыре цифры года. Для совместимости с более ранними реализациями JavaScript, если значение аргумент находится между 0 и 99, к его значению добавляется число 1900.

месяц - номер месяца: 0 соответствует январю, 11 - декабрю.

день - целое число от 1 до 31, означающее день месяца. Аргумент необязателен.

часы – целое число от 0, означающего полночь, до 23. Аргумент необязателен.

минуты – целое число от 0 до 59. Аргумент необязателен.

секунды. Секунды в минутах, указанные в виде целого от 0 до 59. Необязательный аргумент.

миллисекунды – количество миллисекунд, указанное в виде целого числа в пределах от 0 до 999. Аргумент необязателен.

⇐ Предыдущая 19 20 21 22 232425 26 27 28 Следующая ⇒