Клавиша / esc
Рецепт по приготовлению еды, в виде карты по поиску клада с картинками
Иллюстрация: Кира Кустова

Порядок выполнения

JavaScript выполняет код в определённой последовательности. Разбираемся, в какой, и как это можно менять.

Время чтения: меньше 5 мин

Кратко

Скопировано

Порядок выполнения или поток выполнения (англ. control flow) — это порядок, в котором интерпретатор JavaScript выполняет написанные в коде инструкции.

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

Порядок выполнения можно менять с помощью управляющих конструкций if...else, while, switch, for и других.

Как понять

Скопировано

Последовательный поток выполнения программы интуитивно понятен:

        
          
          console.log('Привет')console.log('Я — вторая строка')
          console.log('Привет')
console.log('Я — вторая строка')

        
        
          
        
      

Код выше всегда выведет на экран сначала строку «Привет», а затем «Я — вторая строка». Какие бы инструкции мы ни написали, сначала выполнится инструкция выше по тексту, а затем — следующая за ней. Получается такая картинка:

Схема последовательного выполнения кода.

Последовательный порядок выполнения выполняет код строка за строкой сверху вниз.

Написать сложную программу, используя только последовательный порядок выполнения, невозможно:

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

Решать сложные задачи помогают управляющие конструкции. Они позволяют изменять порядок выполнения и получать другие результаты.

Условный переход

Скопировано

Условный переход или ветвление позволяет выполнять одну либо другую инструкцию в зависимости от условия:

Схема условного перехода.

Для этого в JavaScript используются конструкции:

Цикл

Скопировано

Циклический порядок или цикл позволяет многократно выполнять одну и ту же инструкцию с разными данными.

Циклы настолько важный элемент программирования, что мы написали про них отдельную статью 🔄.

Схема цикла.

Организовать цикл можно с помощью конструкций:

При разработке веб-приложений стандартных конструкций бывает недостаточно: при взаимодействии с внешним API мы не хотим тратить впустую ресурсы компьютера на ожидание ответа. Такие проблемы решают с помощью асинхронности, механизмы которой предоставляет браузер.