一、Generator函数
1.作用:(1)生成迭代器 (2)异步编程的解决方案
异步编程:setTimeout(function(){},3000),ajax,nodejs=>文件的操作(IO)、数据库的操作,回调函数能解决异步编程问题
2. Generator函数形式上来看,Generator 函数是⼀个普通函数,但是有两个特征。
(1)function关键字与函数名之间有⼀个星号;
(2)函数体内部使⽤yield表达式,定义不同的内部状态
3.异步编程 (文件的操作)
1)生成器函数的声明和调用
声明
function * gen(){
yield '111'
yield '222'
yield '333'
}
调用
gen(),注意调用完这个函数后,不会立即执行函数里面的代码,而会返回一个迭代器对象,可以进一步调用迭代器对象的 next方法
第一个next会拿到第一个{value:'111',done:false}
let iterator = gen() //iterator是一个迭代器对象
2)生成器函数的参数传递
gen('qq') function * gen(arg){}
iterate.next('hello') 会将这个参数给上一个yield表达式的返回值
3)生成器函数的实例
4.执行
调⽤ Generator 函数,返回⼀个遍历器对象,代表 Generator 函数的内部指针。以后,每次调⽤遍历器对象的next⽅法,就会返回⼀个有着value和done两个属性的对象。value属性表示当前的内部状态的值,是yield表达式后⾯那个表达式的值;done属性是⼀个布尔值,表示是否遍历结束。
5.next参数
next⽅法可以带⼀个参数,该参数就会被当作上⼀个yield表达式的返回值。
function* gen(x){ let y = yield x+1;
return y
}
let iterator = gen(5);
iterator.next() // 6iterator.next(8) //8
6.generator函数实现⾃定义迭代器创建⼀个类数组对象的类,⽤于⽣成类数组对象,并且实现类数组对象的迭代器函数。
class ArrayLike{
constructor(args){
for(let i=0;i<args.length;i++){
let val = args[i]
this[i] = val;
}
Object.defineProperty(this,'length',{
configurable:true,
enumerable:false,
value:args.length
})
}
// 请你实现迭代函数
* [Symbol.iterator](){
for(let k in this){
let v = this[k]
let index = parseInt(k)
yield {value:v,done:index<this.length?false:true}
}
}
}
let arr = new ArrayLike(['terry','larry','tom']);
console.log(arr);
for(let a of arr){
console.log(a);
}
7.异步任务封装axios的get⽅法可以返回⼀个promise对象,通过yield表达式可以阻塞ajax代码的执⾏,如下代码中,我们需要获取yield表达式的结果,这时候就需要为next⽅法传递参数。
let axios = require('axios');
function* foo(){
let url = 'http://121.199.29.84:8001/index/carousel/findAll'
let resp = yield axios.get(url)
console.log(resp.data);
}
// 这里的执行是比较麻烦的
let iterator = foo();
iterator.next().value.then(resp => {
iterator.next(resp);
});
二、Promise函数
1.Promise 是异步编程的⼀种解决⽅案,⽐传统的解决⽅案——回调函数和事件——更合理和更强⼤。
⼀个 Promise 必然处于以下⼏种状态之⼀:
(1)待定(pending): 初始状态,既没有被兑现,也没有被拒绝。
(2)已兑现(fulfilled): 意味着操作成功完成。
(3)已拒绝(rejected): 意味着操作失败
2.构造函数创建⼀个新的 Promise 对象。
该构造函数主要⽤于包装还没有添加 promise ⽀持的函数。
Promise的实现会⽴即执⾏executor,并传⼊resolve和reject函数 。
resolve函数的作⽤是将Promise对象的状态从“未完成”变为“成功”(即从 pending 变为 resolved),在异步操作成功时调⽤,并将异步操作的结果,作为参数传递出去;
reject函数的作⽤是,将Promise对象的状态从“未完成”变为“失败”(即从 pending 变为 rejected)
let promise = new Promise(excutor)
3.实例⽅法
(1)Promise.prototype.then()
为 Promise 实例添加状态改变时的回调函数,该函数的第⼀个参数是resolved状态的回调函数,第⼆个参数是rejected状态的回调函数,它们都是可选的。
(2)Promise.prototype.catch()
为 Promise 实例指定发⽣错误时的回调函数。是then(null,callback)的别名。(3)Promise.prototype.finally()
该⽅法⽤于指定不管 Promise 对象最后状态如何,都会执⾏的操作
4.静态⽅法
(1)Promise.all(iterable)
这个⽅法返回⼀个新的promise对象,该promise对象在iterable参数对象⾥所有的promise对象都成功的时候才会触发成功,⼀旦有任何⼀个iterable⾥⾯的promise对象失败则⽴即触发该promise对象的失败。这个新的promise对象在触发成功状态以后,会把⼀个包含iterable⾥所有promise返回值的数组作为成功回调的返回值,顺序跟iterable的顺序保持⼀致;如果这个新的promise对象触发了失败状态,它会把iterable⾥第⼀个触发失败的promise对象的错误信息作为它的失败错误信息。Promise.all⽅法常被⽤于处理多个promise对象的状态集合。
(2)Promise.allSettled(iterable)
等到所有promises都已敲定(settled)(每个promise都已兑现(fulfilled)或已拒绝(rejected))。返回⼀个promise,该promise在所有promise完成后完成。并带有⼀个对象数组,每个对象对应每个promise的结果。
(3)Promise.race(iterable)
当iterable参数⾥的任意⼀个⼦promise被成功或失败后,⽗promise⻢上也会⽤⼦promise的成功返回值或失败详情作为参数调⽤⽗promise绑定的相应句柄,并返回该promise对象。
(4)Promise.reject(reason)
返回⼀个状态为失败的Promise对象,并将给定的失败信息传递给对应的处理⽅法(5)Promise.resolve(value)
返回⼀个状态由给定value决定的Promise对象。如果该值是thenable(即,带有then⽅法的对象),返回的Promise对象的最终状态由then⽅法执⾏决定;否则的话(该value为空,基本类型或者不带then⽅法的对象),返回的Promise对象状态为fulfilled,并且将该value传递给对应的then⽅法。通常⽽⾔,如果您不知道⼀个值是否是Promise对象,使⽤Promise.resolve(value) 来返回⼀个Promise对象,这样就能将该value以Promise对象形式使⽤。
三、Async函数
async函数是 generator函数的语法糖,作用是异步函数的同步化
function findAll(){
let r = axios.get(url)
//r是一个承诺对象
}
//从根本上解决了异步函数的问题
async function findAll(){
let r = axios.get(url)
//r是从后台拿到的数据
}
await命令后⾯是⼀个 Promise 对象,返回该对象的结果。如果不是 Promise 对象,就直接返回对应的值。