var использовался во всем коде JavaScript с 1995 по 2015 год.

Затем с 2015 года с введением ES6 (ES2015) были добавлены let и const.

Если вы используете ES6, то var не используется.

Почему?

Что делает компьютер, так это когда мы объявляем переменную, такую ​​как

var x = 1;
  1. создает пространство внутри памяти
  2. называет пространство x
  3. присваивает значение 1 x

Итак, в основном,

a variable is

‘the space created in order to save a value’

or

‘a symbolic name in order to distinguish the space inside the memory’.

var , let и const — все это ключевые слова, используемые при объявлении переменных.

Мы объявляем переменные по многим причинам.

  1. Чтобы сохранить значения
We cannot remember every line of code we write, 
and if we want to make little modification in 1 number used repetitively,
we can simply go to the declaration line and change the value

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

a. If we want to change the value, we don't need to change everything

b.Reduces human error
EX) Can you remember the value of accessKey everytime you try to use it?
  const accessKey ="awlifjewldaawkuebkawu"

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

Они есть:

  1. Передекларирование разрешено
  2. Проблемы в области охвата
  3. Подъем

Итак, сначала для повторного объявления:

var x = 1;
var y = 1;

//var allows for multiple declarations

var x = 100;
//variable declaration without initialization is ignored
var y;

console.log(x); //100
console.log(y); //1

Хотя x было объявлено как «1» в начале кода, его легко переобъявить с помощью строки var x = 100;.

Для Scoping var распознает только блоки кода функций как local scope . Если он объявлен внутри блока, он распознается как global scope. Для более легкого понимания,

var x = 1;

if(true) {
  var x = 10;
}

console.log(x); //10

Оператор внутри if был выполнен, и, поскольку это не функциональный блок, var x = 10; является global scope, в итоге значение x было изменено на 10.

Глядя на функциональный блок,

var x = 1;

function changeVar() {
  var x = 2;
  console.log("var inside the function is: " + x);
}

changeVar();  //"var inside the function is: 2"
console.log("var outside the function is: " + x); 
//"var outside the function is: 1"

Мы можем заметить, что первая строка кода внутри функции, которая вновь объявляет var, сохраняет значение внутри функции.

Наконец, это проблемы, с которыми мы сталкиваемся из-за подъема.

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

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

Темная сторона - - - - - - - - -

1. If you declare many variables, all of it will be read by the browser and
will have a significant negative impact and slow down the application's 
runtime significantly.

2. It can cause unexpected results. If you are writing a long code with 
numerous variables, you might mistakenly use the same variable twice 
without realizing, thus resulting in an error.

Светлая сторона — — — — — — — — —

1. Hoisting provides a more readable function.

2. Can refer to the variable inside the scope before the line it is declared
without a 'reference error'.

Поскольку теперь мы поняли преимущества и недостатки подъема, давайте посмотрим на различия между var, let и const.

вар

Как указано выше, var существовал с самого начала JavaScript.

Это был основной способ объявления переменных до ES6.

Ex) var x = 5;

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

(Если вы не знаете, что такое Scope, быстро прочитайте одну из моих статей о нем: Что такое область действия?)

var также принимает global scope и function scope.

Это означает, что если он будет помещен внутри блока, он все равно будет поднят в глобальную область, создавая результат undefined .

Это означает, что переменная объявлена ​​и инициализирована, но еще не назначена, поэтому принимает значение undefined .

console.log(x); //undefined

{
  var x = 2;
}

Однако, если мы посмотрим на функцию,

function hello() {
  var x = 2;
}

hello();
console.log(x);  //Reference Error

Поскольку он принимает function scope , мы получаем ошибку ссылки при попытке напечатать x .

Это означает, что если мы используем var внутри любого for, if, etc..., он станет глобальной переменной.

console.log(x);   //undefined

if(true) {
  var x = 2;      //assigned `2` inside a block => global scope
}

console.log(x);   //2

Итак, резюмируя,

scope : глобально/функция

use : можно обновить или переобъявить

hoisting : разрешено

Давайте посмотрим на let и const

пусть, константа

Во-первых, самое большое отличие состоит в том, что они являются переменными блочной области видимости.

Например,

console.log(x);   //ReferenceError: x is not defined
console.log(y);   //ReferenceError: y is not defined

{
  let x = 2;
  const y = 3;

}

console.log(x);   //ReferenceError: x is not defined
console.log(y);   //ReferenceError: y is not defined

Другое дело, что они оба не могут быть повторно объявлены.

As in,

let x = 1;
let x = 2;
console.log(x);  //SyntaxError: Identifier 'x' has already been declared

const y = 1;
const y = 2;
console.log(y);  //SyntaxError: identifier 'y' has already been declared

Кроме того, подъем «не» разрешен.

Однако есть разница.

Основное отличие в том, что,

let : можно обновить

const: нельзя обновить

Значение,

let x = 2;
x++;
console.log(x);  //3 (it is updated)

const y = 2;
y++;
console.log(y); //TypeError: Assignment to constant variable

const буквально означает постоянное число, то есть оно не меняется.

Наконец, чтобы собрать все воедино,

Итак, в этом посте мы говорили о var, let и const.

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