13) 反射
与代理一一对应,为代理提供操作方法:操作set/操作get/操作apply/操作contructor
let proxy = new Proxy(obj, { // 代理
set(target,key,val){
Reflect.set(target,key,val)
},
get(target,key){
return Reflect.get(target,key)
}
})
...
14) Promise
1. axios
异步操作的解决方案,常用于封装ajax
axios就是基于Promise对Ajax的封装
0) 特点
XMLHttpRequests(浏览器) 、http(nodejs)
默认将data(post)转换为json
params(get)
支持Promise
1) nodejs中应用(http)
安装cnpm
$ npm install cnpm -g --registry=https://registry.npm.taobao.org
$ npm init
$ cnpm install axios --save
2) 实例化
axios
配置属性
{
method
url
params
data
}
3) 全局配置
4) 拦截器
5) 快捷方法
2. 原生ajax的封装
function loadArticles(){
// 待定
return new Promise((resolve,reject)=>{
let xhr = new XMLHttpRequest()
xhr.open()
xhr.setRequestHeader()
xhr.send()
xhr.onreadystatechange = function(){
if(this.readyState === 4){
if(this.status === 200){
// 待定-> 成功 (执行then中的回调)
resolve(this.response);
} else {
// 待定 -> 失败(执行catch中的回调)
reject(this.response);
}
}
}
})
}
loadArticles().then().catch().finally()
3. 成员方法
then/catch/finally 返回值都是一个承诺对象
Promise.prototype.then(successHandler[,errorHandler])
Promise.prototype.catch(errorHandler)
等价于
Promise.prototype.then(null,errorHandler)
Promise.prototype.finally(handler)
4. 静态方法
Promise.all([p1,p2,...])
该方法返回值为promise,当p1,p2,...全部执行完毕并且状态resolved的时候,promise的then才会被调用,该then的回调函数的参数是p1,p2,...的运行结果
案例:当查询完所有的班级,渠道后在调用查询学生的接口;查询学生的时候默认查询第一个班级
Promise.all(p1,p2).then((result)=>{
let defaultClazz = result[0].data.data[0]
loadStudent();
})
Promise.race(iterable)
返回值为promise,返回率先改变状态的promise结果
Promise.allSettled(iterable)
返回值为promise,与all不同,当所有的承诺对象状态被确认的时候会执行promise的then,then的参数为结果
Promise.resolve(val)
直接返回一个承诺对象,并且状态为成功
new Promise(resolve => {
resolve(val);
})
Promise.reject(error)
直接返回一个承诺对象,并且状态为失败
new Promise((resolve,reject) => {
reject(error);
})
iterable 可迭代的对象,常见的是数组或set...,可迭代对象中的元素是promise实例
15) 迭代器
0. 执行过程
next() 调用 -> 指针
1. ES6可迭代的对象
数组、字符串、set、map
实例对象可以直接访问Symbol.iterator,构造函数实现了Symbol.iterator接口
// 标准
inteface Iterator {
[Symbol.iterator]():void;
}
// 类 == 构造函数 Array String Set Map
class Array implements Iterator{
[Symbol.iterator]():void{
}
}
let arr = [1,2,3]
arr[Symbol.iterator]()
for(let a of arr){}
2. 触发迭代器执行的场景
...
for-of
new Set()/new Map()
Array.from()
Promise.all()
Promise.race()
16) generator函数
1. 迭代器函数本质上就是一个generator函数
手动实现一个类数组构造函数,并且该构造函数实现了Symbol.iterator接口
function* foo(){
yield 'terry';
yield 'larry';
yield 'tom';
}
2. next参数
next参数可以作为上⼀个yield表达式的返回值
let iterator = foo()
iterator.next(1)
17) 异步函数
async function foo(){
await axios.get(url1)
await axios.get(url2)
}
foo()
迭代器是通过generator函数实现的,generator还可以实现异步函数同步化,但是他的执行比较麻烦,通常借助co模块。async函数与generator函数非常相似,内置了执行器
ES6 DAY4
最新推荐文章于 2024-09-03 17:02:58 发布