Лекция 2

Основы синтаксиса

Основы синтаксиса - это правила написания js кода.

Мы сегодня познакомимся как раз таки с ними. По другому - это структура языка.

По сути каждая выполненная программа на js это последовательность инструкций, по другому, это команды, которые мы даем на выполнение. например знакомый нам уже команда Console.log

Команды на Js как вы могли заметить, пишутся через точку с запятой, но js допускает написания кода без этого, если ваши команды написаны на след строчке, НО ЭТО РАБОТАЕТ НЕ ВСЕГДА. пример известной наше команды:

console.log('Привет мир!')
console.log('Ура мой первый код')

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

console.log('Привет мир!'); console.log('Ура мой первый код');

Как видим, наш код заработал.. но как я сказал выше, это может работать не всегда. разберем пример:

console.log('Привет мир!')
['Учимся', 'новый язык JS'],forEach(alert)

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

• Значений

• Операторов

• выражений

• Ключевых слов

• Комментариев

Сегодня слегка их разберем

Значения

В JavaScript есть несколько типов значений (values): фиксированные значения (их называют литэралы), значения констант и значения переменных.

25	// литерал целого числа
23.8	// литерал дробного числа
'JavaScript'	// литерал строки
"JavaScript"	// литерал строки
[]    // литерал массива
[15,7,89]    // литерал массива
{}	// литерал объекта
{
    name: 'Фрилансер',
    surname: 'по жизни'
}    // литерал объекта
(ab|bc)    // литерал регулярного выражения

// В языках программирования константы и переменные
// используются для хранения значений данных.
const MAX_VALUE = 17;    // константа
var section = 'JS';	// переменная
let arr = ['HTML','CSS','JS'];	// переменная

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

Операторы

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

Примеры операторов * / + - = и т.д. console.log('Учим' + ' JS'); например это оператор сложения, в данном случае складываются 2 строки, это можно увидеть в консоли, можете попробовать.

Выражения

Выражение (expression) - это комбинация значений, переменных и операторов, которые либо присваивают переменной значение, либо возвращают какое-то значение без его присваивания. например:

let num = 4; //выражение присвоения
console.log(num);
'Учим' + 'JS';//выражение без присвоения

Здесь мы можем увидеть 2 типа нашего кода, где: Num будет являться именем для присвоения данных, таким образом через console.log(num); мы сможем вывести наше присвоенное выражение, так же попробуйте это сделать. так же второй пример, когда у нас нет присвоения, это то, что мы делали с вами выше

Ключевые слова

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

let num = 'Учим JS'; //указывает браузеру создать переменную
console.log(num);

Здесь ключевым словом будет являться let, Оно указывает браузеру создать переменную.

Всё, что мы проговорили сегодня, мы будем работать более углубленно просто на других уроках.

Блоки иструкций

JavaScript инструкции можно сгруппировать с помощью так называемого блока, по сути фигурных скобок {...}. Как правило, используется в функциях, циклах и так далее.. Примеры блока инструкций:

function name() {
	console.log('Учим');
	console.log('JS');
}
name();

здесь мы как видно на примере сгруппировали 2 команды в одну функцию, а далее просто выводим ее.

Комментарии

Не все инструкции JavaScript являются выполняемыми. Код после двойных косых черт // или между /* и * / рассматривается как комментарий. различия между ними // это одинарный комментарий /* Это многострочный комментарий */ Самое главное, нельзя объединять несколько комментариев вместе, например 2 многострочных, это вызовет ошибку в консоли.

Чувствуительность к регистру

Как мы помним в html и css регистр оч решает, например когда мы писали какое то имя или указывали путь до файла, мы всегда смотрели на то, каким регистром было написано данный путь или название JavaScript является регистрозависимым языком. Это значит, что ключевые слова, переменные, имена функций и другие идентификаторы языка должны содержать одинаковые наборы прописных и строчных букв. Пример:

console.log('Учим JS'); //Без ошибок
.log('Учим JS'); //Ошибка

Пробелы

Рекомендуется добавлять пробелы в инструкции, чтобы сделать код более читаемым. Но нужно иметь ввиду, что JavaScript игнорирует несколько пробелов. Т.е. если мы напишем:

let str = 'Текст';
let str='Текст';

эти строки эквивалентны, но можно заметить, что код с пробелами более читабельный, а так же это является правильно записью. Как правило пробелы принято размещать вокруг операторов: =, +, -, * и /.

Длинна строки

Для лучшей читаемости кода рекомендуется избегать строк с длиной более 80 символов. Если JavaScript инструкция имеет большую длину, то её желательно разорвать. В большинстве случае разрыв инструкции лучше осуществить после какого-нибудь оператора.

//Пример
document.getElementById('text').innerHTML =
	'Текст для некого поля';

Кавычки

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

//Пример
console.log('Учим JS'); // Одинарные
console.log("Учим JS"); // Двойные
console.log(`Учим JS`); // Обратные

Строгий язык

в js с EC5 появилось очень много новых инструкций(команд), это было одно из глобальных обновлений. так вот, для того, чтобы старый код оставался рабочим(т.к. некоторые функции в EC5 были отключены) придумали режим use strict (строгий режим)

console.log('Учим JS');

//"use strict" ниже игнорируется -
//он должен быть в первой строке

"use strict";

// строгий режим НЕ активирован
*/

строгий режим нужно писать всегда самым первым, по другому он не заработает, выше строгого режима можно писать только комментарии.

ДОМАШКА Создай новый проект, подключи к нему файл script.js и в строгом режиме выведи в консоль фразу «Я учу JS»

Так же напиши в комментарии какой вариант вызовет ошибку: //Вариант №1 console.log('Учим JS')

//Вариант №2 console.log('JS') console.log('Учим')

//Вариант №3 console.log('Учим') console.log('JS')

//Вариант №4 console.log('Учим); console.log('JS');

Ну и конечно же, учи теорию.