Условные конструкции if else в JavaScript

Лекция про условные операторы

Конструкции условий дают возможность изменить ход работы программы в зависимости от условий, которые проверяются. Благодаря им мы можем создавать сложные программы, которые будут вести себя по-разному в различных сценариях.

if

Давайте создадим пример функции, которая определяет тип предложения, переданного в качестве аргумента. Изначально она будет различать обычные предложения от вопросительных.

const getTypeOfSentence = (sentence) => {
    const lastChar = sentence[sentence.length - 1];
    if (lastChar === '?') {
      return 'question';
    }
  
    return 'general';
  };
  
  getTypeOfSentence('Hodor');  // general
  getTypeOfSentence('Hodor?'); // question

                        

"if" - это конструкция в языке программирования, которая контролирует последовательность выполнения операций. Внутри скобок передается выражение-предикат, за которым следует блок кода в фигурных скобках. Этот блок кода выполняется только в случае если предикат равен true.

Если предикат возвращает false, то программа пропускает блок кода в фигурных скобках и продолжает выполнение. В данном примере выполнится следующая строка кода: return 'general'; - она заставит функцию вернуть строку и завершить работу. Можно заметить, что оператор return может быть использован в любом месте функции, включая блок кода с условием.

Если после оператора if идет только одна строка кода в фигурных скобках, их можно опустить, например:

const getTypeOfSentence = (sentence) => {
    const lastChar = sentence[sentence.length - 1];
    if (lastChar === '?')
      return 'question';
  
    return 'general';
  };
  
  console.log(getTypeOfSentence('Hodor'));  // => general
  console.log(getTypeOfSentence('Hodor?')); // => question

                        

Рекомендуется всегда использовать фигурные скобки, даже если внутри них только одна строка кода. Таким образом будет явно видно границы тела условия, что делает код более структурированным и понятным.

Else

Давайте создадим функцию getTypeOfSentence(), которая анализирует текст и возвращает описание его тона: для декларативных предложений – General sentence, для вопросительных – Question sentence.

getTypeOfSentence('Hodor');  // General sentence
getTypeOfSentence('Hodor?'); // Question sentence

                        

Сама функция будет такой:

const getTypeOfSentence = (sentence) => {
    // Объявляем переменную, в которую запишем тип предложения
    let sentenceType;
    // Предикат, проверяющий окончание текста
    // Если он оканчивается на символ '?', то вернется true,
    // иначе false
    if (sentence.endsWith('?')) {
      // Если условие выше сработало,
      // то это вопросительное предложение.
      // Присваиваем sentenceType соответствующее значение.
      sentenceType = 'Question';
    } else {
      // Во всех остальных случаях предложение — обычное
      sentenceType = 'General';
    }
  
    // С помощью интерполяции формируем строку
    return `${sentenceType} sentence`;
  };

Мы внесли изменения, добавив ключевое слово "else" и новый блок с фигурными скобками. Этот блок будет выполнен только в случае, если условие в выражении "if" будет возвращать false.

Конструкция else if

Функция getTypeOfSentence() в предыдущем примере определяет только вопросительные и обычные предложения. Давайте попробуем расширить функциональность, чтобы она также поддерживала восклицательные предложения.

const getTypeOfSentence = (sentence) => {
    const lastChar = sentence[sentence.length - 1];
    let sentenceType;
  
    if (lastChar === '!') {
      sentenceType = 'exclamation';
    } else {
      sentenceType = 'normal';
    }
  
    if (lastChar === '?') {
      sentenceType = 'question';
    }
  
    return `Sentence is ${sentenceType}`;
  };
  
  getTypeOfSentence('Who?'); // Sentence is question
  getTypeOfSentence('No');   // Sentence is normal
  getTypeOfSentence('No!');  // Sentence is exclamation

Мы добавили дополнительную проверку на "восклицание" ("exclamation" переводится как «восклицание»). Технически функция работает, однако с точки зрения семантики возникают некоторые проблемы:

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

2) Второе условие не учитывается в ветке else.

Было бы правильнее воспользоваться еще одним условием для более точной работы функции.

const getTypeOfSentence = (sentence) => {
    const lastChar = sentence[sentence.length - 1];
    let sentenceType;
  
    if (lastChar === '?') {
      sentenceType = 'question';
    } else if (lastChar === '!') {
      sentenceType = 'exclamation';
    } else {
      sentenceType = 'normal';
    }
  
    return `Sentence is ${sentenceType}`;
  };
  
  getTypeOfSentence('Who?'); // Sentence is question
  getTypeOfSentence('No');   // Sentence is normal
  getTypeOfSentence('No!');  // Sentence is exclamation

                        

Теперь все условия объединены в одну конструкцию. Ветвь else if означает «если предыдущее условие не выполнено, но текущее выполнено».

Логика выполнения будет ограничена одним из блоков кода, соответствующих всей конструкции if.