标签:for 设置 font 组成 异步 ret push cat 读取
1. 处理异步操作
2. 是一个构造函数,可实例化
3. 支持链式调用,解决回调地狱问题
二、 promise初使用
const p = new Promise((resolve,reject) => {
setTimeout(()=>{
let n = rand(1,100) //获取1-100随机数
if(n <=30)
resolve(n); //将promise对象状态设置为成功,n作为成功的值传入
else
reject(n);// 设置为失败,n作为失败的值
},1000)
})
//调用then方法 then(fun1(),fun2())
//then方法的参数为两个函数,一个成功时处理函数,一个失败时处理函数
p.then((value) =>{
console.log(‘成功‘) //成功时的处理,value为成功值
},(reason)=>{
console.log(‘失败‘) //失败时的处理,reason为失败值
})
// promise---fs文件读取
cosnt fs = require(‘fs‘)
let p = new Promise((reslove.reject)=>{
fs.readFile(‘./file1/content.txt‘,(err,data)=>{
if(err) reject(err);
resolve(data);
})
})
p.then((value)=>{console.log(value.toString)},(reason)={console.log(reason)})
// promise---发送Ajax
const p = new Promise((resolve,reject)=>{
const xhr = new XMLHttpRequest() //创建
xhr.open(‘GET‘,‘https://api.apiopen.top/getJoke‘)//初始化
xhr.send()
xhr.onreadystatechange = function(){
if(xhr.readyState === 4){
if(xhr.status >=200 && xhr.status <= 300){
resolve(xhr.response)
}else{
reject(xhr.status)
}
}
}
})
p.then((value)=>{
cosole.log(value)
},(reason)=>{
console.log(reason)
})
// util.promisify 该方法可转化为promise对象的封装函数
const util = require(‘until‘)
const fs = require(‘fs‘)
let myReadfile = until.promisify(fs.readFile)
myReadfile(‘./file1/content.txt‘).then(value=>{
....//成功的执行函数
})
// 封装promise ---ajax
function sendAjax(url){
return new Promise((resolve,reject){
const xhr = new XMLHttpRequest()
xhr.open(‘GET‘,url)
xhr.send()
xhr.onreadystatechange = functionz(){
if(xhr.readyState === 4){
if(xhr.status >=200 && xhr.status< 300){
resolve(xhr.response)
}else{
reject(xhr.status)
}
}
}
})
}
sendAjax(‘https://api.apiopen.top/getJoke‘)
sendAjax.then((value)=>{},(reason)=>{})
1. 执行器函数
Promise((excutor)=>{})
(reslove,reject)=>{}
说明:excecutor会在Promise内部立即同步调用,而异步操作在执行器中执行
2. catch方法
专门指定失败的回调
3. promise.resolve/reject
1).promise的属性状态值:PromiseState:‘pending‘/‘rejected‘/‘resloved‘
属性结果值: PromiseResult:
2).resolve/reject是promise的api方法
resolve:let r = Promise.resolve()
如果传入非promise对象则都返回成功的promise对象
如果传入promise对象 ,则返回值为这个传入的promise所确定的成功或失败值
reject:let r = Promise.reject()
无论传入任何值都是失败的,传入什么失败的值就是什么
4. Promise.all
1).该方法的参数为Promise对象组成的数组
2).如果数组里所有的Promise对象都成功,则返回成功promise对象,其结果值为成功的值组成的数组
3).若有Promise对象失败,则返回第一个失败promise对象的失败值
5. Promise.race
1).与上面方法同样是传入promise数组
2).返回值由数组中那个最先被执行的promise对象
6.改变promise对象状态方式
1).resolve(‘success‘) 由pending => fulfilled(resloved)
2).reject(‘error‘) 由pending => rejected
3).抛出错误:throw ‘error
三、 一些关键问题
1.一个promise指定多个成功/失败回调函数,都会调用吗?
当promise改变对应状态时都会调用,所以只有在状态改变时才会执行该类回调
2.then方法返回的是一个promise对象,其状态值为回调函数的返回值,
如果返回值为promise对象,它的状态值就是then返回的promise状态值
3.链式调用和异常穿透:当通过链式调用时,如果需要处理其中的失败,直接在最后catch方法处理
4.如何中断promise链:从其中的某个链中返回pending状态的promise
class Promise { constructor(executor) { this.PromiseState = ‘pending‘ this.PromiseResult = null this.callback = [] //then的参数值容器 const that = this function resolve(data) { //保证状态值只能改一次 if (that.PromiseState !== ‘pending‘) return //设置状态值为成功 that.PromiseState = ‘fullfilled‘ //设置promise结果值 that.PromiseResult = data //实现链式调用 setTimeout(() => { that.callback.forEach(item => { item.onResolve(data) }) }) } function reject(data) { if (that.PromiseState !== ‘pending‘) return //设置状态值为失败 that.PromiseState = ‘rejected‘ //设置promise结果值 that.PromiseResult = data setTimeout(() => { that.callback.forEach(item => { item.onReject(data) }) }) } //设置通过throw 改变状态值 try { //立即执行保证同步调用(执行器函数) executor(resolve, reject); } catch (e) { reject(e) //e为throw ‘error’ 抛出异常时的值 } } //指定原型then方法 then(onResolve, onReject) { const that = this //判断回调函数参数 设置参数默认值 if (typeof onReject !== ‘function‘) { onReject = reason => { throw reason } } if (typeof onResolve !== ‘function‘) { onResolve = value => value } return new Promise((resolve, reject) => { //封装重复函数 function callback(type) { try { let result = type(that.PromiseResult) if (result instanceof Promise) { //if返回对象为promise result.then(v => { resolve(v) }, r => { reject(r) }) } else { //设置返回值的promise对象成功值 resolve(result) } } catch (e) { reject(e) //当抛出异常 } } //console.log(this)// 运用箭头函数的原因 这里的this指向函数定义的代码块 //设置成功的回调执行 if (this.PromiseState === ‘fullfilled‘) { //保证then方法内回调为异步执行 setTimeout(() => { callback(onResolve) }) } //设置失败回调执行 if (this.PromiseState === ‘rejected‘) { setTimeout(() => { callback(onReject) }) } //设置改变状态后再执行then回调(对于回调方式改变状态值) if (this.PromiseState === ‘pending‘) { this.callback.push({ onResolve: function() { //处理promise异步修改对象状态(实现then回调函数执行在异步回调之后) callback(onResolve) }, onReject: function() { callback(onReject) } }) } }) } //添加catch方法 catch (onreject) { return this.then(undefined, onreject) } //给构造函数promise封装resolve 和reject方法 static resolve(value) { return new Promise((resolve, reject) => { if (value instanceof Promise) { value.then(v => { resolve(v) }, r => { reject(r) }) } else { resolve(value) } }) } static reject(reason) { return new Promise((resolve, reject) => { reject(reason) }) } //封装all方法 static all(values) { return new Promise((resolve, reject) => { let count = 0 let arr = [] for (let i = 0; i < values.length; i++) { values[i].then(v => { count++ arr[i] = v if (count === values.length) { resolve(arr) } }, r => { reject(r) }) } }) } //封装race方法 static race(values) { return new Promise((resolve, reject) => { for (let i = 0; i < values.length; i++) { values[i].then(v => { resolve(v) }, r => { reject(r) }) } }) } }
async function fun(){ return 123; } let res = fun()// promiseResult :123
async function fun(){ let p = new Promise((resolve,reject)=>{ resolve(‘ok‘) }) let res = await p console.log(res) // ok }
标签:for 设置 font 组成 异步 ret push cat 读取
原文地址:https://www.cnblogs.com/lxxoflearningconstantly/p/14773145.html