promise 浏览器实现的源码_Promise实现异步

这次给大家带来Promise实现异步,Promise实现异步的注意事项有哪些,下面就是实战案例,一起来看一下。

为了保证可读性,本文采用意译而非直译,并且对源代码进行了大量修改。另外,本文版权归原作者所有,翻译仅用于学习。

使用Promise编写异步代码时,使用reject来处理错误。有时,开发者通常会忽略这一点,导致一些错误没有得到处理。例如:function main() {

asyncFunc()

.then(···)

.then(() => console.log('Done!'));

}

由于没有使用catch方法捕获错误,当asyncFunc()函数reject时,抛出的错误则没有被处理。

这篇博客将分别介绍在浏览器与Node.js中,如何捕获那些未处理的Promise错误。

浏览器中未处理的Promise错误

一些浏览器(例如Chrome)能够捕获未处理的Promise错误。

unhandledrejection

监听unhandledrejection事件,即可捕获到未处理的Promise错误:window.addEventListener('unhandledrejection', event => ···);

这个事件是PromiseRejectionEvent实例,它有2个最重要的属性:

promise: reject的Promise

reason: Promise的reject值

示例代码:window.addEventListener('unhandledrejection', event =>

{

console.log(event.reason); // 打印"Hello, Fundebug!"

});

function foo()

{

Promise.reject('Hello, Fundebug!');

}

foo();

Fundebug的JavaScript错误监控插件监听了unhandledrejection事件,因此可以自动捕获未处理Promise错误。

rejectionhandled

当一个Promise错误最初未被处理,但是稍后又得到了处理,则会触发rejectionhandled事件:

window.addEventListener('rejectionhandled', event => ···);

这个事件是PromiseRejectionEvent实例。

示例代码:window.addEventListener('unhandledrejection', event =>

{

console.log(event.reason); // 打印"Hello, Fundebug!"

});

window.addEventListener('rejectionhandled', event =>

{

console.log('rejection handled'); // 1秒后打印"rejection handled"

});

function foo()

{

return Promise.reject('Hello, Fundebug!');

}

var r = foo();

setTimeout(() =>

{

r.catch(e =>{});

}, 1000);

Node.js中未处理的Promise错误

监听unhandledRejection事件,即可捕获到未处理的Promise错误:

process.on('unhandledRejection', (reason, promise) => ···);

示例代码:process.on('unhandledRejection', reason =>

{

console.log(reason); // 打印"Hello, Fundebug!"

});

function foo()

{

Promise.reject('Hello, Fundebug!');

}

foo();

注: Node.js v6.6.0+ 默认会报告未处理的Promise错误,因此不去监听unhandledrejection事件也没问题。

Fundebug的Node.js错误监控插件监听了unhandledRejection事件,因此可以自动捕获未处理Promise错误。

相信看了本文案例你已经掌握了方法,更多精彩请关注php中文网其它相关文章!

推荐阅读:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
你可以使用 JavaScript 来实现一个简单的 Promise,以下是一个基本的示例: ```javascript class MyPromise { constructor(executor) { this.state = "pending"; this.value = null; this.callbacks = []; const resolve = (value) => { if (this.state === "pending") { this.state = "fulfilled"; this.value = value; this.callbacks.forEach((callback) => this.executeCallback(callback)); } }; const reject = (reason) => { if (this.state === "pending") { this.state = "rejected"; this.value = reason; this.callbacks.forEach((callback) => this.executeCallback(callback)); } }; try { executor(resolve, reject); } catch (error) { reject(error); } } then(onFulfilled, onRejected) { return new MyPromise((resolve, reject) => { const callback = { onFulfilled, onRejected, resolve, reject }; if (this.state === "pending") { this.callbacks.push(callback); } else { this.executeCallback(callback); } }); } executeCallback(callback) { const { onFulfilled, onRejected, resolve, reject } = callback; if (this.state === "fulfilled") { if (typeof onFulfilled === "function") { try { const result = onFulfilled(this.value); resolve(result); } catch (error) { reject(error); } } else { resolve(this.value); } } if (this.state === "rejected") { if (typeof onRejected === "function") { try { const result = onRejected(this.value); resolve(result); } catch (error) { reject(error); } } else { reject(this.value); } } } catch(onRejected) { return this.then(null, onRejected); } static resolve(value) { return new MyPromise((resolve) => resolve(value)); } static reject(reason) { return new MyPromise((_, reject) => reject(reason)); } static all(promises) { return new MyPromise((resolve, reject) => { const results = []; let completedPromises = 0; promises.forEach((promise, index) => { promise.then((result) => { results[index] = result; completedPromises++; if (completedPromises === promises.length) { resolve(results); } }).catch(reject); }); }); } static race(promises) { return new MyPromise((resolve, reject) => { promises.forEach((promise) => { promise.then(resolve).catch(reject); }); }); } } ``` 这个实现包括了基本的 Promise 功能,包括状态的转换、通过 `then` 方法链式调用、错误处理等。同时还包括了静态方法 `resolve`、`reject`、`all` 和 `race`,用于创建和操作 Promise 实例。 请注意,这只是一个简单的 Promise 实现,可能不支持一些高级功能,如异步任务的调度、微任务队列等。在实际项目中,建议使用原生的 Promise 或第三方库来处理 Promise
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值