Далее на странице...
На этой странице оптимизированный код из последней части предыдущей практической задачи по работе с массивами будет использован для примера того, как работать с функциями в javascript.
Использование функций в javascript - Исходный код
Итак, ниже представлен код, который решает эту задачу по работе с массивами и отдельные фрагменты которого будут вынесены в функции.
<script type="text/javascript">
var anyNumber = [42, 65, 49, 68, 56, 47, 70, 42, 51, 35, 58, 63, 40, 70];
var i = 0;
var maximum = 0;
while (i < anyNumber.length)
{
document.write("Индексу " + i + " - соответствует число " + anyNumber[i] + "<br />");
if (anyNumber[i] > maximum)
{
maximum = anyNumber[i]
}
i++;
}
document.write("Максимальное число массива: " + maximum + "<br>")
var empty = [];
for(i = 0; i < anyNumber.length; i++)
{
if(anyNumber[i] == maximum)
{
empty.push(i);
}
}
document.write("Позиции этого числа в массиве: " + empty);
</script>
Результат - Исходный вариант кода
Индексу 0 - соответствует число 42Индексу 1 - соответствует число 65
Индексу 2 - соответствует число 49
Индексу 3 - соответствует число 68
Индексу 4 - соответствует число 56
Индексу 5 - соответствует число 47
Индексу 6 - соответствует число 70
Индексу 7 - соответствует число 42
Индексу 8 - соответствует число 51
Индексу 9 - соответствует число 35
Индексу 10 - соответствует число 58
Индексу 11 - соответствует число 63
Индексу 12 - соответствует число 40
Индексу 13 - соответствует число 70
Максимальное число массива: 70
Позиции этого числа в массиве: 6,13
Первая функция
Сначала вынесем в функцию часть кода, которая в примере выше выделена жирным шрифтом. Этот фрагмент кода отвечает за вывод всех значений массива, а также за поиск его максимального значения.
<script type="text/javascript">
var anyNumber = [42, 65, 49, 68, 56, 47, 70, 42, 51, 35, 58, 63, 40, 70];
function max_Value(array)
{
var i = 0;
var maximum = 0;
while (i < array.length)
{
document.write("Индексу " + i + " - соответствует число " + array[i] + "<br />");
if (array[i] > maximum)
{
maximum = array[i]
}
i++;
}
return maximum;
}
var result_1 = max_Value(anyNumber);
document.write(result_1 + " - Максимальное значение массива");
var empty = [];
for(i = 0; i < anyNumber.length; i++)
{
if(anyNumber[i] == maximum)
{
empty.push(i);
}
}
document.write("Позиции этого числа в массиве: " + empty);
</script>
Результат - Использование функций - Шаг №1
Индексу 0 - соответствует число 42
Индексу 1 - соответствует число 65
Индексу 2 - соответствует число 49
Индексу 3 - соответствует число 68
Индексу 4 - соответствует число 56
Индексу 5 - соответствует число 47
Индексу 6 - соответствует число 70
Индексу 7 - соответствует число 42
Индексу 8 - соответствует число 51
Индексу 9 - соответствует число 35
Индексу 10 - соответствует число 58
Индексу 11 - соответствует число 63
Индексу 12 - соответствует число 40
Индексу 13 - соответствует число 70
Максимальное число массива: 70
Комментарии к коду (красным помечены изменения в исходном коде):
-
Итак, в примере была создана функция max_Value с одним параметром array function max_Value(array), в которую заключен код, выделенный жирным шрифтом.
В конце функции, при помощи оператора return мы возвращаем переменную maximum return maximum .
Затем вызываем функцию max_Value и в качестве ее параметра вместо array указываем исходный массив anyNumber. Результат работы функции заносим в переменную result_1 var result_1 = max_Value(anyNumber).
Далее выводим переменную result_1 на экран.
Но теперь мы видим иной (не полный) результат исполнения скрипта, чем в исходном варианте кода: мы определили максимальное число массива, но нет позиций (индексов) этого числа.
Вторая функция
Теперь следующий фрагмент кода (представлен ниже) из предыдущего примера необходимо преобразовать в функцию. Он предназначен для определения позиций (индексов) максимального значения массива.
var empty = [];
for(i = 0; i < anyNumber.length; i++)
{
if(anyNumber[i] == maximum)
{
empty.push(i);
}
}
<script type="text/javascript">
var anyNumber = [42, 65, 49, 68, 56, 47, 70, 42, 51, 35, 58, 63, 40, 70];
function max_Value(array)
{
var i = 0;
var maximum = 0;
while (i < array.length)
{
document.write("Индексу " + i + " - соответствует число " + array[i] + "<br />");
if (array[i] > maximum)
{
maximum = array[i]
}
i++;
}
return maximum;
}
var result_1 = max_Value(anyNumber);
document.write(result_1 + " - Максимальное значение массива");
function index_max_Value(array)
{
var empty = [];
for(i = 0; i < array.length; i++)
{
if(array[i] == result_1)
{
empty.push(i);
}
}
return empty;
}
var result_2 = index_max_Value(anyNumber);
document.write("<p> Позиции этого числа в массиве: " + result_2);
</script>
Результат - Использование функций - Шаг №2
Индексу 0 - соответствует число 42
Индексу 1 - соответствует число 65
Индексу 2 - соответствует число 49
Индексу 3 - соответствует число 68
Индексу 4 - соответствует число 56
Индексу 5 - соответствует число 47
Индексу 6 - соответствует число 70
Индексу 7 - соответствует число 42
Индексу 8 - соответствует число 51
Индексу 9 - соответствует число 35
Индексу 10 - соответствует число 58
Индексу 11 - соответствует число 63
Индексу 12 - соответствует число 40
Индексу 13 - соответствует число 70
Максимальное число массива: 70
Позиции этого числа в массиве: 6,13
Комментарии к коду:
Создаем вторую функцию index_max_Value с параметром array:
function index_max_Value(array).Функция index_max_Value возвращает массив, который содержит индексы (позиции) максимального значения исходного массива: return empty.
Затем вызываем функцию index_max_Value, а в качестве ее параметра вместо array указываем исходный массив anyNumber. Результат работы функции заносим в переменную result_2
var result_2 = index_max_Value(anyNumber).Далее выводим переменную result_2 на экран.
Обратите внимание: в теле функции index_max_Value в условии if текущее значение исходного массива сравнивается с результатом работы функции max_Value - с переменной result_1 (а это в свою очередь переменная maximum): if(array[i] == result_1).
После чего, если условие верно, индекс текущего значения исходного массива заносится в ранее созданный массив empty: empty.push(i).
Повторное использование функций
Теперь, когда отдельные фрагменты кода вынесены в функции, их можно применять как шаблоны для повторного использования уже с другими массивами.
Для повторного использования функций возьмем другой произвольный массив test и подставим его вместо параметра array при вызове функций.
<script type="text/javascript">
var test = [1, 4, 6, 9, 2, 7, 9];
//First function
function max_Value(array)
{
var i = 0;
var maximum = 0;
while (i < array.length)
{
document.write("Индексу " + i + " - соответствует число " + array[i] + "<br />");
if (array[i] > maximum)
{
maximum = array[i]
}
i++;
}
return maximum;
}
var result_1 = max_Value(test);
document.write(result_1 + " - Максимальное значение массива")
//Second function
function index_max_Value(array)
{
var empty = [];
for(i = 0; i < array.length; i++)
{
if(array[i] == result_1)
{
empty.push(i);
}
}
return empty;
}
var result_2 = index_max_Value(test);
document.write("<p> Позиции этого числа в массиве: " + result_2);
</script>
Результат - Повторное испльзование функций - Шаг №3
Индексу 0 - соответствует число 1
Индексу 1 - соответствует число 4
Индексу 2 - соответствует число 6
Индексу 3 - соответствует число 9
Индексу 4 - соответствует число 2
Индексу 5 - соответствует число 7
Индексу 6 - соответствует число 9
9 - Максимальное значение массива
Позиции этого числа в массиве: 3,6
Использование функций в javascript - Тонкости и Нюансы
Существуют определенные тонкости при использовании функций. Далее рассмотрим одну из них.
В примерах на этой странице проводилась работа с оптимизированным кодом из предыдущего практического занятия, отдельные фрагменты которого были вынесены в функции.
Но вернемся к другому варианту кода также из предыдущего практического занятия. Ниже Вы видите этот код, правда здесь он уже работает с использованием функций.
<script type="text/javascript">
var anyNumber = [42, 65, 49, 68, 56, 47, 70, 42, 51, 35, 58, 63, 40, 70];
//First function
function all_Value(array)
{
var i = 0;
while(i < array.length)
{
document.write("Индексу " + i + " - соответствует число " + array[i] + "<br />");
i++;
}
}
//Second function
function max_Value(array)
{
var i = 0;
var maximum = 0;
while (i < array.length)
{
if (array[i] > maximum)
{
maximum = array[i]
}
i++;
}
return maximum;
}
var result_1 = max_Value(anyNumber);
//Third function
function index_Max_Value(array)
{
var empty = [];
for(i = 0; i < array.length; i++)
{
if(array[i] == max_Value(array))
{
empty.push(i);
}
}
return empty;
}
var result_2 = index_Max_Value(anyNumber);
all_Value(anyNumber);
document.write("Максимальное число массива: " + result_1 + "<br>");
document.write("Позиция максимального числа в массиве: " + result_2 + "<br>");
</script>
Результат - Использование функций - Тонкости и Нюансы - Шаг №4
Индексу 0 - соответствует число 42
Индексу 1 - соответствует число 65
Индексу 2 - соответствует число 49
Индексу 3 - соответствует число 68
Индексу 4 - соответствует число 56
Индексу 5 - соответствует число 47
Индексу 6 - соответствует число 70
Индексу 7 - соответствует число 42
Индексу 8 - соответствует число 51
Индексу 9 - соответствует число 35
Индексу 10 - соответствует число 58
Индексу 11 - соответствует число 63
Индексу 12 - соответствует число 40
Индексу 13 - соответствует число 70
Максимальное число массива: 70
Позиция максимального числа в массиве: 6,13
Так вот, обратите внимание на то, что во 2-ой функции из последнего или предпоследнего примеров (текущей страницы) допустимо и используется сравнение: if(array[i] == result_1), но не допустимо следующее: if(array[i] == max_Value(array)).
if(array[i] == result_1) - здесь в сравнении со значением текущего элемента массива используется только возвращаемое функцией max_Value значение переменной maximum.
if(array[i] == max_Value(array)) - здесь же в сравнении используется весь результат работы функции max_Value.
В то время как в текущем (выше представленном) примере допустимы оба варианта сравнения.
Проанализируйте эту ситуацию с использованием функций и массивов в javascript самостоятельно. Это полезно для практики.