Структуру и оформление сайта обеспечивают язык разметки HTML и каскадные таблицы CSS. А взаимодействие сайта реализуется с помощью скриптов JavaScript.
Этот язык программирования работает в браузере и дает пользователю обратную связь на все действия.
В статье подробно разбираем, как новичку написать JavaScript.
Как написать JavaScript
Для начала разберем, что такое скрипт. В переводе с английского это значит сценарий. В разработке скрипт — набор команд, строчек кода. Их цель — выполнить конкретную задачу. Например, ответить посетителю сайта на взаимодействие: поздороваться с ним, ответить на его вопрос.
Для написания программы на JavaScript нужен редактор кода, который позволяет вводить и редактировать текст программы. Например, можно использовать бесплатный редактор Visual Studio Code или даже браузер.
Создаем первый простой скрипт
Стандартное первое задание для новичка, который учится писать код — вывести на экран фразу «Hello, world». Человек знакомится со структурой программы и отрабатывает самый важный аспект — вывод информации пользователю.
Самый простой способ вывести текст на экран браузера:
- Откройте «Инструменты разработчика» (Developer Tools) в браузере Chrome. Сделать это можно через сочетание клавиш Ctrl + Shift + I или F12 (Cmd + Opt + I на macOS) или через меню браузера. В Google Chrome нужно нажать на три точки.
- Выберите пункт «Дополнительные инструменты» и «Инструменты разработчика». Нас интересует вкладка Console. Задача — вывести «Hello, world» на экран. Для этого нам понадобится команда alert(). Она выводит текст, который передан в круглых скобках. Для нас это — alert("Hello, world")
Важно: не пропускайте кавычки — любой текст при написании кода нужно заключать в двойные или одинарные кавычки.
Благодаря этим действиям вы вывели «Hello, world» на экран.
Пишем более сложные скрипты
Чтобы сделать текст интереснее, можно спросить имя зашедшего на сайт и написать не «Hello, world», а, например, «Привет, Александр!».
Для этого нужно использовать переменную.
Переменная — это область в памяти компьютера, в которой хранится какое-то значение.
В JavaScript переменные создаются через команду let.
Существуют определенные требования к названию переменных:
Название может содержать только буквы, цифры, символы «$» и «_», но не может начинаться с цифры. Также название переменной должно давать понять, что в ней находится.
Пусть переменная будет называться «Александр». Ее добавим к приветствию.
let name = "Александр"
alert("Привет, " + name)
Знак «+» здесь подсказывает программе, что текст справа от знака нужно объединить с тем, что слева.
Теперь, чтобы выводить на экран не скриптовое имя, а то, которое сообщает пользователь, сделаем следующее.
Нужна команда prompt(). Она запросит у пользователя его имя.
Команда выглядит так:
let name = prompt("Введите ваше имя")
alert("Привет, " + name)
Мы спросили у пользователя имя, дождались ответа и здороваемся с ним.
Сохраняем наш первый скрипт
Сохранить скрипт можно в файле html. Чтобы все правильно сохранилось понадобятся теги <html> и <script>.
<html>
<script>
let name = prompt("Введите ваше имя")
alert("Привет, " + name)
</script>
</html>
Писать, редактировать и сохранять скрипты можно в текстовых редакторах, например, «Блокнот» или специальный редактор кода Visual Studio Code.
Стать квалифицированным разработчиком реально, обучившись на курсах IT от федерального проекта «Содействие занятости».
Выбирайте, в какой профессии вы хотите стартовать:
Как только закончите обучение, вы получите доступ в закрытый канал с 4500+ вакансиями от проверенных работодателей России. Мы связываемся с работодателями по всей России и ищем для вас актуальные вакансии «с опытом» и «без», чтобы вы могли найти работу мечты после обучения. Каждый день канал добавляется больше 10 свежих вакансий
Чтобы вам было легче и комфортнее найти работу после обучения, чувствовать поддержку и получать помощь и ответы на вопросы, обращайтесь в Центр карьеры. Вы научитесь создавать продающее резюме, оформлять портфолио, писать сопроводительные письма.
Для наших выпускников Центр проводит консультации, на которых наши HR-специалисты профессионально помогут: понять, на какую зарплату вы можете претендовать, подготовят статистику по вашей позиции), составить план поиска работы, правильно коммуницировать с работодателем на всех этапах работы.
Оставить заявку на бесплатное обучение IT-профессии можно на нашем сайте.