Chapter 1: Var const let

preface

ECMAScript variables are loosely typed. Variables can hold any type of data. Each variable is just a named placeholder for any value. There are three keywords to declare variables. Var is available in all versions of ECMAScript, while const and let can only be used after ES6

Var declaration

1. A variable is undefined if no value is passed to it

var msg;
console.log(msg)  //undefined

Copy the code

2. Var declaration scope: The variable defined by the var operator becomes a local variable of the function that contains it. If you define a variable inside a function using var, the variable will be destroyed when the function exits

function test(){
	var msg = 'Bear';
}
test();
console.log(msg);/ / an error
Copy the code

3. Var declaration promotion: The following code does not report an error when using var, because variables declared with this keyword are automatically promoted to the top of the function scope

function test(){
	console.log(name);
	var name = 'Bear';
}
test() //undefined
// The reason it doesn't report an error is because the ES runtime treats it as the following code
function test(){
	var name ;
	console.log(name);
	name = 'Bear';
}
test() //undefined
Copy the code

Let statement

  1. Let is similar to var, except that the scope of let declarations is block scope, while the scope of var declarations is function scope
if(true) {var name = 'bear';
console.log(name); //bear
}
console.log(name);//bear

if(true) {let name = 'bear';
console.log(name); //bear
}
console.log(name);// ReferebceError:name not defined

Copy the code

2. Let does not allow duplicate declarations for the same scope. This will cause an error

var name;
var name;
let age;
let age;// Syntax Error: age has been declared
Copy the code
  1. Variables declared by let are not promoted in scope
/ / var will ascend
console.log(name) //undefined
var name = 'bear';
// Let will not be promoted
console.log(age) //ReferenceError Age is not defined
let age = 21;

Copy the code

4. Variables declared by let in global scope do not become properties of window objects (var declarations do).

var name = 'bear';
console.log(window.name);// bear

let age = 21;
console.log(window.age); //undefined
Copy the code

Iteration variables defined by the for loop before the let appear permeate the body of the loop

for (var i = 0; i < 5; i++){ }console.log(i);  / / 5
Copy the code

This problem becomes smaller when you change to let, because the iterated variables are only inside the for loop block

for (var i = 0; i < 5; i++){ }console.log(i);  //ReferenceError I is not defined
Copy the code

The most common problem with var is the declaration and modification of iteration variables

for (var i = 0; i < 5; i++){setTimeout(() = > console.log(i) , 0)}// It will print 55555. You might expect it to print 0, 1, 2, 3, 4
// When the loop exits, the variable holds the value after the loop exits, so 5 is printed five times
Copy the code

This is not the case when using the let variable

for (let i = 0; i < 5; i++){setTimeout(() = > console.log(i) , 0)}// Output 0, 1, 2, 3, 4

Copy the code

Const declaration

Const is similar to let, with the only significant difference that it must be used to initialize variables, and that trying to modify a const variable results in an error

1. Assign values to constants

const name = 'bear';
name = 'jackson' ; / / typeError error
Copy the code

2. Const does not allow repeated declarations

const name = 'bear';
const name = 'jackson' ; / / SyntaxError error
Copy the code

3. The scope of a const declaration is also a block

const name = 'bear';
if(true) {const name = 'jackson';
}
console.log(name) //bear
Copy the code

4. A const declaration limit value applies to the reference to the variable to which it points

const test = {};
test.name = 'bear' ;  // This can run
Copy the code

Four,

1. ES6 is equivalent to splitting var functions into const and let. With let and const, you will find that you do not need var anymore. Using a const declaration lets the browser force variables to be kept constant at runtime, while also quickly catching the unexpected behavior of unexpected assignments. In short, const defines variables that do not change. If they do, let defines them.