likes
comments
collection
share

Promise理解

作者站长头像
站长
· 阅读数 275

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);
})