От первого html тега, до SEO оптимизации порталов
Украина
+380 63 85 62 538

Оператор alert и prompt в javascript

JavaScript урок первый

Оператор alert и prompt в javascript

Javascript — это язык программирования, который активно используется для построения динамических веб страниц. Собственно с этой целью он и был изобретен. У нашего с вами языка еще есть такое интересное название, как язык сценариев. В принципе такое название можно дать любому языку с приставкой script на конце.

Языки сценариев являются ограниченными языками программирования, и для выполнения кода, они встраиваются в другую программу. Чтобы вы понимали о чем я говорю, наведу парочку примеров.

  • ActionScript — используется только во флеш приложениях
  • VBScript — в программах MC Office
  • JavaScript — только в браузерах

Язык javascript, как и большинство языков сценария интерпретируемый язык, и как вы догадались его интерпретатором является абсолютно любой браузер. Мы лишены ручной работы компилирования исходного кода в машинный, так как за нас эту работу выполняет браузер.

Запомните раз и навсегда, для javascript очень важен регистр букв!

Во второй строке в слове getElementById буква D написана в верхнем регистре, что является в корне не правильно и ошибочно. Есть много вещей, который в том или ином языке программирования нужно знать и соблюдать. Все важные моменты я буду описывать здесь, а вы постарайтесь обращать на них внимание и делать все правильно.

Java, ActionScript, JavaScript — это все языки которое пошли от языка C, для тех, кто знает стили и синтаксис написания кода на языке «C», без проблем сможет переучиться на javascript. Так что javascript, это интерпретируемый, регистрозависимый язык основанный на языке С, он весьма актуален сейчас и интересен для изучения, а еще специалисты в этой области получают довольно таки неплохие зарплаты.

Первые строки кода в javascript

Чтобы заставить наш исходный код работать, его нужно запустить в браузере, а для того, чтобы запустить в браузере, следует создать простую веб страницу в которую мы с вами подключим внешний документ с javascript. Знание html и css в изучении скрипта не критично, но желательно. Если вы совсем не знакомы с html, рекомендую ознакомиться с моим руководством по изучению html и css.

Сейчас у меня в рабочей папке имеется два файла, html страничка, к которой подключен скрипт и собственно сам документ javascript.

Рабочие документы

У меня первый файл имеет название index и расширение стоит у него html, не важно какое название у вашего файла будет, вы можете назвать его по своему, здесь играет роль расширение файла и оно должно быть html. Вторым документом является сам исходный код javascript и он имеет расширение js, что и говорит о его принадлежности к скрипту.

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

Рассмотрим наш html документ и убедимся, что там нет ничего лишнего:

Как видите у нас простая htnl5 страничка, в которой внутри тега body подключен код javascript. Так как это не курс по html, я не стану разбирать теги, и их значение, для этого есть рубрика на моем блоге с изучением HTML5 и CSS. Закрываем нашу страничку с html и переходим к документу javascript для написания исходного кода самой простой программки на этом языке.

Итак в открытом документе для кода скрипта пишем следующий кусочек кода:

Запомните все примеры, которые я даю нужно писать именно так, как они в примере указаны, никаких лишних пробелов, отсутствия точек с запятой и т.д. Мы с Вами написали первую инструкцию на языке javascript. Чтобы запустить этот код, нам нужно сохранить документ и закрыть, на это время он нам уже не понадобится. Запускаем теперь нашу веб страницу. то есть кликаем два раза по html документу и он откроется в окне нашего браузера.

Запустившись страница подгрузила наш с вами код и он выполнился на странице браузера в виде всплывшего диалогового окошка. Это функционал нашего  с вами написанного скрипта.

Взаимодействие вас и страницы сайта при помощи javascript

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

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

Давайте взглянем еще раз на первую строку, она выполняет два действия, первое это вопрос вашего имени, который выполняет оператор prompt и второе, сохранение вашего имени в переменную var с именем name. То есть получается некий ящичек с названием name и содержимым вашего имени. Что же такое переменная var — это контейнер, емкость, которая может хранить разные данные полученные как путем взаимодействия с пользователем в окне браузера, так и введенные нами в исходном коде.

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

Если говорить о второй строке, то вам уже знаком оператор alert, он вызывает раздражающее окошко в вашем браузере требующее нажать ок или крестик в правом верхнем уголке. Но так же вы заметили, что с первого знакомства с оператором alert, кое что изменилось, там мы писали вот так («Hello world»), а здесь появился + да еще и какой-то name.

Давайте разберемся, name это созданная переменная в которой будет храниться имя введенное в окне браузера. При вызове окна оператором alert происходит следующее, строка Привет присоединяется к значению находящемуся в переменной name и на выходе мы получаем Привет, (ваше имя).

Я объясняю насколько это позволяет сделать текстовый вариант преподавания, очень надеюсь на понимание вами моих советов и примеров. Рекомендую используя операторы prompt и alert, а также переменную var поупражняться с разными вариантами запросов. Например спросите, сколько вам лет, а переменную var уже не name называйте, а скажем age.

Я жду ваши вопросы и благодарности в виде комментариев, это способствует моему желанию писать дальше и помогать вам в освоении замечательного языка javascript/

  1. ФеоктистФеоктист03-29-2020

    Спасибо!

  2. АлексейАлексей07-27-2020

    Очень доходчиво и интересно написано. Добавил вас в закладки. Пожалуйста, не останавливайтесь с уроками. Было бы классно, если бы в дальнейшем вы потихоньку учили нас писать скрипты. Это же так здорово, когда ты сам своими руками создаешь что то.

Написать ответ

.