JavaScript. Подробное руководство, 6-е издание, стр. 3
Третья часть книги представляет собой справочник по базовому API языка. Например, чтобы ознакомиться с прикладным интерфейсом JavaScript для работы с массивами, вы можете отыскать и прочитать раздел «Array» в этой части книги. Четвертая часть - это справочник по клиентскому JavaScript. Например, чтобы ознакомиться с прикладным интерфейсом JavaScript для работы с графикой, определяемым стандартом HTML5 для тега <canvas>, можно отыскать и прочитать раздел «Canvas» в четвертой части книги.
В этой книге мы сначала рассмотрим низкоуровневые основы, а затем перейдем к базирущимся на них высокоуровневым абстракциям. Желательно читать главы, придерживаясь порядка, в котором они следуют в книге. Однако изучение нового языка программирования никогда не было линейным процессом, точно так же и описание языка трудно представить в линейном виде: каждая особенность языка тесно связана с другими особенностями, поэтому данная книга полна перекрестных ссылок - иногда назад, а иногда вперед - на сведения, с которыми вы еще не ознакомились. Эта глава являет собой первый краткий обзор основ языка и прикладного интерфейса клиентского JavaScript и представляет ключевые особенности, чем упрощает более глубокое их изучение в последующих главах.
Изучая новый язык программирования, очень важно стараться пробовать запускать примеры, представленные в книге, изменять их и опять запускать, чтобы проверить, насколько правильно вы понимаете особенности языка. Для этого необходим интерпретатор JavaScript. К счастью, любой веб-броузер включает интерпретатор JavaScript, а если вы читаете эту книгу, у вас, скорее всего, на компьютере установлено более одного веб-броузера.
Далее в этой главе мы увидим, что код на языке JavaScript можно встраивать в HTML-файлы, в теги <script>, и при загрузке HTML-файла этот код будет выполняться броузером. К счастью, нам не требуется поступать так всякий раз, когда нужно опробовать короткий фрагмент программного кода JavaScript. Появление мощного и оригинального расширения Firebug для Firefox (изображено на рис. 1.1 и доступно для загрузки на сайте http://getfirebug.com/) подтолкнуло производителей веб-броузеров к включению в них инструментов веб-разработчика, необходимых для отладки, проверки и изучения. Обычно эти инструменты можно отыскать в меню Tools (Инструменты или Сервис) броузера в виде пункта Developer Tools (Средства разработчика) или Web Console (Веб-консоль). (Броузер Firefox 4 включает собственный встроенный инструмент Web Console, но к настоящему моменту расширение Firebug обладает более широкими возможностями.) Как правило, консоль можно запустить нажатием горячей комбинации клавиш, такой как F12 или Ctrl-Shift-J. Обычно эти инструменты открываются в виде отдельной панели в верхней или нижней части окна броузера, но некоторые броузеры открывают их в отдельном окне (как изображено на рис. 1.1), что часто более удобно.
Панель или окно типичного «инструмента разработчика» включает множество вкладок, позволяющих исследовать структуру HTML-документа, стили CSS, наблюдать за выполнением сетевых запросов и т. д. Среди них имеется вкладка JavaScript console (Консоль JavaScript), где можно вводить строки программного кода JavaScript и выполнять их. Это самый простой способ поэкспериментировать с JavaScript, и я рекомендую использовать его во время чтения этой книги.
В современных броузерах имеется простой переносимый API консоли. Для вывода текста в консоль можно использовать функцию console.log(). Зачастую такая возможность оказывается удивительно полезной при отладке, и некоторые примеры из этой книги (даже в разделе, посвященном базовому языку) используют console.log() для вывода простого текста. Похожий, но более навязчивый способ вывода информации или отладочных сообщений заключается в передаче строки текста функции alert(), которая отображает его в окне модального диалога.
1.1 Базовый JavaScript
Этот раздел представляет собой обзор языка JavaScript, а также обзор первой части этой книги. После этой вводной главы мы опустимся на самый нижний уровень JavaScript: в главе 2 «Лексическая структура» будут описаны основные лексические конструкции JavaScript, такие как комментарии, точки с запятой и набор символов Юникода. В главе 3 «Типы данных, значения и переменные» мы начнем рассматривать более интересные темы: здесь будут описаны переменные JavaScript и значения, которые можно присваивать этим переменным. Ниже приводится пример программного кода, иллюстрирующий предмет обсуждения этих двух глав:
<b>// Все, что следует за двумя символами слэша, является комментарием.</b><b>// Внимательно читайте комментарии: они описывают программный код JavaScript.</b><b>// Переменная - это символическое имя некоторого значения.</b><b>// Переменные объявляются с помощью ключевого слова var:</b><b>var х; // Объявление переменной с именем х.</b><b>// Присваивать значения переменным можно с помощью знака =</b><b>х = 0; // Теперь переменная х имеет значение 0</b><b>х // => 0: В выражениях имя переменной замещается ее значением.</b><b>// JavaScript поддерживает значения различных типов</b><b>х = 1; // Числа.</b><b>х = 0.01; // Целые и вещественные числа представлены одним типом,</b><b>х = "hello world"; // Строки текста в кавычках,</b><b>х = 'JavaScript'; // Строки можно также заключать в апострофы,</b><b>х = true; // Логические значения,</b><b>х = false; // Другое логическое значение.</b><b>х = null; // null - особое значение, обозначающее "нет значения",</b><b>х = undefined; // Значение undefined подобно значению null.</b>Двумя другими очень важными типами данных, которыми могут манипулировать программы на JavaScript, являются объекты и массивы. Они будут рассматриваться в главе 6 «Объекты» и в главе 7 «Массивы» однако они настолько важны, что вы не раз встретитесь с ними, прежде чем дойдете до этих глав.
<b>// Наиболее важным типом данных в JavaScript являются объекты.</b><b>// Объект - это коллекция пар имя/значение или отображение строки в значение.</b><b>var book = { // Объекты заключаются в фигурные скобки.</b><b> topic: "JavaScript", // Свойство "topic" имеет значение "JavaScript", </b>