Promise理解
Promise
了解概念:回调函数。函数被当做参数且满足一定条件后是回调函数
setTimeout(function(){
console.log("3s后执行回调函数"); // 函数参数就是回调函数
},3000);
异步任务:不阻塞后面任务的执行。跨栏式执行叫做异步任务。
const p = new Promise(function(resolve,reject){
setTimeout(function(
let data = "从数据库\网络获得数据";
resolve(data);
let err = "获得数据失败";
reject(err);
),3000);
});
p.then(function(value){
console.log("");
},function(reason){
})
// promise封装读取文件readFile异步函数
// promise封装这种慢动作非常有用
const fs = require("fs");
const p = new Promise(function(resolve,reject){
fs.readFile("./resouse/为学.md",(err,data)=>{
if(err) reject(err); // 失败
resolve(data); // 成功
});
});
p.then(function(value){
console.log(value.toString());
},function(reason){
console.err("读取失败");
})
// promise 封装Ajax/http请求
const p = new Promise(function(resolve,reject){
// 1.Ajax创建对象
const xhr = new XMLHttpRequest();
// 2.初始化
xhr.open("GET","https://api.apiopen.top/getJoke");
// 3.发送
xhr.send();
// 4.绑定事件,处理响应结果
xhr.onreadystatechange = function(){
if(xhr.readyState = 4){
if(xhr.status >=200 && xhr.status<300){
console.log(xhr.response);
}else{
console.error(xhr.status);
}
}
}
});
Promise
中.then()
方法
// 1.先创建一个promise对象
const p = new Promise((resolve,reject)=>{
setTimeout(()=>{
resolve("ok"); // 这条语句是设置p对象的状态为成功 并且可以设置PromiseValue为ok
},1000)
});
// 2.then方法的返回对象也是promise对象 result是对象
const result = p.then((value)=>{
// 如果return 的不是promise对象 ,则result的状态固定是resolve类型的promise
// 如果return 的是promise对象,则result的状态和return的promise对象保持一致
// 如果没有return,而是throw,则result的状态固定是rejected类型的promise
return "123"; // 此时result就是resolve的promise对象
return new Promise((resolve,reject) =>{ // 此时result就是return回的新的promise对象
resolve("ok");
})
throw "...";
},(reason)=>{
})
// Promise对象
Promise{
PromiseStatus : "resolved",
PromiseValue : "ok",
}
由于.then
可以返回promise
对象,所以.then()
可以进行链式回调。这种链式回调解决了回调地狱的问题
p.then((value)=>{
// 异步任务1
},(reason)=>{}).then((value)=>{
// 异步任务2
},(reason)=>{}).then((value)=>{
// 异步任务3
})
Promise
是对普通异步的一种封装,这是一种优化对象,没有promise
也可以用,只是有了可以解决诸如回调地狱的问题
Promise
中.catch()
方法
.catch
其实是一种特殊的.then()
方法,专门用来做Promise
对象为rejected
的时候所做的处理;省略了.then
中第一个回调参数(value)=>{}
.catch((err)=>{ // 最大的用处就是这
console.log(err);
})
转载自:https://segmentfault.com/a/1190000041964439