JavaScript с нуля - [5]
Объявлять и инициализировать переменные в отдельных строках — это круто!
Стоит упомянуть, что объявление и инициализация переменной не обязательно должны быть частью одной инструкции. Можно разделить эти действия на разные строки:
let myText;
myText = "hello, world!";
alert(myText);
На практике мы будем разделять их постоянно.
Изменение значений переменных и ключевое слово const
И наконец, отмечу, что мы можем менять значение переменной, объявленной с let, на что угодно и когда угодно:
let myText;
myText = "hello, world!";
myText = 99;
myText = 4 * 10;
myText = true;
myText = undefined;
alert(myText);
Если вы работали с более требовательными языками, которые не позволяют переменным хранить разные типы данных, то знайте, что эту гибкость JavaScript одни восхваляют, а другие ненавидят. Тем не менее в JavaScript есть способ запретить изменять значения переменной после инициализации. Это можно сделать с помощью ключевого слова const, с которым мы можем объявлять и инициализировать переменные:
const siteURL = "https://www.google.com";
alert(siteURL);
Используя const, мы не можем изменить значение siteURL на что-то иное, чем https://www.google.com. При такой попытке JavaScript начнет ругаться. Несмотря на то что в использовании этого ключевого слова есть свои подводные камни, в целом оно может оказаться очень полезным для предотвращения случайного изменения переменной. Когда придет время, мы рассмотрим подобные подводные камни более подробно.
Почитайте «Область видимости переменных»
Теперь, когда вы знаете, как объявлять и инициализировать переменные, очень важно разобраться с их видимостью. Нужно понимать, при каких условиях можно использовать объявленную переменную. Иначе это зовется областью видимости переменной. Интересно? Тогда прочитайте главу 8 «Область видимости переменных».
КОРОТКО О ГЛАВНОМ
Значения — хранилища для данных, а переменные — легкий способ обратиться к этим данным. В значениях сокрыто много интересных деталей, но на данный момент они вам ни к чему. Просто знайте, что JavaScript позволяет представлять различные значения вроде текста и чисел без шума и пыли.
Вы объявляете переменные, чтобы значения стали более запоминающимися и годными для многократного использования. Это делается с помощью ключевого слова let и имени переменной. Если вы хотите инициализировать переменную со значением по умолчанию, поставьте после имени переменной знак равенства (=) и укажите значение, с которым хотите инициализировать эту переменную.
3. Функции
До сих пор весь написанный нами код не имел никакой структуры и был простым до безобразия:
alert("hello, world!");
С таким кодом все в порядке, особенно учитывая, что он состоит из единственной инструкции. Но в реальном мире нам не отделаться так легко и код, написанный на JavaScript под настоящие задачи в жизни, редко будет таким простым.
Предположим, что нужно отобразить расстояние, пройденное объектом (рис. 3.1).
Рис. 3.1. Пройденное расстояние
Как вы помните еще со школы, чтобы вычислить расстояние, нужно скорость объекта умножить на время его движения (рис. 3.2).
расстояние = скорость × время
Рис. 3.2. Вычисление расстояния
Версия этого выражения на JavaScript будет выглядеть примерно так:
let speed = 10;
let time = 5;
alert(speed * time);
У нас есть две переменные, обозначенные как скорость (speed) и время (time), каждая из которых содержит число. Функция alert отображает результат умножения значений, содержащихся в переменных speed и time. Это весьма буквальная интерпретация уравнения для вычисления расстояния, которое мы только что рассмотрели.
Представим, к примеру, что нам нужно рассчитать расстояние при наличии большего числа значений. Опираясь только на те знания, которые мы освоили к этому моменту, мы запишем код вот так:
let speed = 10;
let time = 5;
alert(speed * time);
let speed1 = 85;
let time1 = 1.5;
alert(speed1 * time1);
let speed2 = 12;
let time2 = 9;
alert(speed2 * time2);
let speed3 = 42;
let time3 = 21;
alert(speed3 * time3);
Не знаю, как вам, но по мне — это полная печалька. Наш код слишком многословный и повторяющийся. Мы уже видели ранее при изучении темы переменных, что повторение не позволяет создавать легкий в сопровождении код и отнимает время.
Подобная проблема полностью решаема с помощью того, что мы еще не раз встретим в этой книге, а именно функций:
function showDistance(speed, time) {
alert(speed * time);
}
showDistance(10, 5);
showDistance(85, 1.5);
showDistance(12, 9);
showDistance(42, 21);
Не пугайтесь того, что этот код только что провернул на ваших глазах. Все просто: укороченный фрагмент кода выполнил ту же работу, что и множество строчек из рассмотренного ранее примера, но только без побочных действий. Мы узнаем о функциях все, в том числе как им удается так превосходно справляться со своей работой, и начнем мы прямо сейчас!
Поехали!
Что такое функция?
На самом базовом уровне функция — не более чем оболочка для некоего кода.
По сути функция:
• группирует инструкции;
• позволяет использовать код многократно.
Вы редко напишете или воспользуетесь кодом, в котором не будет функций, поэтому важно не только ознакомиться с ними, но и разобраться в тонкостях их правильной работы.
