Время чтения: Около 2 мин. Веб-разработка

Зачем нужны циклы и условия в JavaScript

Зачем нужны циклы и условия в JavaScript

Преподаватель программы JavaScript в Эльбрус Буткемп Юлия Тарасова на примере объясняет, зачем нужны циклы и условия в этом языке программирования и как они помогают упростить разработку. Этот материал — часть подготовки к пре-курсу  по JavaScript.

Разберем работу цикла JS на примере. Напишем функцию поиска Search, которая принимает два параметра: массив и целевое значение.

function search (arr, target) {
 for (let i = 0; i < arr.length; i++) {
   const element = array[index];
}
}


Функция должна возвращать индекс целевого элемента. Если передать в нее функцию и задать 11 как целевой элемент, она должна вернуть его индекс. Элементы в массиве считаются начиная с нуля, поэтому в данном случае это будет 2. Если передать 10, то индекс, соответственно, будет 3.

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

Если бы мы не знали о существовании циклов, функция выглядела бы так: 

function search (arr, target) {
  if (test [0] ==== target) return 0
  if (test [1] ==== target) return 1
  if (test [2] ==== target) return 2
  if (test [3] ==== target) return 3
  if (test [4] ==== target) return 4
  if (test [5] ==== target) return 5
}


Это вариант очень ограничен: представьте, что ваш массив состоит из 300 элементов, каждый их которых нужно прописывать вручную.

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

function search (arr, target) {
 for (let i = 0; i < arr.length; i++) {
    const element = array[index];
}
}

Разберем цикл: он состоит из условия индекса, с которого начинается отсчет (0) и ограничения количества итераций длиной массива, по которому проходит цикл. Далее задаем шаг массива — с каждой итерацией значение i увеличивается на единицу.

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

Под циклом можно проводить проверку: если текущий элемент равен целевому значению, возвращаем его индек. Если мы дошли до конца и ни разу не вышли из цикла, функция возвращает -1. Это будет означать, что нужного элемента нет в массиве:

function search (arr, target) {
  for (let i = 0; i < arr.length; i++) {
    if (arr [i] === target) return i
} return -1
}
console.log(search (test, 56));

Если запустить этот код, мы получим 0. Если введем вместо 56 10, то получим индекс 3. В случае, если мы введем число, которого нет в этом массиве, в выводе консоли мы увидим -1.

На этом примере хорошо видно, для чего нужны циклы и условия JavaScript — они значительно упрощают работу с данными и сокращают время на выполнения программы.

Катрин Алимова

Катрин Алимова