首页 > 其他分享 >JS异步解决方案及优缺点

JS异步解决方案及优缺点

时间:2022-10-18 20:45:34浏览次数:67  
标签:异步 函数 await 优缺点 XXX1 JS callback ajax fetch

1. 回调函数

  优点: 解决了同步的问题(只要有一个任务耗时长后面的任务都会等待,会拖延程序执行)

  缺点: 回调地狱  不能用try  catch捕获  不能用 return

setTimeout(() => {
    // callback 函数体
}, 1000)

  

2. promise

  优点: 解决了回调地狱问题

  缺点: 无法取消promise  错误需要通过回调函数捕获

ajax('XXX1', () => {
  // callback 函数体
  ajax('XXX2', () => {
    // callback 函数体
    ajax('XXX3', () => {
      // callback 函数体
    })
  })
})

ajax('XXX1')
  .then(res => {
    // 操作逻辑
    return ajax('XXX2')
  }).then(res => {
  // 操作逻辑
  return ajax('XXX3')
  }).then(res => {
  // 操作逻辑
})

  

3.Generator

  缺点:如果不适用执行器的情况可能阅读性会很差

  特点:可以控制函数的执行,可以配合co函数库使用

function *fetch() {
    yield ajax('XXX1', () => {})
    yield ajax('XXX2', () => {})
    yield ajax('XXX3', () => {})
}
let it = fetch()
let result1 = it.next()
let result2 = it.next()
let result3 = it.next()

 

4. async/await

  优点: 代码清晰,不像promise一大堆   .then 

  缺点:await将异步代码改造为同步代码,如果多个异步操作没有依赖性而使用await 会导致性能降低

async function test() {
  // 以下代码没有依赖性的话,完全可以使用 Promise.all 的方式
  await fetch('XXX1')
  await fetch('XXX2')
  await fetch('XXX3')
}

 

标签:异步,函数,await,优缺点,XXX1,JS,callback,ajax,fetch
From: https://www.cnblogs.com/rlwan/p/16804038.html

相关文章

  • js ES5 arguments & arguments.callee & this All In One
    jsES5arguments&arguments.callee&this&ES6new.targetAllInOnejsES5arguments&arguments.callee&this//ES5arguments&arguments.callee&thisfu......
  • 如何通过JS来实现600多家的物流轨迹查询?
    有朋友在后台问我,说他不懂后端开发、JAVA、PHP、C#、python的话,只会一点JS,但是现在想查询多家快递的物流轨迹,手动查又不太可能实现,自己JS又只会一点点,为此烦恼了很久。这期......
  • python中展示json数据不换行(手动换行)
    https://blog.csdn.net/chichu261/article/details/82784904Settings—>keymap—>在搜索框输入wraps—>选择UseSoftWraps—>之后设置快捷键就可以了。针对第......
  • js栈内存和堆内存
    js栈内存和堆内存的区别栈(stack)会自动分配内存空间,栈内存变量基本上用完就会自动释放。堆(heap)动态分配的内存,大小不定也不会自动释放,只有当所有调用的变量全部销毁之......
  • 记录一次JSP后门的分析
    0x01环境部署首先启动一个tomcat的环境先把这里的代码跑起来先把这里的代码跑起来,访问tomcat在docker中的​​tomcat/conf​​中可以看到账号密码将JSP打包为war包​​jar......
  • go json.Marshal序列化/解析失败的一种情况
    读取mysql返回struct体数据printf时可以打印通过json解析一直为空经过多方测试发现是struct内部变量命名时被写成了小写开头猜测:go定义内部变量/函数时,小写开头为私有,大......
  • json server mock
    参考链接https://github.com/typicode/json-server1. npmijson-server-D或者yarnaddjson-server--dev创建一个jsonserver的目录,这个目录下创建db.json  {......
  • application/x-www-form-urlencoded和application/json
    今天前端传递一个json,我用@RequestBody怎么都接不到这个参数一看请求头是application/x-www-form-urlencoded这个,这样的话,前端只能传递key-value形式的参数但是前端appli......
  • js解析json数据
      js代码constfs_port=require("fs");letrawdata=fs_port.readFileSync("Config.json");json_data=JSON.parse(rawdata);Ip_=json_data.hostport_=json_d......
  • Jmeter添加JSR223对Python的支持
    通过下载:org.python:jython-standalone:2.7.2-MavenCentralRepositorySearchjython-standalone-2.7.2.jar放置到\lib\ext下即可: 打开JSR223取样器即可选择pyt......