Изучение нового языка программирования традиционно начинается с программы 'Hello, World!'. Это простая программа, которая выводит приветствие на экран и знакомит с синтаксисом и структурой нового языка.

Hello, World!

Этой традиции уже больше сорока лет, и мы тоже начнем с нее. В первом уроке мы напишем программу Hello, World!. На JavaScript эта программа выглядит так:

console.log('Hello, World!');

Команда console.log() выводит на экран текст, указанный в скобках. Вместо примера можно написать любой другой текст.

console.log('Хекслет - школа программирования');

Команда остается той же, меняется только содержимое скобок. Чтобы программа понимала, что это именно текст, он заключается в кавычки. Можно использовать одинарные '...' или двойные "...", но открывающая и закрывающая кавычки должны совпадать.

console.log("Хекслет - школа программирования");

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

console.log("it's JavaScript"); // апостроф внутри, поэтому двойные кавычки

Значение символов

Код состоит из команд, и каждая из них должна быть написана в определенной форме. Помимо букв, в коде важны кавычки ' и ", скобки () и знаки препинания. Пропущенный или перепутанный знак приведет к тому, что программа не запустится. Попробуйте определить, какую ошибку допустили в каждой из строк?

console.log("it's JavaScript"
console.log(it's JavaScript")
consol.log("it's JavaScript")
console.log('it's JavaScript")
consolelog("it's JavaScript")

Даже небольшое отличие, например одна лишняя буква или другой знак, может привести к тому, что программа не будет работать. Это относится и к регистру, то есть к различию между большими и маленькими буквами. Если в обычном тексте Привет и привет выглядят одинаково, то для JavaScript это разные слова. JavaScript считает console.log, Console.Log и CONSOLE.LOG разными командами, и сработает только первый вариант.

Где практиковаться

Теория усваивается лучше, когда параллельно запускаешь код и видишь результат. Для этого подходит консоль браузера (DevTools), где команды выполняются построчно. Все, что встречается в уроке, стоит пробовать в консоли браузера.

Как это работает технически? Любой написанный код передается в движок JavaScript, который этот код выполняет и выводит на экран результат его работы.

Код                    Движок JS             Экран
┌──────────────────┐   ┌───────────┐   ┌──────────────┐
│ console.log(…)   │──→│JavaScript │──→│ Hello, World!│
└──────────────────┘   └───────────┘   └──────────────┘

Наберите в редакторе код из задания символ в символ и нажмите «Проверить».

console.log('Hello, World!');

Внимание: если вы напишете heLLo, woRld! вместо Hello, World!, то это будет считаться другим текстом, потому что заглавные и строчные буквы — это разные символы. Размер буквы называют регистром, и говорят: регистр — важен! Это касается почти всего в коде, поэтому привыкайте всегда обращать внимание на регистр.