Руководство для начинающих по объявлению переменных
В JavaScript у нас есть три варианта, когда мы хотим объявить новую переменную. Чтобы быстро освежить в памяти, мы используем переменные в качестве контейнера для хранения значений или данных. Это может варьироваться от числа до строки или массива до даже целой функции. Мы собираемся начать с малого, чтобы мы могли изучить различия и сходства, которые имеют наши операторы объявлений. Давайте прыгнем прямо в него.
Вар
Некоторым из вас это может показаться очевидным, но на самом деле var означает переменная. Это был один из оригинальных способов объявления переменной, когда JavaScript был впервые создан, и он используется до сих пор. При объявлении любой новой переменной мы всегда будем следовать одному и тому же формату. Объявление, имя, значение равно. Давайте взглянем на приведенный ниже пример var, чтобы лучше понять, как выглядит этот формат.
Как видите, мы придерживаемся именно такого формата. Наше объявление var, и мы назвали нашу переменную a. Мы всегда включаем равенства, так как это то, чему равна наша переменная a. И, наконец, у нас есть наше значение, которое было установлено на 10. Мы только что объявили нашу первую переменную! Что произойдет, если мы захотим увеличить значение a на 10 с помощью оператора if? Что ж, у нас есть четыре варианта, поэтому давайте рассмотрим их все.
Все возвращаются
Итак, я, возможно, растянул два на четыре, но на то есть веские причины, как вы увидите позже. В первых двух примерах мы просто присваиваем a плюс 10, а во вторых двух мы присваиваем a сразу 20. Как и следовало ожидать, во всех случаях, если бы мы выводили журнал консоли вне оператора if, значение a все равно было бы равно 20. Верно?
Возвращает
Да, вы были бы правы! После переназначения нашей переменной наш результат всегда будет увеличиваться на 10. Это потому, что var является глобальным, а также областью действия функции. Как я уже говорил ранее, это традиционный способ создания переменных в JavaScript, но ES6 дал нам давно потерянного близнеца var.
Пусть
Let был представлен в 2015 году с выпуском ES6 для JavaScript. Это дало нам новый способ объявления переменной, а также некоторые другие функции по сравнению с var. Но прежде чем мы углубимся в это, давайте взглянем на три примера, показывающих, как мы можем изменить значение нашей переменной b.
Все возвращаются
Как видите, мы изменили значение b на 20, но добились этого двумя разными способами. Разве я не упустил пример? Ну да, но чтобы помочь вам лучше понять разницу. Давайте посмотрим на это сейчас.
Как думаете, что вернется?
Мы получили ошибку, но что эта ошибка говорит нам? Очевидно, это говорит нам о том, что мы не можем получить доступ к нашей переменной b до ее инициализации. Наше изображение ошибки также дает нам визуальное представление о том, где наш код останавливается. После того, как мы объявили нашу переменную b, она должна равняться b, а затем останавливается. Это потому, что b инициализируется прямо здесь и сейчас. На самом деле мы не вызываем наше начальное значение b, мы создаем совершенно новую переменную b в нашем операторе if. Для наглядности давайте посмотрим, что b будет вне оператора if.
Возвращает
Как видите, наша переменная b по-прежнему равна своему начальному значению 10. Это связано с тем, что let является переменной области видимости блока. Когда мы объявили b равным значению 20 в нашем операторе if, мы создали новую переменную с именем b в этом блоке. Как только мы выходим из оператора if, мы выходим из этого блока и возвращаемся к самому внешнему блоку, где наша переменная b равна 10. Но что произойдет, если мы просто переназначим значения, как в двух других примерах?
Оба возвращаются
В обоих случаях, потому что мы не инициализируем новый экземпляр b в нашем операторе if, то есть, так сказать, создаем новый блок. Мы просто просто переназначаем его значение в блоке, в котором он впервые инициализируется. Но у нас все еще есть еще один член семьи, так что держись.
Константа
Последним, но, безусловно, не следует упускать из виду, является const, что, как вы, вероятно, догадались, означает константную переменную. Звучит немного пугающе, что это значит? Ну, говоря очень просто и на самом деле, постоянная переменная не может быть изменена после того, как она была объявлена. Таким образом, в некотором смысле это может быть страшно, если вам нужно изменить значение этой переменной. Давайте посмотрим на пример ниже.
Возвращает
Подождите, я был в состоянии сделать это, хотя? Ну, это потому, что, подобно let, const является переменной области видимости блока. Это означает, что на самом деле мы только что создали новую константу c, равную 20, но только внутри нашего оператора if. Если мы попытаемся сделать значение c плюс 10 нашей константной переменной c, мы столкнемся с той же ошибкой, что не сможем получить доступ к нашей переменной c до ее инициализации. Но что, если мы попытаемся переназначить его?
Возвращает
Неудивительно, что JavaScript даже не позволит нам выдать гораздо более серьезную ошибку типа. Просто нельзя переназначить или изменить значение постоянной переменной после того, как вы ее объявили.
Я хотел бы поблагодарить вас за чтение и надеюсь, что вы узнали что-то новое! Следите за новыми статьями в будущем!
Если вы хотите просмотреть копию этих примеров, чтобы поиграть с ними для себя или просто для справки, вы можете найти ссылку на репозиторий GitHub здесь.
