箭头函数和解构赋值

开发工具与关键技术： VS   与 ES6
作者：小明同学
撰写时间：2022  年 5  月 24 日
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
1、箭头函数中的 this 指向
箭头函数没有自己的 this
const person = { 
  //箭头函数 
  speak: () => {
   console.log(this); 
   } 
};person.speak(); // window //如果是普通的函数，这里this指向的是person对象

This的指向：
'use strict'; 
const person={ 
    name:"zhangsan", 
    playGame:function(){
     const test=()=>{ 
          console.log(this) 
          }test(); 
     } 
}person.playGame();//this->person const play=person.playGame; play();//严格模式下this->undifined 非严格模式this->window

2、不适用箭头函数的场景
在构造函数中，箭头函数不适用（箭头函数没有自己的this）
需要this指向调用对象的时候
![在这里插入图片描述](https://img-blog.csdnimg.cn/506d36b033fa4a88b243700ad1d55933.png)
![在这里插入图片描述](https://img-blog.csdnimg.cn/45509c472a404dc4bff74fec6414e520.png)


二、解构赋值
解构赋值解析某一数据的解构，将我们想要的东西提取出来，赋值给变量或者常量。 
数组的解构赋值原理
①数组解构赋值
 1..模式匹配、或结构匹配 
[] = [1, 2, 3];//左边是数组，那么右边也是数组 

2.索引值相同的完成赋值
const [a, b, c] = [1, 2, 3]; 
console.log(a, b, c); 

3.不取的，可以直接用逗号跳过
const [,,c]=[1, 2, 3];//不取的数据可以用 , 逗号跳过 
console.log(c);//3 
const [a,b,c]=[1,[2,4,5],3]; 
console.log(a,c);//b为一个数组 

数组的解构赋值的默认值
1.默认值的基本用法
const [a,b]=[]; 
console.log(a,b);//undefined undefined 
const [a=2,b=4]=[]; 
console.log(a,b);//2 4 
const [c=2,d=4]=[3,5]; 
console.log(c,d);//3 5


2.默认值生效的条件 
只有当一个数组成员严格等于（===）undefined 时，对应的默认值才会生效 
![在这里插入图片描述](https://img-blog.csdnimg.cn/38cbad4fc56b459fbc4ca34e1a8c5b27.png)

3.默认值表达式 
如果默认值是表达式，默认值表达式惰性求值的 
const fun1 = () => { 
console.log("我被执行了"); 
return 3; 
}
const [a = fun1()] = [1]; //1 
const [b = fun1()] = [];//会执行fun1函数 
console.log(b);