|
ЯваСкрипт: Массивы
Цель создания этой страницы — помощь в понимании, что такое массив, с помощью наглядных примеров. Для этого мной были выбраны два распрастраннёных варианта. Всё ниже написанное можно создать без помощи массивов, но если есть большое кол-во однотипных данных или функций, массивы могут позволить применить функции для обработки этих однотипных данных извлечённых функцией из массива, что приведёт к сокращению кода, а также удобству редактирования и обновления сайта. Представьте, на основе примера №2, что у вас в таблице несколько сотен строчек и десяток столбцов, для изменения цвета столбца в скрипте или добавления ещё олдного столбца вам потребуется внести изменения всего в одну строчку, а если бы вы это сделали на ХТМЛ полностью, то пришлось редактировать каждую строчку, неговоря о том, что размер кода скрипта + массив поменьше гигантской таблицы с кучей тегов таблицы и их свойств. К тому же к данной таблице которую генерит скрипт, можно прописать сортировку например, и много другого.
Массив + Алерт
Код скрипта:
<html>
<body>
<script type="text/javascript">
results = new Array ("one", "two", "three"); — создание массива состоящего из 3 элементов: one, two, three; присвоение имени массиву - results
results["one"] = "Нажата первая кнопка..."; — присвоение значения элементу массива
results["two"] = "Ты нажал вторую кнопку..."; — присвоение значения элементу массива
results["three"] = "А теперь, ты нажал третью кнопку..."; — присвоение значения элементу массива
— массив закончен(при желании можно добавить в него ещё элементы по аналогии), дальше функция
function echo (somevalue) { — функция которая должна напечать текст(значения элементов массива)
alert (results[somevalue]); — указание, что должно делаться, то что указано строкой выше, в алерт(alert)
}
</script>
.......................................................
Готовый файл со скриптом.
.......................................................
Массив + Цикл
Код:
<html>
<head>
<script type="text/javascript">
function makeObjectTable(name, object) {
document.writeln("<H2>Имя массива: " + name + "</H2>"); — document.writeln напишет, всё что будит задано внутри скобок () - написали заголовок: Имя массива: test
document.writeln("<TABLE BORDER=1>\n" + — document.writeln может создать не только текст, но и теги таблицы, готов первый ряд таблицы
" <TR><TH>Field<TH>Значение");
for(field in object) { — чтобы не писать к каждому элементу массива строчку, по типу предыдущей строки, воспользуемся оператором цикла, подобный пример связки - Цикл + Массив один из наиболее старых и распрастранённых приёмов в програмирвоании
document.writeln (" <TR><TD>" + field + — данная строка выводит занчение одного элемента массива + всё что написано в скобках (), функция FOR (предыдущая строка) повторяет эту строку для каждого элемента массива
"<TD>" + object[field]);
}
document.writeln("</TABLE>"); — пишем закрывающие теги таблицы
}
</script>
Я для удобства вынес этот ЯваСкрипт в отдельный файл, то есть сам скрипт в файле, а в HTML документе - <script type="text/javascript" src="script.js"></script>
Код массива полностью аналогичен массиву в начале страницы, который подробно разбирался.
.......................................................
Готовый файл со скриптом.
.......................................................
|
|