Выбрать главу

<script>

alert("hello, world!");

</script>

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

Сделаем еще шаг. Вместо hello, world! укажите свои имя и фамилию. Вот пример кода, в котором использовано мое имя:

<script>

alert("Kirupa Chinnathambi!");

</script>

Запустите приложение, и тогда вы увидите свое имя в диалоговом окне (рис. 1.6).

Рис. 1.6. Теперь в диалоговом окне отображается ваше имя

Проще простого, не так ли? Вы можете вписать в строку что угодно: имя питомца, название любимого сериала и т. д. — а JavaScript все это отобразит.

КОРОТКО О ГЛАВНОМ

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

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

Если у вас есть какие-либо вопросы относительно этой главы, оставляйте свои сообщения на форуме https://forum.kirupa.com, где вам оперативно ответит кто-то из крутых разработчиков или я.

ЧАСТЬ I. Элементарно, Ватсон

Глава 2. Значения и переменные

Принято считать, что каждый фрагмент данных на JavaScript, предоставляемый или используемый нами, содержит значение. Из уже рассмотренного примера мы узнали, что вместо слов hello, world! могут быть любые слова, с помощью которых мы задаем функцию alert:

alert("hello, world!");

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

Итак, почему это так важно понимать? А все потому, что нам предстоит много работать со значениями. И важно, чтобы эта работа не свела вас с ума. Чтобы облегчить себе жизнь, вам пригодятся умения:

• легко идентифицировать эти значения;

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

Две вещи, на которые предстоит потратить все наше оставшееся время, — это переменные. Давайте рассмотрим их поподробнее.

Использование переменных

Переменная — это идентификатор значения. Чтобы не набирать hello, world! каждый раз, когда вы хотите использовать этот фрагмент для написания кода приложения, можно присвоить эту фразу переменной и использовать ее тогда, когда нужно. Еще чуть-чуть, и вам станет гораздо понятнее — я обещаю!

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

let myText

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

Давайте исправим это через инициализацию переменной значением. К примеру, hello, world!.

let myText = "hello, world!";

С этого момента при выполнении кода значение hello, world! будет ассоциироваться с нашей переменной myText. Теперь соберем все части в единое выражение. Если у вас все еще открыт файл hello_world.htm, замените содержимое тега script следующим (или создайте новый файл, добавив в него следующий код):

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>An Interesting Title Goes Here</title>

<style>