JavaScript

Курс "JavaScript" является частью учебных материалов кафедры веб-технологий.

Введение

JavaScript (рус. джаваскрипт (яваскрипт — неправильное произношение)) является популярным языком программирования скриптов для веб-страниц и его поддерживает практически любой браузер. JavaScript добавляет интерактивность на веб-страницы.

Что даёт этот язык по сравнению с другими ?

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

1. Возможность создавать клиентские части веб-приложений

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

2. Возможность исследования веб-приложений

JavaScript позволяет изучать работу веб-приложений, взаимодействовать с ними, модифицировать их поведение в браузере (с помощью системы расширений Firefox или скриптов Greasemonkey), обеспечивать их качество (с помощью Selenium, TestComplete и ряда других программных средств).

3. Применимость знаний при программировании на других языках программирования

Согласно Николасу Закасу объектная модель документа — часть JavaScript. А это самый распространённый способ обработки XML-документов. Помимо того, что методы, которые используются для изменения веб-страницы, вполне пригодны для работы с векторной графикой (SVG), математическими формулами (MathML), они ещё и в Java, Python, Ruby, PHP и многих других языках программирования широко используются для работы с XML.

4. Понимание объектно-ориентированной парадигмы

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

Язык очень востребован в сфере веб-технологий, спрос на JavaScript-программистов (хотя желательно и верстальщики должны его знать) есть и он растёт.

Ограничения языка и сложности разработки

Реализация JavaScript в разных браузерах отличается. Код, работающий в IE может оказаться нерабочим в FF, и наоборот.
Необычная реализации ООП (прототип-ориентированный подход).

Урок 1: Hello, World!

Откройте текстовый редактор и создайте веб-страницу index.html. Скопируйте в неё следующий код:

<!DOCTYPE html>
<html>
   <body>
      <script type="text/javascript">

         document.write("Hello World!");

      </script>
   </body>
</html>

Как вы можете видеть, JavaScript добавляется непосредственно в HTML с помощью тега <script>. Тег <script type="text/javascript"> сообщает браузеру, что всё, что находится между этим тегом и конечным тегом </script> является скриптом, а атрибут type="text/javascript" указывает, что скрипт написан на JavaScript. Аналогичным образом для VBScript вы можете использовать атрибут type="text/vbscript". Если не указывать атрибут type, то по умолчанию используется "text/javascript".

Метод document.write() является стандартным способом для отображения текста в окне браузера. Пункт "document" ссылается на страницу HTML в целом (объект Document); далее следует исполняемая команда для объекта документа "write()". В этом случае, вы указали интерпретатору написать классическое "Hello World" на экран.

Урок 2: инструменты разработчика

Обязательно нужен хороший редактор. Он должен иметь:

Подсветку синтаксиса
Автодополнение
Фолдинг (возможность скрыть-раскрыть блок кода)

IDE
Мощные редакторы, позволяют работать с проектом, включая автодополнение по файлам и т.п.

Платные IDE:

Intellij WebStorm
Microsoft Visual Studio
Komodo IDE
и др.

Бесплатные IDE:

Eclipse и на его основе Aptana.
Visual Studio Code
NetBeans
Komodo Edit
и др.

«Легкие» редакторы

Такие редакторы не такие мощные, как IDE, но они быстрые и простые.

TextMate (Mac, платный)
SciTe простой, легкий и очень быстрый (Windows, бесплатный).
Notepad++ (Windows, бесплатный).
Sublime Text 2 (кросс-платформенный, неограниченный бесплатный триал).
Vim, Emacs.

Урок 3: переменные, стандартные типы данных

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

Число (Number) — просто любое числовое значение:

var someNumber = 123;

Строка (String), любое строчное значение.

var someString = "Строка";

Логический (Boolean), т. е. истина («true») и ложь («false»)

var someBoolean = true;

Урок 4: объект Window

Одним из самых ключевых понятий JavaScript являются объекты или если выражаться терминами ООП (Объектно-ориентированное программирование) классы. Итак, каждый объект отвечает за какую-то опцию браузера, вместе они образуют BOM (Browser Object Model, т. е. Объектная модель браузера). Глобальный объект window, о котором мы и будем говорить, отвечает за основные опции браузера такие как, модальные окошки или всплывающие поля запроса «Да» и «Отмена». Его «методы»

Урок 5: объект Location

Урок 6: объект History

Урок 7: DOM - document object model

Смотри также

Книга JavaScript в Викиучебнике

Учебные проекты

15 puzzle — скрипт на JavaScript, реализующий функциональность игры Пятнашки.

Ссылки

При создании этой страницы использовались материалы страницы en:Basic JavaScript согласно лицензии Creative Commons Attribution/Share-Alike 3.0