Веб-программирование

Обучение программированию

Делаете первые шаги в программировании? Представляем вашему вниманию пошаговое обучение самостоятельного создания сайтов любой сложности на примерах! На страницах сайта KobRU вы найдете все самое необходимое, для того чтобы по праву считаться веб-мастером по созданию привлекательных динамически изменяемых интернет-страниц, используя основные инструменты веб-разработчиков: HTML; CSS; PHP; MySQL; JAVASCRIPT и другие. Сайт KobRU - наиболее полное и качественно структурированное руководство с предельно понятными пояснениями и поэтапным изложением материала, который поможет вам в совершенстве овладеть искусством программирования. Добавьте динамики и интерактивность в свои веб-проекты!

Вход в личный кабинет

Забыли пароль?

Не зарегистрированны?


Конструкторское Web-бюро
4.3 Оператор Switch

Автор: Denisido

Дата: 2010-06-22

Управляющие операторы

Ранее мы с вами говорили о том, что если нужно использовать сразу несколько условий то можно применить конструкцию else if, но как быть если таких условий очень и очень много? На самом деле конструкция else if не так часто применяется, а иногда и вовсе может быть неэффективной. Допустим нам нужно написать код, который будет реагировать на ответ пользователя "Какого цвета ваши глаза?":

Запустить!


Здесь мы написали сценарий для ввода четырех значений: голубые; зеленые; карие и серые. Если вы напишите в текстовом поле формы один из этих вариантов, то получите ответную реакцию программы в виде цвета текста ваших глаз. Конечно, это далеко не полный список вариантов, которые может ввести пользователь, но наша цель не в этом, а в том, чтобы продемонстрировать как оператор выбора swich может помочь преобразовать else if-код.

Запустить!
// используем оператор if
var value = prompt('Какого цвета ваши глаза','');

if (value == 'голубые') {alert('Мне нравятся голубые глаза');}
else if (value == 'зеленые') {alert('Зеленый - мой любимый цвет!');}
else if (value == 'карие') {alert('У моего отца карие глаза');}
else if (value == 'серые') {alert('У меня тоже серые глаза');}
else {alert('У вас и вправду такие глаза?');}
Запустить!
// используем оператор switch
var value = prompt('Какого цвета ваши глаза?','');

switch (value) {

case 'голубые' :  alert('Мне нравятся голубые глаза');   break;
case 'зеленые' :  alert('Зеленый - мой любимый цвет!');  break;
case 'карие'   :  alert('У моего отца карие глаза');     break;
case 'серые'   :  alert('У меня тоже серые глаза');      break;

default:  alert('У вас и вправду такие глаза?');
               }

Как вы можете наблюдать, эти два кода эквивалентны, но последний более удобочитаемый и компактный. Давайте с вами разберемся как он работает.
1. Первым делом пишем ключевое слово switch (от англ. переключатель);
2. Затем в скобках следует имя переменной (value);
3. После открываем фигурную скобку и сразу закрываем ее {} (чтобы после не забыть);
4. В фигурных скобках пишем значение для каждого case (случая) таким образом:
case 'значение' : действия и в конце добавляем оператор выхода break; (строки кода с 06 по 09). На самом деле таких case может быть сколько угодно много.
5. Ключевое слово default : действия применяется, если ни одно из значений не совпало. Его можно даже опустить, тогда никаких действий выполняться не будет. Стоит отметить, что ключевое слово break; также является необязательным, но тогда все действия будут выполняться до следующего оператора break;. Посмотрим:

Запустить!
// используем оператор switch
var value = 'голубые';

switch (value) {

case 'голубые' :  alert('Мне нравятся голубые глаза');          // нет break
case 'зеленые' :  alert('Зеленый - мой любимый цвет!');  break;
               }

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



Оцените материал по 5-ти бальной шкале: 1 2 3 4 5



Коментарии:

Добавить новый коментарий:

Текст коментария:

Введите результат с картинки

Просмотров: 13977

Метки раздела JavaScript

Основы web программирования, var javascript, javascript функции, javascript обучение, javascript простые примеры, html javascript, javascript примеры, javascript random, уроки сайтостроения, java script, регулярные выражения, appendchild javascript, javascript бесплатно, javascript document write, javascript справочник, javascript примеры.