JavaScript - Урок 12. Массивы

Массив представляет собой набор элементов, доступ к которым осуществляется по индексу. Создается массив с помощью оператора new и конструктора массива - функции Array.

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

var users = new Array(" Artem", " Irina", " Sergey", " Boris" );

Это выражение создает массив из 4 элементов (пользователей). Все элементы массива, пронумерованы, начиная с нуля. Для получения значения элемента массива необходимо задать имя массива и в квадратных скобках порядковый номер элемента (его индекс). Так, для получения доступа к первому элементу нашего массива, можно написать так:

users[0]

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

var users = new Array(4);

Это выражение так же создает массив из 4 элементов, но значения элементов можно указать позже с помощью оператора присваивания:

users[0] = " Artem"; users[1] = " Irina"; users[2] = " Sergey"; users[3] = " Boris";

И, наконец, можно использовать конструктор без параметра:

var users = new Array();

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

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

users[users.length-1];

Т.е. сначала определяется длина массива (users.length), затем, помня о том, что нумерация элементов начинается с нуля, из длины вычитается 1 и полученное значение используется в качестве индекса массива.

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

Код html-страницы будет следующим:

< html> < head> < title> javascript массивы< /title> < link rel=" stylesheet" type=" text/css" href=" style.css" > < script type=" text/javascript" src=" script.js" > < /script> < /head> < body onload=" showDay(); " > < /body> < /html>

* в уроке 3 мы рассматривали события и их обработчики. В данном случае мы будем использовать событие Load (документ загружается в браузер) и его обработчик - onload. Иными словами, наша функция showDay() должна сработать при загрузке документа.*

Теперь напишем саму функцию showDay():

function showDay() { var nDays=new Array(" воскресенье", " понедельник", " вторник", " среда", " четверг", " пятница",                                                                                 " суббота" ); var now=new Date(); var day=now.getDay(); var iDay=nDays[day]; var str=" Сегодня - " + iDay; document.write(str); }

Рассмотрим подробнее. Сначала, мы создаем массив nDays из семи элементов (в предыдущем уроке, мы говорили о том, что нулю соответствует воскресенье):

   var nDays=new Array(" воскресенье", " понедельник", " вторник", " среда", " четверг", " пятница",                                                                                 " суббота" );   

Затем, из текущей даты получаем текущий день недели (его числовой эквивалент):

   var now=new Date();    var day=now.getDay();

и используем его в качестве индекса для обращения к элементу массива:

   var iDay=nDays[day];

Последние две строки формируют и отображают результат:

var str=" Сегодня - " + iDay; document.write(str);

Попробуйте работу сценария в действии и убедитесь, что при загрузке страницы, появляется фраза типа " Сегодня - пятница".

Двигаемся дальше. Два массива можно объединить в один с помощью метода concat(). Пусть у нас имеются два массива a и b и мы хотим их объединить в один - c:

    var a=new Array(1, 2, 3); var b=new Array(4, 5, 6); var c=a.concat(b);

На выходе получим массив c из шести элементов: 1, 2, 3, 4, 5, 6.

Массивы можно сортировать с помощью метода sort(), правда только в лексикографическом порядке (т.е. как строки). Например, если применить метод sort() к массиву с именами:

var users = new Array(" Artem", " Irina", " Sergey", " Boris" ); var c=users.sort();

то на выходе получим массив c: Artem, Boris, Irina, Sergey.

А если применить метод sort() к массиву с числами:

var n = new Array(11, 12, 10, 107, 3, 20, 25, 101, 14, 34, 44, 5, 4); var c=n.sort();

то на выходе получим следующий массив: 10, 101, 107, 11, 12, 14, 20, 25, 3, 34, 4, 44, 5. Т.е. элементы сравниваются как строки, а не как числа. Так что применять метод sort() надо осторожно.

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

Код html-страницы будет простой:

< html> < head> < title> javascript массивы< /title> < link rel=" stylesheet" type=" text/css" href=" style.css" > < script type=" text/javascript" src=" script.js" > < /script> < /head> < body> < form name=" forma10" > Введите имя для проверки: < input type=" text" size=" 20" name=" name" > < input type=" button" value=" Проверить" onClick=" proverka(forma10); " >    < /form> < /body> < /html>

Теперь напишем саму функцию proverka() на странице script.js:

function proverka(obj) { var k; var users = new Array(" Artem", " Irina", " Sergey", " Boris", " Olga", " Viktor" ); var n=obj.name.value; for (var i=0; i< =users.length-1; i++){ if (users[i]==n) {k=0; break} } if (k==0){alert(" Это имя присутствует в массиве." )} else {alert(" Такого имени в массиве нет." )}}

Здесь мы воспользовались алгоритмом, который называется линейный поиск, согласно которому все элементы массива users сравниваются поочередно с образцом (с n, т.е. с именем, которое ввел пользователь). Если очередной элемент совпадает с образцом, то задача решена (цикл прерывается). Если же искомого имени в массиве нет, то мы узнаем об этом, лишь просмотрев все элементы массива.

Введите имя для проверки:

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

⇐ Предыдущая45678910111213Следующая ⇒

Поделиться: