§06. Массивы. Обработка данных.
Массив – это набор данных. Другими словами можно сказать, что массив – это коллекция каких либо значений. Каждое такое значение называется элементом массива. У каждого элемента есть свой порядковый номер, который называется индексом элемента.
В отличие от других языков программирования в JavaScript в одном массиве могут находиться значения разных типов. С одной стороны это делает язык более гибким, увеличивая возможности. С другой стороны это возлагает дополнительную ответственность на программиста, который должен сам контролировать значения, которые записываются в массив.
Создаётся массив так же, как и обычная переменная с помощью слова var, только после имени массива ставятся знак равно и квадратные скобки, в которых через запятую перечисляются значения элементов. К формированию имён массивов предъявляются те же требования, что и к именам переменных. Пример:
<![CDATA[var m = [12,43,32];
]]>
В данном примере создан массив с именем m, в котором содержатся три элемента со значениями 12, 43 и 32 соответственно.
Если значения элементов заранее не известны, то их можно не писать, указав только нужное количество запятых:
<![CDATA[var m = [,,];
]]>
В данном примере так же создан массив с тремя элементами, которые не имеют значений.
После того, как массив создан, в каждый его элемент можно записывать значения. Так же эти значения можно считывать. Для этого в квадратных скобках необходимо указать индекс (порядковый номер) того элемента массива, который необходим. Причём, индекс первого элемента имеет значение ноль. Пример:
<![CDATA[m[0] = 12;
m[1] = 43;
m[2] = 32;
document.write(m[0]);
document.write(m[1]);
document.write(m[2]);
]]>
В качестве индекса элемента можно указывать переменную или выражение, в результате вычисления которого должно получиться целое число. Пример:
<![CDATA[var i = 1;
document.write(m[i]);
document.write(m[i]);
]]>
Если количество элементов заранее неизвестно, то при создании массива можно в квадратных скобках ничего не писать:
<![CDATA[var m = [];
]]>
Создание массива случайных чисел.
При тестировании программ часто возникает необходимость в наборе каких либо данных. Для этого, как правило, создают массив случайных значений. Далее пример программы, которая создаёт и выводит в окно браузера массив случайных чисел:
<![CDATA[<script>
//Функция генерации случайного числа от 0 до 100
function int_random()
{
return Math.round(Math.random()*100);
}
var random_mass = [];//Случайный массив
//Заполняем массив
for (var c = 0; c < 10; c = c+1)
random_mass[c] = int_random();
//Выводим массив на экран
for (var c = 0; c < 10; c = c+1)
document.write('random_mass[',c,'] = ',random_mass[c],'<br>');
</script>
]]>
Сортировка данных в массиве.
Сортировкой массива называется перемещение элементов внутри массива таким образом, что бы в конечном итоге они располагались в порядке возрастания или убывания их значений.
Существуют различные алгоритмы сортировок. Здесь мы рассмотрим один из них. Для его реализации будем просматривать каждый элемент массива и сравнивать его со следующим. Если следующий элемент окажется меньше, то будем менять элементы местами. Когда будут просмотрены все элементы, начнём снова просмотр с первого элемента, и так же будем менять местами, если последующий элемент больше. И так до тех пор, пока массив не окажется полностью отсортированным.
Далее приведём блок-схему алгоритма сортировки массива:
На схеме приняты следующие обозначения:
- b – переменная для хранения информации о том, попались ли не отсортированные элементы при просмотре всего массива;
- с – переменная счётчик для доступа к элементам массива;
mass – сам массив;
- size_m – количество элементов в массиве.
На основе данной блок-схемы можем написать программу. Для того, что бы алгоритм сортировки стал более ясен, заставим программу выводить промежуточные результаты сортировки. Далее код получившейся программы:
<![CDATA[<script>
//функция генерации случайного числа от 0 до 100
function int_random()
{
return Math.round(Math.random()*100);
}
var mass = []; //Массив
var size_m = 4; //Размер массива
//Функция вывода массива в окно браузера
function write_mass()
{
for (var c = 0; c < size_m; c = c+1)
document.write('mass[',c,'] = ',mass[c],'<br>');
document.write('<br>');
}
//Заполняем массив
for (var c = 0; c < size_m; c = c+1)
mass[c] = int_random();
//Выводим массив в окно браузера
document.write('Первоначальный массив:<br>');
write_mass();
//Сортировка массива
var b;//если массив не отсортирован, то равна 1
var count_while = 0;//Количество проходов цикла while
var count_change = 0;//Количество раз замены элементов местами
do {
b = 0;//Обнуляем переменную
count_while = count_while +1;//номер прохода
for (var c = 0; c < (size_m-1); c = c+1)
{
//Если элемент больше следующего
if (mass[c] > mass[c+1])
{
count_change = count_change +1;
b = 1;
//Меняем элементы местами
var temp = mass[c];
mass[c] = mass[c+1];
mass[c+1] = temp;
//Выводим результат замены местами элементов
document.write('Замена местами элементов №',count_change,'<br>');
document.write('Были заменены элементы ',c,' и ',c+1,'<br>');
write_mass();
}
}
//Выводим промежуточный вид массива в цикле while
document.write('Результат ',count_while,' прохода цикла while<br>');
write_mass();
} while (b>0)
</script>
]]>
Далее результат в виде текста. Кому не совсем понятен алгоритм работы программы рекомендую просмотреть этот текст внимательно:
<![CDATA[Первоначальный массив:
random_mass[0] = 19
random_mass[1] = 87
random_mass[2] = 7
random_mass[3] = 38
Замена местами элементов №1
Были заменены элементы 1 и 2
random_mass[0] = 19
random_mass[1] = 7
random_mass[2] = 87
random_mass[3] = 38
Замена местами элементов №2
Были заменены элементы 2 и 3
random_mass[0] = 19
random_mass[1] = 7
random_mass[2] = 38
random_mass[3] = 87
Результат 1 прохода цикла while
random_mass[0] = 19
random_mass[1] = 7
random_mass[2] = 38
random_mass[3] = 87
Замена местами элементов №3
Были заменены элементы 0 и 1
random_mass[0] = 7
random_mass[1] = 19
random_mass[2] = 38
random_mass[3] = 87
Результат 2 прохода цикла while
random_mass[0] = 7
random_mass[1] = 19
random_mass[2] = 38
random_mass[3] = 87
Результат 3 прохода цикла while
random_mass[0] = 7
random_mass[1] = 19
random_mass[2] = 38
random_mass[3] = 87
]]>
Задачи.
1. Создать массив случайных целых чисел со случайным количеством элементов. Найти в нём элемент с определённым значением. Если такой элемент в массиве существует, то вывести сообщении с его номером, если такого элемента нет, то вывести элемент с ближайшим значением.
2. Создать массив случайных целых чисел и инвертировать в нём элементы. Т.е. элемент, который был первым должен стать последним. Элемент, который был вторым должен стать предпоследним и т.д. Количество элементов должно быть случайным.
3. Создать программу сортировки массива по убыванию значений. За основу можете взять программу, приведённую в параграфе, убрав из неё вывод промежуточных результатов. Размер массива можете сделать случайным.
4. Создать массив с фамилиями и именами. В первом элементе должна содержаться фамилия, во втором – имя. Затем в третьем, и четвёртом снова фамилия и имя. И т.д. При таком принципе построения массива все элементы с чётными индексами, включая ноль, будут фамилиями, а все элементы с нечётными – именами.
Создать функцию вывода массива в окно браузера в виде таблицы.
Примечание для тех, кто подзабыл: для того, что бы вывести таблицу с рамкой, необходимо тэг table использовать с атрибутом border. Для того, что бы присвоить этому атрибуту значение внутри одинарных кавычек нужно пользоваться двойными. Пример:
<![CDATA['<table border = "2">'//Правильно
'<table border = '2'>'//Не правильно
]]>
Создать функции сортировки элементов по фамилии и имени. Создать программу, демонстрирующую их работу.
Примеры решений.
1.
<![CDATA[<script>
//Функция генерации случайного числа в диапазоне
function int_random_range(X,Y)
{
return Math.round((Math.random()*100)*(Y-X)/100)+X;
}
var mass = []; //Массив
var size_m = int_random_range(5,10); //Размер массива
//Функция вывода массива в окно браузера
function write_mass()
{
for (var c = 0; c < size_m; c = c+1)
document.write('mass[',c,'] = ',mass[c],'<br>');
document.write('<br>');
}
//Заполняем массив
for (var c = 0; c < size_m; c = c+1)
mass[c] = int_random_range(0,100);
//Выводим массив в окно браузера
document.write('Случайный массив из ',size_m,' элементов:<br>');
write_mass();
//Случайное число
var number = int_random_range(0,100);
//Выводим случайное число
document.write('Случайное число: ',number,'<br>');
//Ищем элемент со значением number
//переменная i будет содержать индекс нужного элемента
var i = -1;
for (var c = 0; c < size_m; c = c+1)
if (number == mass[c]) i = c;
if (i == -1)
/*Если i равна -1, то элемента со значением number нет
В таком случае ищем ближайший элемент и выводим его*/
{
var dif_min = 100;//Минимальная разность между элементом и number
for (var c = 0; c < size_m; c = c+1)
{
var dif = mass[c]-number;
if (dif < 0) dif = -1*dif;//Находим модуль dif
if (dif_min > dif)
{
dif_min = dif;
i = c;
}
}
//Выводим результат
document.write('Ближайшее значение имеет элемент mass[',i,']=',mass[i]);
}
else
/*Если i неравна -1, то элемент со значением number есть
В таком случае просто выводим результат*/
document.write('Элемент со значением ',number,' существует он имеет индекс ',i);
</script>
]]>
2.
<![CDATA[<script>
//Функция генерации случайного числа в диапазоне
function int_random_range(X,Y)
{
return Math.round((Math.random()*100)*(Y-X)/100)+X;
}
var mass = []; //Массив
var size_m = int_random_range(5,20); //Размер массива
//Функция вывода массива в окно браузера
function write_mass()
{
for (var c = 0; c < size_m; c = c+1)
document.write('mass[',c,'] = ',mass[c],'<br>');
document.write('<br>');
}
//Заполняем массив
for (var c = 0; c < size_m; c = c+1)
mass[c] = int_random_range(0,100);
//Выводим массив в окно браузера
document.write('Первоначальный массив из ',size_m,' элементов:<br>');
write_mass();
//Переставляем элементы местами
var temp;
for (var c = 0; c<(size_m/2); c = c+1)
{
temp = mass[c];
mass[c] = mass[size_m-c-1];
mass[size_m-c-1] = temp;
}
//Выводим получившийся массив
document.write('Получившийся массив:<br>');
write_mass();
</script>
]]>
4.
<![CDATA[<script>
var mass_SN = []; //Массив фамилий и имён
var size_mSN = 10; //Размер массива
//Функция вывода массива в окно браузера
function write_mass_SN()
{
document.write('<table border = "1">');
document.write('<tr><td><b>Фамилия</b></td><td><b>Имя</b></td></tr>');
for (var c = 0; c < size_mSN; c = c+2)
document.write('<tr><td>',mass_SN[c],'</td><td>',mass_SN[c+1],'</td></tr>');
document.write('</table>');
}
//Функция сортировки по фамилии
function sort_S()
{
var b;//Индикатор отсортированности
do {
b = 0;//Обнуляем индикатор
for (var c = 0; c < (size_mSN-2); c = c+2)
{
//Если элемент больше следующего
if (mass_SN[c] > mass_SN[c+2])
{
b = 1;
//Меняем элементы местами
var temp = mass_SN[c];
mass_SN[c] = mass_SN[c+2];
mass_SN[c+2] = temp;
temp = mass_SN[c+1];
mass_SN[c+1] = mass_SN[c+3];
mass_SN[c+3] = temp;
}
}
} while (b>0)
}
//Заполняем массив
mass_SN[0] = 'Иванов';
mass_SN[1] = 'Петр';
mass_SN[2] = 'Сидоров';
mass_SN[3] = 'Василий';
mass_SN[4] = 'Кузнецов';
mass_SN[5] = 'Виктор';
mass_SN[6] = 'Илюхин';
mass_SN[7] = 'Владислав';
mass_SN[8] = 'Петров';
mass_SN[9] = 'Иван';
//Выводим массив в окно браузера
document.write('Массив фамилий и имён:<br>');
write_mass_SN();
//Сортируем массив по фамилии
sort_S();
document.write('<br>После сортировки по фамилии:<br>');
write_mass_SN();
</script>
]]>
