ES6语法笔记

1、var、let、const有啥区别？

1.1、var 有变量提升机制，let和const 没有**

console.log(a)//undefined
console.log(b)// 报错
console.log(c)// 报错
var a = 1
let b = 1
const c = 1

1.2、var 可重复声明同一个变量，let 和const 不行**

var a = 1
var a 
// let b //直接报错
// let b 
// const c //直接报错
// const c 
console.log(a)//1

1.3、var 和let 可以赋值同一个变量，const不行，因为const是针对常量的，但假如const 声明对象为对象类型，那可以对对象里的属性进行重新赋值**

var a = 1
var a = 2

let b = 2 
 b  = 3

// const c = 2 
// c  = 5 // 直接报错
// console.log(c)// 报错

const d = {
  a:1
}
d.a = 3

console.log(a)//2
console.log(b)// 3
console.log(d)// {a:3}

1.4、var 是函数作用域，let和const 是块级作用域**

function  sty(){
  if(true){
    var a =  1
  }
  console.log(a)//1
}
sty()
console.log(a)// 报错

function  sty1(){
  if(true){
    let  a =  1 
    const b = 2
    console.log(a)//1
    console.log(b)//2
  }
  console.log(a)// 报错
  console.log(b)// 报错
}
sty1()

2、解构赋值及拓展运算符（展开语法）

2.1、解构

2.1.1、数组解构

let [a,b,c] = [1,2,3]
console.log(a,b,c);//1 2 3

2.1.2、对象解构

let {name,age} = {name:"小王",age:12}
console.log(name,age);//小王 12

let {name:myname,age:myage} = {name:"小王2",age:123}
console.log(myname,myage);//小王2 123

2.2、拓展运算符（展开语法）

let person = {name: "Amy", age: 15}
let someone = { ...person }
person.name = 'xiao'
console.log(someone,person ); // { name: 'Amy', age: 15 } { name: 'xiao', age: 15 }

let age = {age: 15}
let name = {name: "Amy"}
let person1 = {...age, ...name}
console.log(person1 ); // {age: 15, name: "Amy"}

3、箭头函数

箭头函数和普通函数有什么区别

3.1、this的指向问题

1、箭头函数的this在箭头函数定义时就决定的，箭头函数的this指向定义时外层第一个普通函数的this

let a = {
  b:function (){
    console.log(this) // 指向a这个对象
  },
  c:()=>{
    console.log(this) // 指向window 全局对象
  }
}

a.b()
a.c()

2、箭头函数不可修改指向（call，apply，bind）,

let a = {
  b:function (){
    console.log(this) // 指向b这个对象
  },
  c:()=>{
    console.log(this)
  }
}

let b={
  b:'xxxxxx'
}

a.b().call(b)
a.c().call(b) //报错

3.2：箭头函数不能new(不能作为构造函数使用)

let a = ()=>{
  console.log(this) 
}
let b = new a() // 报错

3.3：箭头函数没有prototype

let a = ()=>{
  return 111
}
console.log(a.prototype);//undefined

3.4：箭头函数没有arguments

let a = ()=>{
  console.log(arguments);

}
a() // 报错

5、promise（之后需要补充相关问题）

5.1、有几种状态

1、pending（进行中）
2、fulfilled（已成功）
3、rejected(已失败)

6、Array的拓展方法

6.1、构造函数方法:Array.from()

将类数组或可遍历对象转换为真正的数组。

let obj = {
  0:1,
  1:2,
  2:3,
  length:3
}
let arr = Array.from(obj)
console.log(arr,obj);//[ 1, 2, 3 ] { '0': 1, '1': 2, '2': 3, length: 3 }

6.2、实例方法：find()，findIndex()，includes()

let obj = [1,4,4,26,8]
let arr = obj.find(a=>a>3)// 返回第一个符合要求的元素
console.log(arr);//4

let arr = obj.findIndex(a=>a>3)//返回第一个符合要求的下标
console.log(arr);//1

let arr = obj.includes(4)// 判断元素是否存在数组中，是返回true,否返回false
console.log(arr);//true

6.3、find和filter的区别

find 返回匹配的第一个值
filter 返回匹配的所有值的集合

let arr = [1,3,4,5,73,6,32,2,4]
let obj1 = arr.find((res)=> res > 4)
console.log(obj1); // 5
let obj2 = arr.filter((res)=> res > 4)
console.log(obj2); // [ 5, 73, 6, 32 ]

6.4、some和every的区别

some和every 返回值都是true，false其中一个，判断方法不一样
some是有一个匹配就返回true,而every是要调用对象所有值都匹配才返回true

let arr = [1,3,4,5,73,6,32,2,4]
let obj1 = arr.some((res)=> res > 4)
console.log(obj1); // true
let obj2 = arr.every((res)=> res > 4)
console.log(obj2); // false

# 8、String的拓展方法：模板字符串
模板字符串可以解析变量，换行，调用函数
```bash
let obj = {
  name:'小明',
  age:22
}
console.log(`${obj.name}
今年${obj.age}岁`);
// 小明
// 今年22岁

function fn(params) {
  return '好玩吧' 
}
console.log(`${fn()}`);// 好玩吧