Управляющая конструкция if else является одним из основных инструментов программирования на JavaScript. Она позволяет контролировать поток выполнения кода в зависимости от условий. В данной статье мы рассмотрим основной синтаксис и принципы работы конструкции if else, а так же малоизвестные подробности, которые могут сделать ваш код более эффективным и удобным для чтения и поддержки.

Базовый синтаксис

Управляющая конструкция if else в базовом варианте представляет собой инструкцию if после которой в скобках указано условие за которым следует блок кода, который исполняется ели условие истинно (выражение возвращает true). Такой синтаксис применим для простых проверок с одним условием и выполняемым кодом в одну строку.

if (string) console.log(string);
//если строка string определена, она будет выведена в консоль
```Остальной код, написанный после такой конструкции не проверяется на условие, но мы можем, выполняя всего одну проверку, задать два сценария исполнения кода с помощью инструкции `else`. Блок кода, записанный после нее будет исполнен только в случае, если условие ложно (выражение в скобках после `if` возвращает `false`). При такой записи, блоки кода, кроме последнего, если он содержит всего одну строку, оборачиваются в фигурные скобки.

```ts
if (string) {
  console.log(string);
} else console.log("нет данных");
//сообщение об отсутсвии данных появится в консоли
//только если условие не выполнено
```Кроме того можно задать несколько условий скомбинировав инструкции `else` и `if`.

```ts
if (string === "John") {
  console.log("Hello, " + string + "!");
  //Если передана строка John - здороваемся
} else if (string === "Kate") {
  console.log("Wellcome back, " + string + "!");
  //Если Kate - поздравляем м возвращением
} else console.log("Hello, stranger!");
//в остальных случаях обращаемся как к незнакомцу
```Прекращение выполнения и инструкция Return
=============================================

При описании конструкции if else важно понимать что она исполняется строго по-порядку и если одно из условий оказалось истинным, остальные не будут проверяться и код после них не будет исполнен. Прекращение выполнения инструкции происходит автоматически и повлиять на него нельзя поэтому всегда следует продумывать порядок и описание условий.

```ts
if (string) {
  console.log("Есть какие-то данные");
  //если переменная string определена в консоли появится сообщение
} else if (string === "John") {
  console.log("Hello, " + string + "!");
  //В консоли никогла не появится приветсвие потому что, John
  //в качестве значения проверяемой переменной подходит под первое условие
  //и выполнение конструкции будет прекращено на предыдущем условии
}

```Хотя мы не можем контролировать завершение исполнения конструкции if else ни как кроме правильного порядка условий, сама эта конструкция отлично подходит для управления другими функциями. С помощью инструкции `return` внутри блока кода конструкции if else мы можем завершить выполнение функции и, при необходимости, указать ее выходные данные.

```ts
function changeValue(value) {
  //создаем функцию которая принимает значение
  let newValue = value;
  //создаем новую переменную и передаем в нее значение
  if (value) newValue = "значение изменено по условию";
  //ели значение было определено условие его изменит
  newValue = "значение изменено функцией";
  //функция продолжает работать и сново меняет значение
  return newValue;
}
function changeValueWithCondition(value) {
  let newValue = value;
  //создаем аналогичную функцию
  if (value) {
    newValue = "значение изменено по условию";
    return newValue;
    //на этот раз воспользуемся инструкцией return
  }
  newValue = "значение изменено функцией";
  //если значение было определено до попадания в функцию
  //этот код не будет выполнен
  return newValue;
}
let myValue = "какое-то значение";
console.log(changeValue(myValue)); //Выведет: значение изменено функцией
//первая функция продолжит работу после проверки и изменит значение еще раз
console.log(changeValueWithCondition(myValue)); //Выведет: значение изменено по условию
//вторая же завершит работу после выполнения условия
```Вложенные конструкции и способы их избежать
==============================================

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

```ts
const string = "John";
if (string) {
  //условие выполнено потому что значение переменной string определено
  if (string === 1) {
    console.log(1);
  } else if (string === 2) {
    console.log(2);
  } else if (string === 3) {
    console.log(3);
  }
  //остальные условия ложны и в консоли не появится ни каких сообщений
} else if (string === "John") {
  console.log("Hello, " + string + "!");
  //приветствие не появится в консоли
} else console.log("Нет данных");
//как и сообщение об отсутствии данных
```Код с множеством вложенных конструкций сложно читать и, как следствие, легко допустить ошибку в последовательности условий поэтому лучше их избегать комбинируя несколько условий в одной проверке, например, с помощью логических операторов. Так Ваш код будет лаконичным и снизится количество неучтенных условий.

```ts
if (string === 1 || string === 2 || string === 3) {
  //проверяем переменную на несколько значений в одном условии,
  //используя оператор логическое ИЛИ (||)
  console.log(string);
} else if (string === "John") {
  console.log("Hello, " + string + "!");
  //теперь остальные условия так же будут проверяться
  //а код легко и удобно читать
} else console.log("Нет данных");
```Заключение
=============

Конструкция if else является неотъемлемой частью каждого JavaScript-приложения, и понимание его особенностей и возможностей может позволить вам писать более гибкий и эффективный код. В этой статье мы рассмотрели ее базовый синтаксис использование нескольких блоков else if, влияние оператора return и применение логических операторов. Надеемся, что эти знания помогут вам принимать более информированные решения при использовании if else в вашем коде. Используйте эти подробности в своей практике, и вы увидите, как ваш код становится более чистым, понятным и эффективным.