Здравствуйте, уважаемые посетители моего скромного блога для начинающих вебразработчиков и web мастеров ZametkiNaPolyah.ru. Продолжаем рубрику Уроки JavaScript для начинающих. В данной рубрике были публикации: Инструкции JavaScriptФункции JavaScriptпеременный JavaScript и типизация JavaScript переменныхсинтаксис JavaScriptзначение null и значение undefined JavaScriptзначения true и false в JavaScript, выражения и операторы JavaScriptоператоры void, delete, new и typeofпреобразование число в строку и строку в числосимволы и строки JavaScriptчисла JavaScriptтипы данных JavaScript и способы вставки JavaScript в HTML. В данной публикации я попытаюсь объяснить на пальцах принцип работы инструкции if JavaScript, точнее if/else. Для инструкции if существует две формы записи, первая: инструкция if JavaScript без использования конструкции else, и вторая: инструкция if с использование конструкции else.

Условия JavaScript. Инструкция if JavaScript и конструкция else JavaScript.

Условия JavaScript. Инструкция if JavaScript и конструкция else JavaScript.

Инструкция if – это одна из базовых JavaScript инструкций, которая используется для создания ветвления в программах JavaScript. Инструкция if (if/else) указывает интерпретатору на то, что он должен принять решение о том, как он будет выполнять дальнейший код программы, в зависимости от выполнения или невыполнения поставленного условия. Инструкция if/else используются в JavaScript для проверки условия или для задания условия JavaScript.

Не забываем подписываться на RSS-лентуtwitter и на публичную страницу Вконтакте

Условие JavaScript. Инструкция if JavaScript (if/else).

Как я уже говорил: инструкция if JavaScript – это одна из самых часто используемых инструкций базового языка JavaScript, практические нет программ, в которых не было бы инструкции if. Инструкция ifJavaScript применяется для создания ветвления в программе. При помощи инструкции if задается условие, от результата выполнения которого зависит, то как дальше будет выполняться программа. Инструкция if JavaScript имеет две формы записи. Первая форма записи:

[php]

if (выражение)

инструкция

[/php]

В данном случае, сперва будет выполнено вычисление выражения JavaScript, которое размещено в круглых скобках. И если результат вычисленного выражения будет равен значению true или его можно преобразовать в true, то будет выполнена JavaScript инструкция. Если вычисленное значение имеет значение false или оно может быть преобразовано в false, то дальнейшие инструкции не будут исполняться. Отсюда и пошла фраза «условие JavaScript». Пример инструкции if JavaScript:

[php]

if (name == null)

name =”Kirill”;

[/php]

В данном случаем мы проверяем определена ли переменная name, если переменная name не определена, то есть она пустая, ей еще не присвоено значение, то вторым шагом мы присваиваем переменной name значение “Kirill” при помощи оператора присваивания. У данной записи есть более короткая запись, при помощи оператора отрицания (!):

[php]if (!name) name=”Kirill”;[/php]

В данном случае значение Kirill будет присвоено переменной name, если значение, хранящееся в ней, будет равно: null, NaN, undefined, “0” или “”, поскольку все эти значения преобразуются в false. Обратите внимание: скобки для выражения инструкции if JavaScript – это обязательное условие, поскольку они являются частью синтаксиса JavaScript. В прошлой публикации мы говорили про составные инструкции JavaScript, инструкция if как раз таки относится к составным инструкциям, то есть у нее есть подынструкция, в нашем случае это:

[php]name=”Kirill”;[/php]

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

[php]

if ((age == null)||(age == “”)) {

age = ”undefined”;

alert (“Пожалуйста, укажите свой настоящий возраст”);

[/php]

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

Инструкция if/else JavaScript. Конструкция else JavaScript

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

[php]

if (выражение)

первая инструкция, если значение равно true

else

вторая инструкция, если значение равно false

[/php]

Практические всегда и все программы исполняются слева направо и сверху вниз. Данный пример не является исключением. При выполнении такой инструкции (if/else) сначала будет вычислено выражение JavaScript, которое стоит в круглых скобках. Если вычисленное значение равно true или может быть преобразовано в true, то будет выполняться инструкция if JavaScript, то есть первая инструкция. Если же значение выражение равно false или может быть преобразовано в false, то выполняться будет вторая инструкция, то есть та инструкция, которая идет после конструкции else. Пример:

[php]

if (name != null)

alert (“Привет ” + username + “!”);

else {

username = prompt (“Введите свое имя”);

alert (“Привет” + username+”!”);

}

[/php]

Таким образом, мы видим, что else – это составная инструкция и внутри нее можно использовать блоки инструкций, как и в случае с инструкцией if. Но помните: использовать инструкцию else вместе с инструкцией if JavaScript следует очень аккуратно, поскольку возможен ряд логических ошибок, которые могут привести к неправильным результатам, например у нас есть три переменных, в которых хранятся числа, мы знаем, что в первых двух переменных значения одинаковые (пусть это будет x=y=1), а в третьей переменной хранится неизвестное значение, возможно оно равно первым двум, а возможно и не равно (пусть это будет z=2):

[php]

x=y=1;

z=2;

if (x==y)

if (z==x)

document.write (“y=z”);

else

document.write (“y!=z”);

[/php]

И так, мы объявили три переменных JavaScript и присвоили им значения, затем ставим условие и проверяем равенство первых двух переменных, если они будут равны между собой, то мы сравниваем значение первой переменной с тем, что содержится в третьей переменной, если значения равны между собой, то мы выводим на экран надпись о том, что вторая переменная равна третьей при помощи метода document.write (). И мы вводим конструкцию else, которая отвечает за вывод надписи в случае неравенства первой и третьей переменной, то есть в случае, когда мы получим значение false.

На первый взгляд все логично и правильно и, кажется, что все будет исполнено верно, ведь условия заданы правильно, инструкция if/else должна сработать. Но, логика выполнения в данном случае будет следующей: конструкция else будет отнесена ко второй инструкции if (if (z==x)), поскольку она идет сразу после нее, то есть else это подынструкция второго if, а нам надо, чтобы else была подынструкцией первого, тогда пример будет функционировать правильно, то есть так, как я описал сразу после примера. JavaScript интерпретатор посчитает, что второй второй if и конструкция else – это блок подынструкций для первого if:

[php]

if (x==y) {

if (z==x)

document.write (“y=z”);

else

document.write (“y!=z”);//произойдет ошибка!!!

}

[/php]

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

[php]

if (x==y) {

if (z==x) {

document.write (“y=z”);

}}

else{

document.write (“y!=z”);//произойдет ошибка!!!

}

[/php]

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

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

На этом всё, спасибо за внимание, надеюсь, что был хоть чем-то полезен и до скорых встреч на страницах блога для начинающих вебразработчиков и вебмастеров ZametkiNaPolyah.ru. Не забываем комментировать и делиться с друзьями;)

Возможно, эти записи вам покажутся интересными


Выберете удобный для себя способ, чтобы оставить комментарий

Leave a Comment

Ваш адрес email не будет опубликован. Обязательные поля помечены *

Loading Disqus Comments ...