Первый код: консоль и console.log

Начнём знакомство с традиции – выведем приветствие в консоль. Для этого используется console.log(...). В браузере консоль есть в инструментах разработчика (клавиша F12), а в наших уроках она находится прямо под редактором.

Текст, который нужно вывести, берётся в кавычки – одинарные или двойные, JavaScript принимает обе. Такой текст в кавычках называется строкой – чуть позже разберёмся с ней подробнее.

console.log умеет выводить разные значения

Текст берём в кавычки. Числа – нет:

values.jsjs
console.log('Привет');console.log(42);console.log(2 + 2);
Консоль
Привет
42
4
JavaScript умеет считать и выполнять привычные операции.

За один вызов можно передать несколько значений:

multi.jsjs
console.log('Итого:', 2 + 3);console.log('Осталось мест:', 10 - 3);
Консоль
Итого: 5
Осталось мест: 7
Значения перечисляются через запятую и печатаются в одну строку через пробел.

Ошибки – это нормально

Ошибка не означает, что вы «сломали программу». Обычно JavaScript прямо сообщает, что ему не понравилось.

Например, забудем кавычки:

no-quotes.jsjs
console.log(привет)
Консоль
ReferenceError: привет is not defined

JavaScript воспринимает привет уже не как текст, а как имя чего-то в программе. Такого имени нет – получаем ReferenceError.

То же самое с незакрытой кавычкой:

unclosed.jsjs
console.log('привет)
Консоль
SyntaxError: Invalid or unexpected token

Кавычка не закрыта – движок не смог прочитать программу и сообщает SyntaxError, даже не начав её выполнять.

Ошибки будут встречаться постоянно – это нормальная часть программирования. Со временем вы научитесь смотреть на сообщение ошибки как на подсказку: что произошло и где искать причину.

// теперь вы знаете

  1. console.log(...) выводит значения в консоль – так видно, что делает программа
  2. Текст пишется в кавычках, числа – без них
  3. Выражение вроде 2 + 2 сначала вычисляется, поэтому в консоль попадёт 4
  4. В один console.log можно передать несколько значений через запятую
  5. Без кавычек слово воспринимается не как текст, а как имя в программе

Проверьте себя

Что напечатает console.log('2 + 2');?

Что выведет console.log(10 - 3);?

переключают уроки · не работают при фокусе в полях ввода