1. Variable declaration

Difference between using var and not using var: (in essence, not using var adds an attribute to window)

• Variable promotion exists for variables defined by var, but it does not exist
• Variables defined with var cannot be deleted, and the window attribute can be deleted
• Variables defined with var have an effect on, while variables not defined with var have no effect on

2. let and const commands of es6

Const: use the const command to declare a constant (the unchangeable quantity is called a constant). The constant declared with const cannot be assigned again, otherwise an error will be reported; Assign a value when declaring, otherwise an error will be reported;

const a='es5';
a='es2015';// An error is reported: Assignment to constant variable
//An error will also be reported if the initialization does not assign a value
const b; // Missing initializer in const declaration

Difference between const and var:

• Variables declared by var can be declared repeatedly; const does not allow duplicate declarations
• The variable declared by var belongs to the top-level object of window; const declared variables do not belong to (avoid polluting global variables)
• var has variable promotion; const has no variable promotion. It must be declared before use
• const has a temporary deadband
• const has block level scope

var str = 'es6';
var str = 'es6';
//const repeated declaration will report an error
const str = 'es6';
const str = 'es6'; //'str' has already been declared
//const declares that the variable does not belong to the top-level window object
var str = 'es6';
console.log(str); // es5
console.log(window.str); // es5
const str2 = 'es2015';
console.log(str2); //es2015
console.log(window.str2); //undefined
//Variable promotion
console.log(str);// es5
var str = 'es6'; 
console.log(str2); //Error str2 is not defined
const str2 = 'es6';
//Temporary deadband. It cannot be used before definition. There is a temporary deadband before definition
if(true){
console.log(str2);
const str2 = "es6";
}
//Block level scope
if(true){
var str = "es6";
}
console.log(str); // es5
if(true){
const str2 = "es6";
}
console.log(str2); //str2 is not defined, {} forms a block level scope. Variables declared by const can only be used inside the block level scope

Can constants defined by const really not be changed?

const str3 = 'es6';
str3 = 'es2015'; //Assignment to constant variable
const obj ={name:'leo',age:24};
obj.age = 18;
console.log(obj); // {name: 'leo', age: 18}, age becomes 18, which can be changed
const arr = [1,2,3];
arr[0] = '5';
console.log(arr); //(3) ['5 ', 2, 3], the first value becomes string 5, which can be changed

Why can objects and arrays be changed when the basic type changes and an error is reported?
This is because the storage modes of basic data types (number, string, Boolean, null, undefined) and reference data types (arrays, objects, regular expressions) are different.

The basic data type is stored in the stack memory, and the reference data type is stored in the heap memory. Only the reference address is stored in the stack. When modifying the value in the heap memory, the reference address does not change, so arrays and objects can modify its value. If you want to realize that the value of an object cannot be changed after it is defined, you can use the free () method of the object.

The Object.freeze() method can freeze an object. A frozen object can no longer be modified; If an object is frozen, you cannot add new attributes to the object, delete existing attributes, modify the enumerability, configurability and Writeability of existing attributes of the object, and modify the value of existing attributes. In addition, after freezing an object, the prototype of the object cannot be modified.

const obj ={name:'leo',age:24};
Object.freeze(obj); //Freeze object
obj.age = 18;
console.log(obj); // {name: 'leo', age: 24}, age is still 24, unchanged
//Arrays still apply
const arr = [1,2,3];
Object.freeze(arr); //Freeze array
arr[0] = '5';
console.log(arr); //(3) [1, 2, 3]

Note: freeze() can only freeze shallow data. If an attribute in the object is of reference data type, this value cannot be frozen. If you want to deep freeze, you need to encapsulate the function to freeze

const esObj ={
name:'leo',
age:24,
extension:[1,2,3]
};
Object.freeze(esObj); //Freeze object
esObj.extension[0]= 18;
console.log(esObj ); //The first value of extension in esObj is changed to 18

//Encapsulate frozen object methods. The definition and use of methods will be described in detail later. You need to use the function keyword
function myFreeze(obj){
   Object.freeze(obj);
   Object.keys(obj).forEach(function(key){
        if(typeof obj[key] == 'object'){
          myFreeze(obj[key]);//recursion
        }
   })
}

Let command: used to declare a variable; (it is recommended to use const first. If this value needs to be changed, change it to let, which will be safer)

• Duplicate declarations are not allowed
• Not a Windows top-level object
• There is no variable promotion

//Duplicate declarations are not allowed
let str = 'es6';
let str = 'es6';//Error 'str' has already been declared
//Object that does not belong to the top level of window
let str = 'es6';
console.log(window.str);// undefined
//There is no variable promotion
console.log(str); //Error str is not defined
let str = 'es6';
//Temporary dead zone
if(true){
	console.log(str); //Error cannot access' STR 'before initialization
	let str = 'es6';
}
//Block level scope
if(true){
	let str = 'es6';
	console.log(str); //es6
}
console.log(str); //Error str is not defined

2. Type conversion

Each basic type has a corresponding method: Number(), String(), Boolean()

Fast conversion of simple writing method of data type

1. To boolean type: two exclamation marks (!)
2. To a number, use one dollar plus (+) before the converted value
3. Convert to string, and add an empty string (+) after the converted value

//Turn Boolean
!!0; //false
!!null; //false
!![]; //true
!![1,2]; //true
//Turn number
+null; //0
+undefined; //NaN
+'125a'; //NaN
+'100'; //100
+true; //1
+[];//0
+[1,2,3]; //NaN
+{};//NaN
+{a:1}; //NaN
//To string
[1,2] + ''; //'1,2'
{a:1} + '' //0
{} + ''; //0
'abc' + ''; //'abc'
456 +''; //'456'

3. Operator

1. Addition operation (there is implicit type conversion, which is more inclined to string); As long as there is one string, the other will be converted to a string; When undefined, null, boolean type and number are mixed, everything will be converted into numbers first
2. Relational operators (with implicit type conversions, more numerical)

Note: the learning summary of this content comes from the lecture given by Mr. Sha Yi of Himalayan iceberg studio (reading with you (JavaScript WEB front end))
Muke.com Xie Cheng takes you into the pit quickly ES6