Переменные JavaScript – руководство для начинающих для VAR, Const и пусть

Автор оригинала: FreeCodeCamp Community Member.

Переменные являются фундаментальной концепцией на любом языке программирования. В JavaScript вы можете объявить переменные, используя ключевые слова var, const, или пусть.

В этой статье вы узнаете, почему мы используем переменные, как их использовать, а различия между const, пусть и var.

Какие переменные используются для в JavaScript?

В контексте кодирования данные – это информация, которую мы используем в наших компьютерных программах. Например, ваше имя пользователя Twitter является частью данных.

Большая часть программирования о манипулировании или отображении данных. Для этого программисты нуждаются в способе хранения и отслеживания данных. Давайте продемонстрируем это с примером.

Сначала мы откроем нашу консоль JavaScript. Чтобы запустить консоль JavaScript на Chrome, вы можете использовать Shortcut Ctrl + Shift + J в Windows и Linux. Для Mac используйте CMD + опцию + J.

Как только консоль запустила, подумайте о текущем возрасте вашей собаки или кошки (или любое подобное число, если у вас нет домашних животных) и введите его в консоль.

4

Теперь, что если мы хотим снова ссылаться на этот номер? Мы должны набрать это во второй раз.

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

Представляем переменные в JavaScript

Полезная аналогия – подумать о переменных как ярлыки для наших ценностей. Подумайте о контейнере черники с этикеткой на нем отмеченной черники. В этом примере переменная, Черника , указывает на ценность, что сами черники.

Давайте объявляем переменную, возраст и используйте оператор присваивания (знак равенства), чтобы назначить наше значение 4, к этой переменной. Мы будем использовать ключевое слово var.

var age = 4

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

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

Как использовать ключевое слово var в JavaScript

Ключевые слова в JavaScript являются зарезервированными словами. Когда вы используете ключевое слово var, вы говорите JavaScript, вы будете объявлять переменной.

При использовании ключевого слова var переменные могут быть переназначены. Мы продемонстрируем это, сначала объявляя новую переменную, имя и присвоение ее стоимости Мэдисона.

var name = 'Madison'

Далее мы переназнаем эту переменную, чтобы указать на значение другое имя, Бен.

name = 'Ben'

Теперь, если вы запустите console.log (имя) Вы получите вывод Бена.

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

var year

Здесь мы объявили переменную Год Но это не указывает на какое-либо значение. Позже, если мы хотим, чтобы это указать на значение, мы можем использовать оператор назначения для этого.

Year = 2020

Теперь наш переменный год будет указывать на значение 2020.

Когда JavaScript был впервые создан, единственный способ объявить переменную было с ключевым словом var.

В последних обновлениях JavaScript (Ecmascript2015), Const и Пусть были созданы как другие ключевые слова для объявленных переменных.

Чтобы объяснить, почему им нужно было, мы посмотрим на проблемы с ключевым словом var. Для того, чтобы посмотреть на эти проблемы, мы узнаем о том, какой объем.

Что такое область

Область применения относится к тому, где в наших переменных кода доступны для использования. Когда переменная – Глобально спешины Это означает, что он доступен в любом месте вашей программы. Давайте посмотрим на пример.

Возьмите следующий код и введите его в свою консоль.

var name = 'Bob'
function printName() {
    console.log(name)
}
printName()

Здесь мы создали и назвали функцию, PrintName, которая распечатает значение имени var, Мэдисон Отказ Вы увидите это напечатано в вашей консоли.

Поскольку наш VAR был создан за пределами функции, она имеет глобально находящуюся на уровне. Это означает, что он доступен в любом месте вашего кода, включая внутри любой функции. Вот почему наша функция, PrintName имеет доступ к имени var.

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

function printYear() {
 var year = 2020
}
console.log(year)

Теперь в нашей консоли мы получим ошибку: год не определен. Это потому, что год VAR функционирует. То есть это существует только внутри функции, в которой она была создана. У нас нет доступа к нему за пределами функции, где мы пытаемся добраться до него, когда мы запускаем нашу Console.log.

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

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

Проблемы с ключевым словом var в JavaScript

Давайте посмотрим на другой пример.

Мы создадим переменную, возраст Отказ Далее мы напишем, если утверждение, которое проверяет, имеет ли возрастное значение, и если он будет, возвращает Console.log номер, который удвоит этот возраст.

Это упрощенный пример, но мы впервые проверим, имеет ли возрастное значение, потому что мы хотим убедиться, что мы добавляем допустимое значение.

var age = 27
If (age) {
 var doubleAge = age + age
 console.log(`Double your current age is ${yearPlusTwenty}`)
}

Теперь в нашей консоли вы увидите Удвоить ваш нынешний возраст 47 Отказ

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

doubleAge
47

Как обсуждалось ранее, переменные, созданные с ключевым словом var, функционируют. Функциональные переменные существуют только внутри функции, в которой они были созданы.

Но так как DoubleAge Переменная не внутри функции, что означает, что она была навещена глобально. То есть DoubleAge Переменная теперь доступна в любом месте нашего кода.

Проблема в том, DoubleAge просто переменная, которую мы использовали один раз внутри нашего Если заявление И мы не обязательно нужны это доступно везде в нашем коде. Он имеет «утечку» за пределами заявления, если он был создан, даже если нам это не нужно.

var age = 27
if (age) {
 //We need our doubleAge var only in this block of code in between our curley brackets. 
    var doubleAge = age + age
    console.log(`Double your current age is ${yearPlusTwenty}`)
    
}

doubleAge
47
//our doubleAge var is available outside of these curly brackets, on the global sbope.

Было бы здорово, если бы у нас был способ создать переменную, которая * только * существовала внутри оператора, в котором он был создан. Другими словами, блок кода, который существует между вьющимися скобками.

var age = 27
If (age) {
 //We want our variable to only exist here, where we will use it
 var doubleAge = age + age
 console.log(`Double your current age is ${yearPlusTwenty}`)
}

Чтобы помочь исправить эту проблему, const и пусть ключевые слова были введены в JavaScript.

Как использовать ключевое слово const в JavaScript

Const Работает аналогично Var, но с несколькими большими различиями.

Во-первых, Const это Блок -шок, тогда как var – Функция .

Что такое Блок ?

А Блок Относится к любому пространству между отверстием и закрывающим кронштейном. Это может показаться запутанным вначале. Давайте выпишем наш предыдущий пример, но на этот раз использую Const вместо того, чтобы при объявлении нашего DoubleAge Переменная.

var age = 27
If (age) {
 const doubleAge = age + age
 console.log(`Double your current age is ${yearPlusTwenty}`)
}

Теперь введите DoubleAge в вашу консоль и нажмите Enter. Вы должны получить ошибку, Дублаж не определен. Это потому, что const – это навес для блоков: Он существует только в блоке, который он был определен.

DoubleAge Переменная «попала в ловушку» внутри двух вьющихся скобок.

Используя Const вместо var , наша предыдущая проблема исправлена. Наше DoubleAge VAR больше не «утечка» в нашу глобальную массу ненужно. Вместо этого он существует только внутри блока, в котором он был создан.

Как разные переменные блокировки работают в контексте функций? Чтобы узнать об этом, давайте создадим, а затем вызвать функцию, ReplyX.

function returnX() {
 const x = 1
 return x
}
returnX()

Призывая эту функцию RethnX , мы видим, что наша функция возвращает значение X, которое составляет 1.

Если мы следующим введем х , мы вернемся ShareError: X не определен Отказ Это потому, что функции также считаются блоками, поэтому наше const х будет существовать только в рамках функции.

Следующее, что нужно знать о Const, это то, что он может быть объявлен только один раз. Введите этот код в вашу консоль:

const y = 1
const y = 2

Вы должны увидеть ошибку, Идентификатор «X» уже объявлен.

Это разница между Вари и Констами. В то время как Const даст вам ошибку, позволяя вам знать, что вы уже объявили эту переменную, ключевое слово var не будет.

var x = 1
var x = 2

Переменная х будет указывать на значение 2 без ошибки. Это может вызвать для вас ошибки в качестве программиста, так как, возможно, вы не знали, чтобы переназначить вашу ценность для новой переменной. Таким образом, использование Const может помочь вам, как вы получите ошибку, если вы случайно пытаетесь переназначить переменную.

Это сила Const Ключевое слово, которое было представлено как обновленный и лучший способ создания переменных в JavaScript. Тем не менее, как насчет времени, когда ты сделать Хотите обновить вашу переменную?

Давайте посмотрим на пример, который показывает, почему мы хотели бы сделать это.

Давайте объявляем переменную, взрослый и установите это на ложь Отказ Мы также создадим возраст переменная и установить его на 20 Отказ

конститут

const.

Скажем, мы хотим проверить возраст пользователя и установить нашу переменную для взрослых в FALSE, если возраст старше 18 лет. Мы можем написать заявление о если это сделать для этого.

if (age > 18) {
 adult = true   
}

Что происходит, когда мы запускаем этот код?

Здесь посмотрим Ошибка: Назначение постоянной переменной.

Это связано с тем, что в соответствии с правилами Const Мы не можем редактировать эту переменную. То есть наша переменная возраст уже указывает на значение true, и мы не можем указать это на что-то еще.

Если мы распечатаем взрослый Опять же, мы видим, что он остался прежним и все еще имеет значение ложь Отказ

Мы не можем переназначить наших возраст Переменная и Const работает как ожидалось. Однако, что если мы сделать Хотите переназначить эту переменную?

Часто раз программисты захотят смогут редить их переменные.

Это где наше третье ключевое слово, пусть, входит.

Как использовать ключевое слово в JavaScript

Сначала давайте перейдем на то, как Пусть похож на Const Отказ

Пусть , как Const , является навесным блоком. Если вы заменили const с пусть в наше выше DoubleAge Пример, это будет работать то же самое.

Тем не менее, Пусть отличается от Const в порядке. Переменные, объявленные с Пусть Ключевое слово можно Redeclared, а переменные, созданные с Const ключевое слово не может. Давайте перейдем на примере.

Используя наш тот же пример выше, замените const с пусть. Мы будем держать нашу ведущую переменную как Const со значением 20 Отказ

let adult = false
const age = 20
if (age > 18) {
    adult = true
}

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

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

Обертывание

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

Переменные могут быть объявлены с использованием var, const, или пусть. VAR является функциональным навесом, в то время как Const и пусть с блоком. Переменные Const не могут быть переназначены, а пусть могут быть переменные.

Var, const, и пусть может быть смущенным сначала. Он может помочь прочитать различные учебные пособия, а также тестируйте свой собственный код по-разному, чтобы закрепить ваше понимание.

Наличие сильной основы Var, Const, и позволяет вам не только в начале вашей карьеры JavaScript, но на протяжении всей его полноты.

Спасибо за чтение!

Если вам понравился этот пост, подпишитесь на мой список электронной почты Где я отправляю свои последние статьи и объявить встречи для моего кодирующего книжного клуба.

Если у вас есть отзывы или вопросы на этом посте, не стесняйтесь Tweet Me @ Мэдисонканна.