js通过几类异步函数取得数据
|
这篇文章主要讲解了“js通过四类异步函数获取数据”，文中的讲解内容简单、清晰、详细，对大家学习或是工作可能会有一定的帮助，希望大家阅读完这篇文章能有所收获。下面就请大家跟着小编的思路一起来学习一下吧。 异步函数是js中经常会用到的，它的作用无非就是进行一些异步的操作（处理数据）。那么，常见的异步函数有哪些呢，我们一般又是如何获取异步函数的数据呢？今天这篇文章就是围绕这个问题去写的。 一般正常情况下，js中的函数是一个一个地按照顺序来完成的。但是异步函数可以改变执行顺序。不过异步任务必须在同步任务执行结束之后，从任务队列中依次取出执行。 常见的异步函数一共有四类： 回调函数 promise函数 Generator函数 async/await函数 1. 回调函数 回调函数一般是作为某个函数的入参，然后在函数内部执行这个回调函数。常见的回调函数有ajax，setTimeouut定时器类，dom事件回调等。 testA(cb) { cb(); } setTimeout(() => { console.log('这是一个回调函数') }, 100) 缺点： 不能try catch捕获错误, 不能直接return。 promise promise函数是一种特殊的异步函数，里面包含三种状态：pending、fulfilled(resolved)、rejected。pending是promise的初始状态，resolved表示执行完成且成功的状态，rejected表示执行完成且失败的状态。三个状态不可逆转。 Promise本身是同步，then的内容是异步： let promiseFunc = new Promise((resolve, reject) => { // 执行同步代码 resolve(); }).then((res) => { console.log(res) },(err) => { console.log(err); }) Generator函数 Generator 是一个可以暂停执行（分段执行）的函数，函数名前面要加星号，是一个状态机，封装了多个内部状态。 function *myTest() { yield 'I', yield 'am', yield 'queen' } async/await函数 async修饰符加在函数前面，返回一个promise，可以使用then添加回调函数。 await后跟着一个promise或者一个原始类型的值（会自动转成立即 resolved 的 Promise 对象），等待resolve的结果。任何一个await后的Promise发生reject，整个aysnc都会中断，需要try{}catch(err){}来捕获错误。 async function myTest() { let val = await new Promise((resolve) => { resolve(1) }); } 如何获取异步函数的数据 获取异步函数的数据一般分为三种：回调函数，promise和async和await 回调函数 回调函数的这种很简单，就是直接将数据传进回调函数里作为入参即可。 function getData(cb) { let val = 'a'; cb(val); } getData((data) => { console.log(data); // 'a' }) promise 使用promise来处理异步，主要就是利用resolve成功的回调函数，reject失败的回调函数。 let promiseFunc = new Promise((resolve, reject) => { let n = Math.random(); if (n >= 0.7) { resolve(n); } else { reject(`${n}小于0.7`) } }); promiseFunc.then((data) => { console.log(data); // 0.3小于0.7 }) async await async: 把函数变成异步函数。wait是等待异步函数执行完成。其中await一定要写在async里面 async function myTest() { return '我是测试数据' }; async function getData() { let val = await myTest(); console.log(val); // 我是测试数据 } “js通过四类异步函数获取数据”的内容就介绍到这里了，感谢大家的阅读。 （编辑：银川站长网） 【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容! |
