常用ES6语法

1.let和const

let和const在块级作用域内有效,不会污染全局变量,都存在暂时性死区,只能先声明再使用,且不能重复声明

const声明的是常量(指的是常量对应的内存地址不得改变),必须赋值,只读,但对于对象、数组,里面的值可以改变

let使用经典案例:let命令代替闭包功能
var arr = []
for(var i=0;i<2;i++){
	arr[i] = (function(i){
		return function(){
			console.log(i)
		}
	}())
}
let实现
var arr = []
for(let i=0;i<2;i++){
	arr[i] = function(){
		console.log(i)
	}
}

arr[1]()
结果都是1

2.模板字符串

var name = 'qzx'
console.log(`我是${name}`)
输出:我是qzx

3.解构赋值

赋值:let [a,b,c] = [1,2,3]
交换变量:[x,y] = [y,x]
提取后台返回的json数据:let {data} = res等同于let data = res.data

4.扩展运算符

浅拷贝数组:let newArr = [...arr]
合并数组:[...arr,...newArr]

5.Promise

5.1Promise的基本使用

1三种状态
	pending resolvedrejected
2变化
	pending->resolved
	pending->rejected
3状态的表现
	pending不会触发任何回调
	fufilled会触发then回调
	rejected会触发catch回调
4then和catch改变状态
	then正常返回resolved,里面报错返回rejected
	catch正常返回resolved,里面报错返回rejected
	
// 第一种写法 常见
new Promise((resolve, reject) => {
  setTimeout(() => {
    // 第一次网络请求的代码
    // 成功 --> then
    resolve("success");
    // 失败 --> catch
    reject("fail");
  }, 5000);
}).then((data) => {
  // 第一次处理的代码(成功)
  console.log(data);
}).catch((err) => {
  // 第一次处理的代码(失败)
  console.log(err);
});
// 第二种写法 了解
new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve('success1')
    reject('fail1')
  }, 5000)
}).then(data => {
  console.log(data)
}, err => {
  console.log(err)
})

5.2Promise的链式调用

new Promise((resolve, reject) => {
    setTimeout(() => {
        resolve('resolve1')
    }, 1000)
}).then(data => {
    console.log(data)
    // 第一种
    // return new Promise((resolve, reject) => {
    //     setTimeout(() => {
    //         resolve('1resolve2')
    //     }, 1000)
    // })
    // 第二种
    // return Promise.resolve('2resolve2')
    // 第三种
    return '3resolve2'
}).then(data => {
    console.log(data)
    // return new Promise((resolve, reject) => {
    //     resolve('1resolve3')
    // })
    // return Promise.resolve('2resolve3')
    return '3resolve3'
}).then(data => {
    console.log(data)
})
结果:
resolve1
3resolve2
3resolve3

5.3Pomise.all()

Promise.all([
    new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('res1')
        }, 1000)
    }),

    new Promise((resolve, reject) => {
        setTimeout(() => {
            resolve('res2')
        })
    }, 3000)
]).then(results => {
    console.log(results);
})
结果:['res1','res2']

6.async await

异步回调的终极解决方案
1.直接调用
2.语义化
3.返回值是Promise

7.箭头函数

普通函数的this指向的是调用它的对象

本文参考于:https://juejin.im/post/6844904152850497544#heading-0

原文地址:https://www.cnblogs.com/silent-cat/p/13744141.html