温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

javascript如何解决异步问题

发布时间:2022-02-22 17:05:14 来源:亿速云 阅读:190 作者:iii 栏目:开发技术

这篇文章主要讲解了“javascript如何解决异步问题”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“javascript如何解决异步问题”吧!

1、使用回调函数


有学过和使用过jQuery的小伙伴就会知道这个方法,这是个将自己作为变量传递给另一个函数的函数,是在主体函数执行完成之后在执行的。代码如下:

let delayWithCallback = (time, callback) => {     console.log('handle...')     setTimeout(() => {         if (typeof callback === 'function') {             callback(`success`)         }     }, time) }

代码中可以看到我们在callback方法里面处理回调问题。

2.使用Promise


这个方法是通过本身构造函数在接受一个函数作为参数,从而分别来表示操作执行成功后的回调函数和异步操作执行失败后的回调函数

,Promise的参数分别是resolve和reject;代码如下:

let index = 1; let delayWithPromise = (time) => {     return new Promise((resolve, reject) => {         console.log(`task${index} handle...`)         index++         setTimeout(() => {             resolve('success')         }, time)     }) }

我们还可以在这个方法之上使用then方法进行回调。代码如下:

let func2 = () => {     console.log('start')     delayWithPromise(1000).then(result => {         console.log(result)         console.log('end')     }) }  func2()

通过代码我们可以知道then这个方式是在Promise.prototype.then()中接收两个参数来实现的。

3.使用async或者await的解决异步问题


由于这两个方法是ES7中的新特性所以关于他们的用法有这些特点:

(1).我们可以在function前面加async关键字就可以表示这是个async函数;而且async的返回值是一个Promise对象,所以我们还可以用then方法添加回调函数。

(2).当我们在使用await的时候后面跟着的应该是个promise对象,如果不是的话就会被转成个含有resolve的Promise对象,而且await是表示在等待promise返回结果了之后再继续执行的。

下面是一个相关的代码:

let func6 = async () => {     console.log('start')     let result = await delayWithPromise(1000);     console.log(result)     console.log('end') } func6()

(3).使用async或者await一个个执行代码如下:

let func7 = async () => {     console.log('start')     let result1 = await delayWithPromise(500)     let result2 = await delayWithPromise(500)     console.dir(result1, result2)     console.log('end') } func7()

当我们使用这个方法的时候这个功能出来是会依照程序一步步来的。还设有500ms的时间间隔。

(4).使用async或者await同时执行方法

let func8 = async () => {     console.log('start')     let [result1, result2] = await Promise.all([         delayWithPromise(500),         delayWithPromise(500)     ])     console.dir(result1, result2) } func8()

感谢各位的阅读,以上就是“javascript如何解决异步问题”的内容了,经过本文的学习后,相信大家对javascript如何解决异步问题这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是亿速云,小编将为大家推送更多相关知识点的文章,欢迎关注!

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI