promise
new Promise()
参数为函数 ()=>{} // 里面有两个参数,一个是成功调用的函数,一个是失败调用的函数
内容为异步机制
// promise可以把异步的代码块变为同步代码块 // 一个参数为成功,一个是失败
let promise = new Promise((resolve,reject)=>{
// 这个函数是promise包装的函数
// resolve()成功调用的函数
// reject()失败调用的函数
ajax({
url:'https://jsonplaceholder.typicode.com/todos/1',
callback:function(res) {
console.log(res);
resolve(res) // 把响应的数据传给promise.then()
}
})
})
// 监听请求是否成功
// 成功自动调用then函数
promise.then((res)=>{
console.log(res);
})
// 失败自动调用catch()
promise.catch((error)=>{
console.log(error);
})
promise解决异步机制
new Promise((success,err)=> {
ajax({
url:'https://jsonplaceholder.typicode.com/todos/1',
callback:function(res) {
console.log(res);
success(res) // 把响应的数据传给promise.then()
// 第一次才用调用success()方法,后面的几次请求都不需要
}
})
}).then((res)=>{
console.log('第二个请求' + res);
ajax({
url:'https://jsonplaceholder.typicode.com/todos/1',
callback:function(res) {
console.log(res);
}
})
}).then((res)=>{
// 第三个请求
ajax({
url:'https://jsonplaceholder.typicode.com/todos/1',
callback:function(res) {
console.log(res);
}
})
})
promise是为了解决回调地狱的问题(无限的在回调函数里面进行回调函数的调用)
使用步骤
1.先创建一个promise对象(里面可以传递一个函数,这个函数里面可以包含异步的操作)
let promise = new Promise()
2.这个传递的函数里面声明两个参数,这两个参数都是函数(第一个是成功调用的函数,第二个是失败调用的函数)
new Promise((success,errer)=>{//异步操作})
3.将异步操作的代码块放入对应的promise函数中
new Promise((success,errer)=>{
ajax() // 在里面调用成功或失败的函数
})
4.success,errer这两个函数都是返回一个promise对象,里面有两个方法可以接收对应的成功和失败方法调用传递的值
promise.then((res)=>{
console.log(res) // 成功方法调用接收的值
})
promise.catch((error)=>{
console.log(error) // 失败方法调用接收的值
})