(статья JS 01)
Эта первая статья по основам программирования, которые будут приведены в примерах языка JavaScript.
В предыдущих статьях я рассказывал:
Что интересного в статьях по основам программирования на этом канале?
1. В тексте статей будет уделено больше внимания примерам, чем теории. Теорию потребуется дочитывать дополнительно, например, из учебника на сайте JavaScript.ru
2. Почти все рассматриваемые примеры, как элементы пазла, составляют одну программу, которую можно будет написать в конце этой серии статей.
Попробуйте угадать, что получится собрать из всех примеров, используемых в статьях "Основы программирования" на этом канале.
Подготовка к программированию
Что нужно для начала программирования?
1. Программное обеспечение:
- Текстовый редактор: Notepad (блокнот) или Notepad++ (можно скачать с официального сайта https://notepad-plus-plus.org). Notepad++ интересен тем, что в нём присутствует функция подсветки синтаксиса кода, что помогает обучению программиста.
- Обычный современный браузер для просмотра html-страниц. В этой программе можно будет запускать созданный в текстовом редакторе html-файл с кодом JS. В браузерах бывает встроенный редактор кода, его можно использовать вместо текстового редактора. Например, в Mozilla FireFox есть программа "Простой редактор JavaScript" (Меню > Веб-разработка) - в этой программе тоже удобно работать с кодом.
Выбирайте оптимальный для Вас вариант.
2. Знания других языков, навыки:
- для написания кода на JavaScript нужны знания html и css или придётся осваивать в процессе чтения статей с вопросами в комментариях;
- для понимания приводимых примеров JS нужно представление о вёрстке веб-страниц или готовность освоить основы веб-мастеринга во время чтения этих статей (спрашивайте в комментариях и читайте уроки на htmlbook.ru).
Лозунг статьи: Страхи, прочь! Успех в учёбе!
Если Вы решили проверить примеры, публикуемые в моих статьях, то создайте папку с любым осмысленным для Вас названием, запустите текстовый редактор (редактор кода) и сохраните чистый файл с любым названием, например, index_01.html (расширение файла должно быть "html").
Основы программирования
Поскольку в этих статьях будут приводиться примеры JS в веб-документе, то нужно вначале создать структуру пустого веб-документа.
Пишем в текстовом редакторе:
<!DOCTYPE HTML>
<html>
<head>
<!-- Тег meta для указания кодировки -->
<meta charset="utf-8">
</head>
<body>
</body>
</html>
Кратко о том, что это такое.
В угловых скобках заданы теги html, так выглядит пустая страница сайта (веб-документ).
Между тегами <head> и </head> указываются параметры заголовка страницы, непосредственно код оформления CSS и код функций JavaScript.
Между тегами <body> и </body> будут размещаться элементы веб-страницы, которые отобразятся в браузере.
Код JavaScript размещается: либо в отдельном файле с расширением .js - "<script type="text/javascript" src="имя_файла.js"></script>", либо в head веб-документа - "<script type="text/javascript"> ... размещение кода ... </script>".
Функции JavaScript
Функции помощью, которых задаются действия интерпретатору программного языка, бывают встроенными и пользовательскими.
Встроенные функции - это набор предусмотренных разработчиком отдельных сценариев, которые вызываются определенной командой с указанием параметров функции.
Например,
<script type="text/javascript">
alert ("Привет, Мир!");
</script>
Внутри тега script указана команда вызова функции, открывающей диалоговое окно с кнопкой "ОК" и надписью "Привет, Мир".
Попробуйте написать этот код перед закрывающим тегом </head>, затем сохраните изменения в файле и откройте его с помощью браузера - результатом должно быть появление окна сообщения с надписью приветствия.
Пользовательские функции - это набор действий, составленный пользователем. Пользовательские функции могут быть набором различных встроенных функций.
Например,
<script type="text/javascript">
function hello_world()
{
var mess = "Привет, Мир!";
alert(mess);
}
hello_world();
</script>
После function указывается название функции, которое придумывает пользователь (в данном случае - это "hello_world"), далее в круглых скобках могут быть указаны параметры, передаваемые в функцию, а затем в фигурных скобках размещается тело самой функции.
!!! Чтобы функция запустилась её нужно вызвать, то есть написать название и параметры вне тела функции (в данном случае - это hello_world();).
Попробуйте вместо предыдущей встроенной функции написать код пользовательской - результат должен быть такой же как и в первом случае.
На этом можно закончить первую ознакомительную статью о функциях JavaScript, рекомендую ознакомиться с некоторыми материалами сайта JavaScript.ru:
Задавайте вопросы в комментариях ).
24 марта 2019 года.
автор: Демешин Сергей Владимирович.