JS senior

1. Problems of var declaration variables (disadvantages, features)

1. Pre-resolution will be sent, which can be used before declaration

console.log(a) //undefied
var a=10
Copy the code

2. You can declare the same variable repeatedly

var b=10; / / 100 rows
var b=20; / / 1000 rows

var b 
b=10;
b=20;
Copy the code

3. Var is used in the for loop and can be accessed externally

ES5 scope 【 global 】

Var I in for is equal to global var I

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

2. Characteristics of let declaration variables

1. Do not use it before declaring it

// let a **let is not pre-parsed
console.log(a)  / / an error
let a=10
Copy the code

2. Do not declare the same variable repeatedly

let b=10
let b=200

/ / an error
Copy the code

3. Use let in for

[let] have block-level scope (code segment wrapped in {})

for(let i=0; i<5; i++){// I is analogous to a function argument
console.log(i)
}
console.log(i) / / an error
Copy the code

Declare a constant using const

Constants differ from variables and are generally capitalized (all capitalized)

There are also block-level scopes

1. Once declared, it must be assigned

const Data
console.log(Data) / / an error
Copy the code

2. The value cannot be modified

const Data =10
Data =20/ / an error
Copy the code

3. Cannot use it before declaring it (because there is no pre-parsing)

console.log(Data);
const Data =10;
Copy the code

4. Reference type. The reference address cannot be modified, and the value of the reference type can be modified

const Arr =[10.20.30]  // reference address assumption [0x0002]
Arr =[1.2.3]; // Cannot change reference address [0x0002]
Arr[1] =100;
console.log(Arr);
Copy the code

4. Object deconstruction and assignment syntax

 let obj = {
            name: "lh".age: "20".sex: "Male"
        }
Copy the code
// The left side of the equals sign is the global variable and the right side of the equals sign is the object
// We can use the destruct assignment syntax by having the same name as the key value of the object
// Break the value of the object and assign it to the variable
Copy the code

1. Deconstruct everything

let {name,age,sex}=obj
Copy the code

2. Partial deconstruction

let {name}=obj
Copy the code

3. Deconstruct and rename

Use: no.Copy the code
let {name:myName}=obj
Copy the code

4. Use only one of the methods or properties of the encapsulated object

let {random}=Math;
console.log(random());
Copy the code

Array destruct syntax

1. Completely deconstruct

let[a,b,c]=arr; D The global variable is not assignedconsole.log(a,b,c,d);
Copy the code

2. Partial deconstruction

(Purpose: To simplify the code, the more the code is written, the more complex, not necessary)

// An array is an ordered collection of data
// Each individual variable is the 0th
// let [n]=arr;
// console.log(n);

// Just want to deconstruct the first data
// let [,b]=arr;
// console.log(b);
Copy the code

3. Composite structure

let arr2=[1.2.3[10.20.30]].let [a,b,c,[d,e,f]]=arr2
console.log(a,b,c,d,e,f);
Copy the code

4. Application scenarios

 // Demand: Swap the values of two variables
let a = 10, b = 20;
[a, b] = [b, a]
console.log(a, b);
Copy the code

String deconstruction syntax

As with array deconstruction, string nature

var str = 'It's a beautiful day'
console.log(str.length);
console.log(str[2]);
// A string has the index and length characteristics of an array, so it is a pseudo-array
// Can be regarded as an array, using the array destruct syntax
let [a,b,c,d]=str;
console.log(a,b,c,d);
str[1] ='day'
console.log(str); // The string is indexed, cannot be modified, can only be obtained
 var arr = 'What a beautiful day it is! '
console.log(arr[3]);
let [a, b, c, d, e, f] = arr
list(a, b, c, d, e, f)      
function list() {
 console.log(arguments);
}
Copy the code

7. Simplified writing of objects

 let name = 'lh';
        let age = 20;
        let gender = 'male';
// Requirement: Put global variables inside objects
// let obj={
   // name:naem,
   // age:age,
   // gender:gender
// }

// ES6 new syntax
// If the variable name is the same as the key value, we can write the key but not the value inside the object
// value The value is automatically filled
let obj = { name, age, gender,fu }
obj.fu()
 console.log(obj);
function fu(){
     console.log(1111);
}
Copy the code

Set default values for function parameters

//function Function name (parameter = default,...) {}

function fn(a=0,b=0,c=0,d=0){
return  a+b+c+d;
}
Copy the code

Function parameter deconstruction assignment

1. Array parameters are used as arguments

function add([a,b,c]){
    return a+b+c
}
var arr=[1.2.3]
console.log(add(arr));
Copy the code

2. Function arguments are unordered – objects (e.g. $. Ajax methods are interchangeable within URL types

function getVal({x,y,z}){
    Let {x,y,z}=obj
      console.log('x:'+x,'y:'+y,'z:'+z);
}
  var obj={
        z:30.x:10.y:20
        }
        getVal(obj)

        var arr=[10.20.50]
        function add([a,b,c]){
            console.log(a+b+c);
        }
        add(arr)
Copy the code

Rest parameters – Rest parameters

Using rest parameters

Arguments return an array; Arguments return a pseudo-array. Rest arguments can be traversed using foreach, arguments cannot be traversed using foreachCopy the code

【 grammar 】…. parameter

function add(. rest){
      var sum=0
 rest.forEach(function(itme){
       sum+=itme
})
return sum
  }
console.log(add(1.2.3.4.5.6));
function app(. list){
    console.log(list);
}
        app(1.2.3)
        app(1)
Copy the code

Supplement to expand

Residual parameter Gets the remaining parameters of the previous parameter in the format of an array

 // Not sure if there is the first or more entries
 The rest argument is just a name
 // Rest parameters cannot be placed in the middle, they must be placed last
function fn(a,b,c,... d){
      console.log(a,b,c,d);
}
fn(1.2.3.4.5.6.7.8.9.10.11)
Copy the code

Expand the use of operators

1. Use in arrays

let arr=[1.2.3.4] is equivalent to arr[0],arr[1]
console.log(... arr)Copy the code

2. Use it in strings

let str='Eat bangles tonight'
console.log(... str);Copy the code

3. Use it in objects

let obj={
     name:"Three".age:10
}
// console.log(... obj);
// Put the obJ internal key-value pair inside another object
console.log({sex:'male'. obj});Copy the code

Twelve, expand the use of operators

1. The values in the array are used as function parameters

function fn(a,b,c,d){
console.log(a,b,c,d)
}
var arr=[1.2.3.4] fn(... arr)Copy the code

2. Merge arrays


           // If the key is the same, the last one overwrites the previous one
        var arr1=[1.2.3]
        var arr2=[10.20.30]
        var newArr=[...arr1,...arr2]
        console.log(newArr);

        let obj={
            name:'lh'.age:20
        }
        let obj2={
            email:'135'.gender:'male'
        }
        // let newObj=[{...obj,...obj2}]
        // console.log(newObj);
Copy the code

3. Develop

 // Extend object.assign to merge objects
        // Usage: Merge the object starting with the second argument into the first object
     
let  newObj=Object.assign({},obj,obj2);
 console.log(newObj);
Copy the code