码迷,mamicode.com
首页 > Web开发 > 详细

JS异步知识点总结

时间:2020-12-31 12:10:41      阅读:0      评论:0      收藏:0      [点我收藏+]

标签:语言   个人   代码实现   timeout   moc   OLE   异步编程   优先   单线程   

  • 异步的概念
  • ajax 编程
  • 异步实现的几种方式
    • 回调函数
    • promise
    • 生成器
    • async await
      异步编程的概念
      有异步编程,就有同步编程
      console.log("Hello"); console.log("World"); for(let i=0;i<5;i++){ console.log(i); } console.log("F71");
      通过上面的代码,我们可以看出同步代码的特点是由上至下依次执行。

异步代码,往往是非常消耗时间的代码,发送网络请求获取数据、读取文件。
console.log("Hello"); console.log("World"); // 发送网络请求,获取数据,然后打印出来 console.log("F71");
上面的代码,如果是以同步的方式来执行,那么“发送网络请求”这个操作就会阻塞后面的代码。

由于我们 js 又是单线程语言。所以当 js 遇到异步的问题的时候,处理的方式是优先处理同步代码,异步的代码扔给异步处理模块。异步处理模块处理完成之后,扔到任务队列里面,然后主线程再一个一个的从任务队列里面去获取异步操作的结果。

  • setTimeout(fn,time) 异步代码

  • setInterval(fn,time) 异步代码
    console.log("Hello"); console.log("World"); setTimeout(function(){ console.log("异步代码一") },3000); setTimeout(function(){ console.log("异步代码二") },1000); console.log("F71");
    Ajax
    ajax 技术一个实现步骤

  1. 创建 XMLHttpRequest 对象(创建一个跑腿的人)
  2. 由这个对象来和服务器进行通信(发送 HTTP 请求)
  3. 欢迎这个人回来,它把数据带回来了
  4. 通过 DOM 技术进行局部的刷新,将带回来的数据渲染在页面上面
mockjs

使用 mockjs 可以生成随机的数据,拦截 ajax 请求。
下面是一个 mockjs 的使用示例:

先来看一下如何生成随机的数据
`

` ##### ajax 具体的代码实现

具体示例看下面的代码:
`


JS异步知识点总结

标签:语言   个人   代码实现   timeout   moc   OLE   异步编程   优先   单线程   

原文地址:https://www.cnblogs.com/wp45945/p/14193718.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!