реклама
Бургер менюБургер меню

Артём Соболев – JavaScript. Полное руководство от нуля до профессионала (страница 1)

18px

Артём Соболев

JavaScript. Полное руководство от нуля до профессионала.

Книга: JavaScript. Полное руководство от нуля до профессионала.

Введение

Добро пожаловать в мир программирования на JavaScript! Эта книга предназначена для того, чтобы вы не просто выучили синтаксис, а поняли как мыслить, как программист, и как создавать реальные, работающие приложения.

Как пользоваться этой книгой:

1. Читайте последовательно. Не перепрыгивайте главы. Каждая следующая строится на предыдущей.

2. Пишите код. Не просто копируйте примеры, а набирайте их руками. Это тренирует мышечную память.

3. Экспериментируйте. Изменяйте код в примерах. Ломайте его и смотрите, какие ошибки возникают. Это лучший способ учиться.

4. Выполняйте упражнения. Они созданы, чтобы закрепить материал.

-–

Часть I: Фундамент

Глава 1: Ваша первая программа

1.1 Что такое JavaScript?

JavaScript – это язык программирования, который делает веб-страницы живыми. Изначально созданный для браузера, он теперь работает на серверах (Node.js), на мобильных телефонах (React Native, Ionic) и даже на desktop (Electron).

1.2 Где и как писать код?

Для начала нам нужен всего два инструмента:

1. Браузер (Chrome, Firefox, Edge). В нем есть Консоль разработчика.

2. Текстовый редактор (например, VS Code – бесплатный и мощный).

Самый быстрый способ запустить код – использовать Консоль браузера.

· Откройте Консоль: Нажмите F12 или Ctrl+Shift+J (Cmd+Opt+J на Mac) и перейдите на вкладку Console.

· Напишите там свою первую команду: console.log("Hello, World!");

· Нажмите `Enter`. Вы должны увидеть надпись Hello, World!.

console.log() – это команда для вывода информации в консоль. Это наш главный инструмент для отладки и наблюдения за результатом работы кода.

1.3 Запуск кода в HTML-файле

Для более серьезных программ мы будем писать код в отдельном файле с расширением .js и подключать его к HTML.

1. Создайте папку для проекта, например, js-book.

2. Создайте внутри два файла: index.html и script.js.

3. Наполните `index.html` следующим кодом:

```html

<!DOCTYPE html>

<html lang="ru">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<title>Моя первая JS-программа</title>

</head>

<body>

<h1>Смотрите консоль! (F12)</h1>

<!– Подключаем наш JavaScript файл в конце тела документа –>

<script src="script.js"></script>

</body>

</html>

```

1. В файл `script.js` добавьте код:

```javascript

console.log("Hello from external file!");

console.log("Это мой первый скрипт!");

```

1. Откройте файл `index.html` в браузере и снова посмотрите в консоль (F12). Вы увидите два сообщения.

Пояснение: Браузер читает HTML, доходит до тега <script>, загружает и выполняет код из файла script.js, а результаты выполнения выводятся в консоль.

-–

Глава 2: Переменные и константы – ячейки для хранения данных

Программа почти всегда работает с данными: числами, текстом, списками. Чтобы с ними работать, данные нужно где-то хранить. Для этого существуют переменные.

2.1 Объявление переменных: `let`

Чтобы создать переменную (выделить ячейку памяти и дать ей имя), используется ключевое слово let.

```javascript

// Объявляем переменную с именем "message"

let message;

// Записываем в нее данные (оператор присваивания =)

message = 'Hello, JavaScript!'; // Текст (строка) пишется в кавычках

// Выводим значение переменной в консоль

console.log(message); // Hello, JavaScript!

// Можно объявить и сразу присвоить значение (инициализировать)

let userName = 'Анна';

console.log(userName); // Анна