Основы JavaScript - часть 2
Всплывающие окна (pop-up)
Различают три вида всплывающих окон. Попробуйте их в действии, нажимая на кнопки ниже:
Окно типа "Alert"
Синтаксис для такого окна очень прост:
alert("Ваш текст");
Пользователю нужно будет нажать "ОК" для продолжения.
Типичный случай использования - когда необходимо донести до пользователя какую-либо информацию. Это могут быть любые сообщения, в том числе и достаточно распространенные, вроде "Для корректного отображения всех элементов сайта необходим Flash-плагин" и т.п.
Окно типа "Confirm"
Синтаксис для данного типа окон:
confirm("Ваш текст");
Для продолжения пользователю нужно нажать "ОК" или "Отмена".
Типичный случай использования - попросить пользователя что-то подтвердить или принять.
Например, "Подтвердите, что вам как минимум 57 лет", или что-нибудь техническое, вроде "У вас установлен плагин Shockwave Flash?"
- Если пользователь кликает на "ОК", сценарий возвращает значение true (истина).
- Если пользователь кликает на "Отмена", то возвращается значение false (ложь).
if (confirm("Вы согласны?")) {alert("Вы согласились")}
else{alert ("Вы не согласились")};
Окно типа "Prompt"
Синтаксис данного типа окна следующий:
prompt("Ваш текст","Значение по умолчанию");
Пользователю для продолжения нужно кликнуть на "ОК" или "Отмена" после ввода текста.
Типичный пример использования - случаи, когда пользователю нужно ввести какое-либо значение в поле для того, чтобы загрузилась определенная страница.
Например, это может быть имя пользователя, которое сохранится в Cookie, либо ввод пароля или иного кода.
- Если пользователь нажимает "ОК", сценарий возвращает то, что было введено пользователем.
- Если пользователь нажимает "Отмена", то возвращается null.
— Регулярная проверка качества ссылок по более чем 100 показателям и ежедневный пересчет показателей качества проекта.
— Все известные форматы ссылок: арендные ссылки, вечные ссылки, публикации (упоминания, мнения, отзывы, статьи, пресс-релизы).
— SeoHammer покажет, где рост или падение, а также запросы, на которые нужно обратить внимание.
SeoHammer еще предоставляет технологию Буст, она ускоряет продвижение в десятки раз, а первые результаты появляются уже в течение первых 7 дней. Зарегистрироваться и Начать продвижение
Так как обычно есть необходимость в дальнейшем использовании текста, набранного пользователем, мы можем занести этот текст в переменную, как показано в примере ниже:
username=prompt("Пожалуйста, введите Ваше имя","Ваше имя");
Переменные
Переменные можно сравнить с небольшими коробочками с именами.
Если вам нужно хранить 5 пар обуви у вас, скорее всего, есть для этого пять коробок. На каждой коробке вы бы написали, что за пара в ней лежит.
- Коробки будут вашими переменными - местом хранения вещей.
- Названия коробок будут вашими именами переменных - те самые, которые вы используете "ссылаясь" на каждую из коробок.
- Сами же пары обуви будут содержимым переменной - тем, что хранится в коробке.
Переменная - это просто "кусочек" компьютерной памяти, где хранится определенная информация. К переменным нужно обращаться, используя уникальные имена, которые мы сами им и задаем.
Рассмотрим пример:
<html> <head> <title>My Javascript Page</title> </head> <body> <script> myname="Петр Петрович"; document.write(myname); </script> </body> </html>
Данный пример выполнит вывод в документ слов "Петр Петрович".
Заметьте, что если вы хотите сохранить текст в переменной, необходимо заключить его в "". Это делается для того, чтобы javascript мог отличить текст от переменной.
Рассмотрим пример ниже, чтобы понять важность этого правила:
<html> <head> <title>My Javascript Page</title> </head> <body> <script> Henrik="Мое имя"; myname=Henrik; document.write(myname); </script> </body> </html>
Попытайтесь предсказать результат выполнения данного кода прежде чем читать дальше.
- В первой строке скрипта текст "Мое имя" сохраняется в переменную Henrik.
- Во второй строке переменная Henrik сохраняется в переменную myname.
- Наконец, в третьей строке переменная myname выводится в документ.
Результатом работы сценария будет вывод на экран слов "Мое имя".
Присвоение значений переменным
Наиболее типичный способ присвоения переменной какого-либо значения - использование знака равенства.
Рассмотрим следующие примеры, чтобы увидеть различные способы задания значений переменным. Особое внимание обратите на использование скобок, позволяющих управлять очередностью обработки информации в сложных формулах.
| Пример | Результирующее значение |
| a=2; | a=2 |
| a=2; a++; | a=3 (2+1) |
| a=2; a--; | a=1 (2-1) |
| a=2; b=3; c=a+b; | c=5 (2+3) |
| a=2; d=a+6; | d=8 (2+6) |
| First="Henrik"; | First=Henrik |
| Last="Petersen"; | Last=Petersen |
| Full=First+" "+Last; | Full=Henrik Petersen |
| a=2*7; | a=14 (2*7) |
| b=20/5; | b=4 (20/5) |
| c=(20/5)*2; | c=8 (4*2) |
| d=20/(5*2); | d=2 (20/10) |
Арифметические операторы
В таблице выше показаны так называемые "арифметические операторы" a++ и a--.
В принципе, вполне реально обходиться и без них, так как такого же эффекта можно добиться, используя другие операторы.
Однако вы часто будете видеть их в скриптах и, возможно, сами станете настолько ленивы, что будете ими пользоваться - ведь написать a++; быстрее, чем a=a+1;.
| Оператор | Объяснение | Пример |
| ++ | increment (инкремент) | a=5; a++; a теперь равно 6 |
| -- | decrement (декремент) | a=5; a--; a теперь равно 4 |
| % | возвращает остаток от деления двух чисел | a=8 % 3; a теперь равно 2, так как при делении 8 на 3 в остатке будет 2 |
Сравнение переменных
Есть несколько способов сравнения переменных. Простейший из них - это сравнение на равенство, которое осуществляется с использованием двойного знака равенства:
— Разгрузит мастера, специалиста или компанию;
— Позволит гибко управлять расписанием и загрузкой;
— Разошлет оповещения о новых услугах или акциях;
— Позволит принять оплату на карту/кошелек/счет;
— Позволит записываться на групповые и персональные посещения;
— Поможет получить от клиента отзывы о визите к вам;
— Включает в себя сервис чаевых.
Для новых пользователей первый месяц бесплатно. Зарегистрироваться в сервисе
if (a==b) {alert("a равно b")};
if (lastname=="Petersen") {alert("Интересная фамилия!!!")};
Если вы забудете использовать двойной знак равенства и будете использовать одинарный при сравнении переменных на равенство, вы не сравните переменные. Все что произойдет - это присовоение переменной слева от знака равенства значения переменной справа от знака равенства.
Пример подобной ошибки:
if (lastname="Petersen") {alert("Интересная фамилия!!!")};
Это очень часто встречающаяся ошибка, которая полностью нарушает работу скрипта.
В таблице ниже представлены различные операторы сравнения.
| Оператор | Объяснение | Пример |
| == | равно | 4==5 (false) 5==5 (true) 5==4 (false) |
| != | не равно | 4!=5 (true) 5!=5 (false) 5!=4 (true) |
| < | меньше | 4<5 (true) 5<5 (false) 5<4 (false) |
| > | больше | 4>5 (false) 5>5 (false) 5>4 (true) |
| <= | меньше или равно | 4<=5 (true) 5<=5 (true) 5<=4 (false) |
| >= | больше или равно | 4>=5 (false) 5>=5 (true) 5>=4 (true) |
По материалам www.echoecho.com
Перевод - Дмитрий
P.S. Присмотритесь к премиум-урокам по различным аспектам сайтостроения, а также к бесплатному курсу по созданию своей CMS-системы на PHP с нуля. Все это поможет вам быстрее и проще освоить JavaScript и PHP:
Понравился материал и хотите отблагодарить?
Просто поделитесь с друзьями и коллегами!
Смотрите также:
