В вашей жизни как разработчика наступит время, когда вам понадобится хранить некоторую информацию при создании потрясающих приложений. Этот момент произойдет почти через две секунды после того, как вы откроете свой первый index.js. Поэтому лучше всего заняться этой концепцией на раннем этапе.
Переменная позволяет хранить информацию — значение — в слове и делает ее доступной для вас во всем файле или функции javascript, в зависимости от используемого вами объявления. Другими словами: это временный контейнер, в котором вы можете хранить все, что угодно.
const x = 'I am some value'; console.log(x) //'I am some value'
В JavaScript вы объявляете переменную, присваиваете ей значение и используете это значение для дальнейших вычислений. Полезно знать разницу между переменной и значением. Переменная не станет значением, которому вы ее присвоите, а скорее будет коробкой, в которой живет значение.
let y; y = 'Value 1'; console.log(y) // 'Value 1' y = 'Another value'; console.log(y) // 'Another value'
В приведенных выше примерах я делаю то, что считается плохой практикой: называю ваши переменные неописательными именами, такими как x и y. Если вы хотите, чтобы ваш код оставался ясным, используйте описательные имена, описывающие, что представляет собой переменная или что она содержит. Это значительно облегчит вашу собственную жизнь и жизнь разработчиков, которым необходимо уметь читать и понимать ваш код.
Объявления переменных
Как я упоминал ранее, вы должны объявить переменную, прежде чем она сможет существовать. Это просто означает, что вы сообщаете JavaScript, что с этого момента слово будет содержать значение и что вы хотели бы использовать это значение. Существует три официальных объявления переменных JavaScript: var, let и const. Все они имеют свои характеристики, и выбор одного из них повлияет на ваши результаты. Давайте обсудим каждый.
Вар
Переменная ОГ. Некоторое время var был единственным способом объявить переменную. У var есть некоторые проблемы, которые решает его преемник let.
Вар:
- можно переназначить на новое значение
- может быть инициализирован до того, как он будет объявлен
- несколько устарел, и в настоящее время let предпочтительнее, чем var.
var greeting = 'Hello'; // initialized
var greeting = 'Good morning'
function speak() {
console.log(greeting);
}
speak(); // 'Good morning'
var greeting; // declared
Позволять
Преемник var. Let имеет много тех же свойств, но исправляет несколько проблем, которые, казалось, были у var.
Позволять:
- можно переназначить на новое значение
- должен быть объявлен до того, как его можно будет инициализировать
- лучше всего использовать, когда вы уверены, что переменная должна быть переназначена позже.
let greeting;
greeting = 'Good morning';
function speak() {
console.log(greeting);
}
speak(); // 'Good morning';
greeting = 'Good evening';
speak(); // 'Good evening';
Постоянная
Const — это сокращение от "константа", тип переменной, которую нельзя переназначить.
Константа:
- нельзя переназначить на новое значение
- должен быть инициализирован, когда вы объявляете его
- лучше всего использовать, когда вы уверены, что не будете переназначать своей переменной другое значение.
const greeting = 'Good morning';
function speak() {
console.log(greeting);
}
speak(); // 'Good morning'
greeting = 'Good evening'; // Uncaught TypeError: Assignment to constant variable.
Типы переменных
Теперь, когда мы знаем, что означают объявления переменных, давайте взглянем на тип информации, которую может содержать переменная.
Струны
Строка — это фрагмент текста, заключенный в одинарные или двойные кавычки.
const stringExample = 'This variable contains a string. It can be as long as you like!';
Число
Число — это либо целое число (10), либо десятичное число (1,34). Помните, что вы не заключаете числовое значение в кавычки. Если вы это сделаете, JavaScript будет рассматривать его как строку.
const wholeNumberExample = 30; const decimalNumberExample = 0.345;
логический
Логическое значение — это истинное или ложное значение. Значение этих типов переменных может быть только истинным или ложным. Этот тип часто используется в сочетании с условными выражениями JavaScript, в которых проверяется условие.
const booleanExample = true; // Or when using a condition: const conditionalExample = 3 > 2; // true
Множество
Если вы хотите сохранить несколько разных значений в одной и той же переменной, вы обычно можете использовать массив. Массив, заключенный в квадратные скобки, содержит несколько значений, и к нему можно легко получить доступ с помощью номеров индексов. Номера индексов JavaScript начинаются с 0. 0 указывает на первый слот в массиве.
const arrayExample = ['guinea pig', 'cat', 'dog', 'lion']; arrayExample[0]; // guinea pig arrayExample[3]; // lion
Объект
До сих пор типы обычно содержали либо одно значение, либо несколько значений. Объект JavaScript содержит больше информации о значении. Он напоминает реальный объект, например, файл cookie. Файл cookie может содержать информацию об ингредиентах, размере и типе. Объект можно распознать по фигурным скобкам { } или по усам.
const cookieExample = {
type: 'Chocolate',
ingredients: ['flour', 'sugar', 'salt', 'eggs'],
size: 'Large'
}
cookieExample.type // Chocolate
cookieExample.size // Large
Область действия переменных
Когда мы говорим «область действия переменной», мы имеем в виду пространство, в котором можно получить доступ к переменной и использовать ее. Это относится к доступности переменной. Мы обсудим различные области видимости переменных и немного рассмотрим эту концепцию на нескольких примерах.
Глобальный охват
Переменная, объявленная за пределами блока или функции, может использоваться в любом месте в том же файле JavaScript. Var, let и const придерживаются глобальной области видимости при объявлении вне какой-либо функции. Когда переменная инициализируется в глобальной области видимости, она является глобальной переменной.
let name;
const greeting = 'Good morning ';
var restOfGreeting = 'Nice to meet you';
function alertMe() {
name = 'Dumbledore ';
alert(greeting + name + restOfGreeting);
}
name = 'Harry '; // This can be accessed here.
greeting = 'Hello '; // This can be accessed here.
restOfGreeting = 'How are you today?'; // This can be accessed here.
alertMe();
Объем функций
Каждая функция в JavaScript создает свою область видимости. Локальные переменные имеют область действия функции: они создаются при инициализации функции и удаляются при выполнении функции. Var, let и const ведут себя внутри функции одинаково: к ним нельзя получить доступ вне функции.
function alertMe() {
let name;
const greeting = 'Good morning ';
name = 'Dumbledore';
alert(greeting + name);
}
name = 'Harry'; // This cannot be accessed here.
greeting = 'Hello'; // This cannot be accessed here.
alertMe();j
Область блока
Переменные, объявленные внутри блока {}, будут доступны только внутри этого блока {}. Эта сфера является относительно новой. Когда в ES6 (2015) были введены let и const, вместе с ними появилась область действия блока. Let и const нельзя использовать вне блока { }, если они объявлены в этом блоке. Однако к Var можно получить доступ за пределами блока.
{
let name;
const greeting = 'Good morning ';
var restOfGreeting = 'Nice to meet you';
}
name = 'Harry'; // This cannot be accesses
greeting = 'Hello'; // This cannot be accessed
restOfGreeting = 'Goodbye'; // This can be accessed here.
Ключевые моменты:
- Используйте описательные имена переменных
- Используйте let вместо var, если вам нужно переназначить переменную
- Используйте const во всех остальных случаях.
- Помните о области, в которой живет ваша переменная
