Promise的介绍及基本用法是什么

本期，边肖将为您带来Promise及其基本用法的介绍。文章内容丰富，从专业角度进行分析和叙述。看完这篇文章，希望你能有所收获。

Promise是ES6引入的异步编程的新解决方案。语法承诺是一个构造函数，

用于封装异步操作并获取成功或失败的结果。

承诺构造函数：承诺(执行元){}

Promise.prototype .然后方法

Promise .原型. catch方法

00-1010实例化Promise。

NewPromise()在实例化时接受一个参数，它是一个函数。

这个函数有两个形式参数，解析和拒绝。

varpromise=newPromise((解析，拒绝)=}

//用于处理异步操作。

})我们在这里使用计时器来模拟异步操作。

承诺有三种状态：进行中、成功和失败。

varpromise=newPromise((解析，拒绝)=}

//这是异步操作。

setTimeout(()={ 0

//在这里通过模拟得到数据。

Vardata=“获取的数据”

//得到数据后，我们可以调用resolve和reject方法来改变promise对象的状态。

Resolve(数据)//resolve可以将承诺对象的状态更改为成功，reject()可以将承诺对象的状态更改为失败。

},1000);

})

Promise的基本使用

当承诺对象的状态为成功或失败时，则可以调用方法。

然后方法接受两个参数，这两个参数都是函数类型的值。

当promise对象的状态为成功时，调用then方法的第一个参数。

也就是说，当promise对象的状态为失败时，将调用then方法的第二个参数。

第二个参数是可选的，如果不需要捕获故障，可以省略。

参数分别有一个形式参数，成功的函数称为value，失败的为err。

promise . then(value={ 0

//异步函数中调用resolve(data)时，表示promise对象的状态为成功，则调用then方法的第一个参数。

console.log(值)；//“hello world”值是resolve()方法传递的数据。

}，err={

//异步函数中调用reject(data)时，表示promise对象的状态为failed，则调用then方法的第二个参数。

console . log(err)；//err是reject()方法传递的数据。

})调用then方法then方法的返回结果是Promise对象，对象的状态由回调函数的执行结果决定。

如果回调函数中返回的结果是非承诺类型的属性，则状态为成功，返回值为对象的成功值。

letdata=promise .然后((val)={ 0

//console . log(val . result)；

//返回

回非Promise的情况
    // return val.result
 
    // 返回Promise的情况
    return new Promise( (resolve, reject) => {
        // resolve('ok')
        reject('err')
    })
}, err => {
console.log(err);
})
// 返回非Promise的情况 状态为成功，返回值为对象的成功的值 
// 返回结果是Promise 对象，对象状态由回调函数的执行结果决定
// 抛出错误,状态为失败
console.log(data);

所以then可以链式调用使用方法可参见下面promise应用示例。

promise的catch方法

promise的catch方法是then(null, rejection)的别名，用于指定发生错误时的回调

Promise对象的状态为resolve，就会调用then方法的指定回调函数

const promise = new Promise((resolve, reject) => {
    resolve('ok')
})
promise.then(val => {
    console.log(val);  // ok
}).catch(err => {
    console.log(err);
})

如果promise的状态为rejected就会调用catch方法的回调函数来处理这个问题。

const promise = new Promise((resolve, reject) => {
    reject('err')
})
promise.then(val => {
    console.log(val);
}).catch(err => {
    console.log(err);  // err
})

如果then方法在运行中出现错误也会被catch方法捕获

const promise = new Promise((resolve, reject) => {
    resolve('err')
})
promise.then(val => {
    console.log('ok');    // ok
    throw '出错了！！'     // then里面抛出的错误会继续被catch捕获
}).catch(err => {
    console.log(err);  // 出错了！！
})

promise对象的错误具有冒泡的性质，会一直向后传递，直到被捕获为止。也就是说，错误总是会被下一个catch捕获。

const promise = new Promise((resolve, reject) => {
    resolve('ok')
})
promise.then(val => {
    return new Promise((resolve, reject) => {
        reject('err')
    })
})
.then(val => {
    return new Promise((resolve, reject) => {
        reject('err')
    })
})
.catch(err => {
    // 以上产生的错误都可以被catch捕获到
    console.log(err);  // err
})

一般来说，不要在then方法中定义rejected状态回调函数（即then的第二个参数），而应总是使用catch方法。

promise应用 

promise读取文件，多个文件连续调用

在这个例子中我们用到了Node.js的文件模块

// 读取文件信息
const fs = require('fs')

在下面代码中我们使用了promise包装了异步函数

我们先来看看正常的文件读取操作

// 读取文件信息
const fs = require('fs')
 
// 如果读取失败err就是一个错误对象，读取成功data就是数据
fs.readFile('./01.txt', (err, data) => {
    // 判断是否出现错误，如果读取错误就打印错误对象。
    if (err) {
        console.log(err);
        return
    }
    console.log(data.toString());
})

我们如果想在读取成功之后继续读取文件，就需要在回调函数中继续使用fs.readFile...去读取文件，嵌套层次一多，这样一来就会形成回调地狱。 

接下来我们使用Promise的方式来读取文件

// 读取文件信息
const fs = require('fs')
 
const promise = new Promise((resolve, reject) => {
    fs.readFile('./01.txt', (err, data) => {
        if (err) return reject(err)
        resolve(data)
    })
})
 
promise.then(val => {
    console.log(val.toString());
    // 返回一个Promise对象
    return new Promise((resolve, reject) => {
        fs.readFile('./02.txt', (err, data) => {
            if (err) return reject(err)
            resolve(data)
        })
    })
}, err => {
    console.log(err);
})
// 上一个then里面返回的是一个promise对象，我们可以继续.then
.then(val => {
    console.log(val.toString());
    return new Promise((resolve, reject) => {
        fs.readFile('./03.txt', (err, data) => {
            if (err) return reject(err)
            resolve(data)
        })
    })
}, err => {
    console.log(err);
})
.then(val => {
    console.log(val.toString());
}, err => {
    console.log(err);
})

promise封装ajax请求

封装了ajax请求，使用then获取结果，让代码看起来更加简洁，解决了回调地狱的问题

const promise = new Promise((resolve, reject) => {
    // 创建对象
    const xhr = new XMLHttpRequest()
    // 初始化
    xhr.open("GET", 'https://api.apiopen.top/getSongPoetry?page=1&count=20')
    // 发送
    xhr.send()
    // 绑定事件处理响应结果
    xhr.onreadystatechange = function () {
        // 判断
        // 进入最后一个阶段，所有的响应体都回来了
        if (xhr.readyState === 4) {
            // 判断响应码
            if (xhr.status >= 200 && xhr.status < 300) {
                // 表示成功
                // console.log(JSON.parse(xhr.response));
                resolve(JSON.parse(xhr.response))
            } else {
                reject(xhr.status)
            }
        }
    }
})
// 指定回调
promise.then((val) => {
    console.log(val);
}, err => {
    console.log(err);
})

上述就是小编为大家分享的Promise的介绍及基本用法是什么了，如果刚好有类似的疑惑，不妨参照上述分析进行理解。如果想知道更多相关知识，欢迎关注行业资讯频道。