if и if-else

Реализация условной логики

if утверждение

  • Самое простое условное утверждение
  • Позволяет создавать условия проверки утверждения
  • Создает ветки исполняемого кода, в зависимости от соответствия условию
if (condition) {
    statements;
}

Условия и утверждения

  • Условие может быть:
    • Булевой переменной
    • Булевым логическим выражением
    • Выражения сравнения
    • Цифры,объекты, функции, все что угодно!
  • Утверждение может содержать любые типы данных
  • Утверждение может быть:
    • Простым утверждением, заканчивающимся ';'
    • Блоком заключенным в фигурные скобки `'{}'``

Как это работает?

  • Условие оценивает
    • Если true- подобное условие, утверждение исполняется
    • если false-подобное, утверждение пропускается

In [1]:
function onFindBigger(first,second) {
    bigger = first;

    if (bigger < second) {
        bigger = second;
    }

    console.log("Большее: " + bigger);
}

function onIsNumber(selector) {
    var str = selector;
    name = selector.substr(4);

    if (+str) { // Если сттрока  является номером, +str не будет NaN
        console.log(name + ' это номер');
    }

    if (!(+str)) { // если строка не является номером, +str  будет NaN
        console.log(name + ' это не номер');
    }
}

onFindBigger(2,5)
onIsNumber("12")


Большее: 5
 это номер
Out[1]:
undefined

if-else утверждение

  • Более комплексное и применимое утверждение
  • Вызывает код в одной ветке если true и в другой если false
if (expression) {
    statement1;
} else {
    statement2;
}

Как это работает?

  • Условие оценивает
    • Если true-подобное, вызывается первое утверждение
    • Если false-подобное, вызывается второе утверждение
  • Проверяет число на четность

In [10]:
function onEvenOdd(str) {
    number = +str;

    if (number % 2) {
        console.log('Число ' + number + ' не четное');
    } else {
        console.log('Число ' + number + ' четное');
    }
}

function onIsNumber(str) {
    if (+str) {
        console.log('Это число');
    } else {
        console.log('Это не число');
    }
}

onEvenOdd(23)
onIsNumber("pivet")


Число 23 не четное
Это не число
Out[10]:
undefined

Вложенные if утверждения

- if и if-else могут быть вложенными, то есть использоваться внутри if и else утверждений

if (expression) {
  if (expression) {
    statement;
  } else {
    statement;
  }
} else {
  statement;
}
  • Всегда используйте { … } чтобы избежать неоднозначности
    • Даже когда используется одноуровневое условие
  • Старайтесь избегать появления более 3 вложенным if утверждений
  • Старайтесь делать код более читабельным

In [11]:
function onCompare(first,second) {
    if (first === second) {
        console.log(first + ' = ' + second);
    } else {
        if (first > second) {
            console.log(first + ' > ' + second);
        } else {
            console.log(first + ' < ' + second);
        }
    }
}

function onOddEven(str) {
        n = +str;
    if (n) {
        if (n % 2) {
            console.log('Число нечетное');
        } else {
            console.log('Число четное');
        }
    } else { //n is NaN
        console.log('Это не число!');
    }
}

onOddEven("22")
onCompare("123","22")


Число четное
123 < 22
Out[11]:
undefined

Множество if-else-if-else-…

  • Иногда Вам надо использовать if проверку условия в else блоке
    • Здесь может быть применимо else if выражение:

In [12]:
function onCheckNumbers(text) {
        vowels = 0,
        other = 0,
        numbers = 0;

    for (var i = 0; i < text.length; i+=1) {
        var character = text[i];
        if (character === 'a' || character === 'A') {
            vowels+=1;
        } else if (character === 'e' || character === 'E') {
            vowels+=1;
        } else if (character === 'u' || character === 'U') {
            vowels+=1;
        } else if (character === 'o' || character === 'o') {
            vowels+=1;
        } else if (character === 'i' || character === 'i') {
            vowels+=1;
        } else if ('0' <= character && character <= '9') {
            numbers+=1;
        } else {
            other+=1;
        }
    }
    console.log("Гласных: " + vowels);
    console.log("Цифр: " + numbers);
    console.log("Других: " + other);
}


Out[12]:
undefined

In [5]:
onCheckNumbers('dsadfsfs32')


Гласных: 1
Цифр: 2
Других: 7
Out[5]:
undefined

Несколько вариантов условных переходов (switch-case)

  • Выбирает условие из перечня доступных вариантов с помощью switch

In [6]:
function onDay(dayIndex) {
    var day;

    switch (dayIndex) {
        case 1: day = "Понедельник"; break;
        case 2: day = "Вторник"; break;
        case 3: day = "Среда"; break;
        case 4: day = "Четверг"; break;
        case 5: day = "Пятница"; break;
        case 6: day = "Суббота"; break;
        case 7: day = "Воскресенье"; break;
        default: day = "Ошибка ввода"; break;
    }

    console.log(day);
}

onDay(2)


Вторник
Out[6]:
undefined
  • Выражение вычисляется
  • Когда одна из указанных констант соответствует выражению
  • Если нет не одной константы соответствующей выражению
    • Если есть выражение пол умолчанию, то оно вызывается
    • В противном случае проверка завершается и управление кодом передается за пределы блока

Поведение "следовать дальше" в switch

  • JavaScript поддерживает поведение "следовать дальше"
    • т.е если в case утверждении отсутствует break, код продолжает выполняться дальше
      • Вплоть до появления оператора break

In [7]:
function onDay(dayIndex) {

    var result;

    switch (dayIndex) {
        case 1:
        case 2:
        case 3:
        case 4:
        case 5:
            result = 'Рабочий день';
            break;
        case 6:
        case 7:
            result = 'Выходной';
            break;
        default: result = 'Ошибка!'; break;
    }

    console.log(result);
}
onDay(2)


Out[7]:
undefined

Выражения в блоке case

  • В JavaScript, case метка может содержать выражения
    • Используется когда надо проверить диапазоны
      • Тем не менее не очень читабельно, поэтому лучше применять if-else утверждения

In [5]:
function onScore(str) {

    var  score = +str;

    switch (true) {
        case !score: // true пока счет NaN
        case score < 2 || score > 6:
            console.log('Ошибка ввода');
            break;
        case score < 3.5:
            console.log('Плохо ' + score);
            break;
        case score < 4.5:
            console.log('Хорошо ' + score);
            break;
        case score < 5.5:
            console.log('Очень хорошо ' + score);
            break;
        default:
            console.log('Превосходно ' + score);
            break;
    }
}
onScore(4)


Хорошо 4
Out[5]:
undefined

In [7]:
function onFallThrough(output) {
    var foo = output,
    output = 'Вывод: ';

    switch (foo) {
        case 10:
            output += 'Так ';
        case 1:
            output += 'это ';
        case 2:
            output += 'Твое ';
        case 3:
            output += 'Имя';
        case 4:
            output += '?';
            console.log(output);
            break;
        case 5:
            output += '!';
            console.log(output);
            break;
        default:
            console.log('Пожалуйста введите число о 0 до 6!');
    }
}

onFallThrough(2)


Вывод: Твое Имя?
Out[7]:
undefined

Истинные и ложные значения

  • Каждый тип в JavaScript может быть выражен через булево значение
    • Так как вызываеются истинные (TRUE-подобные) и ложные (FALSE-подобные) значения
  • Эти значения ложные
    • false, 0, "" / '', null, undefined, NaN
  • Все остальные значения истинные
  • Информация: http://www.sitepoint.com/javascript-truthy-falsy/

In [ ]: