zoukankan      html  css  js  c++  java
  • JS(异步与单线程)

    JS(异步与单线程)

    题目1.同步和异步的区别是什么,试举例(例子见知识点)

    区别:

    1.同步会阻塞代码执行,而异步不会

    2.alert 是同步,setTimeout 是异步

    题目2.关于 setTimeout

    结果:1 3 5 2 4

    题目3.前端使用异步的场景有哪些

     1.定时任务:setTimeout,setInverval

    2.网络请求:ajax 请求,动态<img>加载

    3.事件绑定

    知识点

    一、什么是异步

    结果:100 300 200

    异步结果:100 300(不做等待) 200

    同步结果:100 200(等待) 300   (会阻塞后面代码的运行)

    对比同步

    结果(同步):100 200(点击确认) 300  

    何时需要异步

    1.在可能发生等待的情况

    2.等待过程中不能像 alert 一样阻塞程序运行

    总之,所有的“等待的情况”都需要异步

    二、前端使用异步的场景

    1.定时任务:setTimeout,setInverval

    2.网络请求:ajax 请求,动态<img>加载

    ajax 请求示例

    结果:

    ajax 请求需要等待

    过程:1.执行第一行,打印  start

              2.执行 $.get 后,函数 data1 会被暂存起来,不会立即执行(单线程的特点,不能同时干两件事)

              3.执行最后一行,打印300

              4.待所有程序执行完,处于空闲状态时,会立马看有没有暂存起来的要执行

             5.发现暂存起来的 $.get 中的 data1 未执行,待请求 data1.json返回 后,立即执行 data1

     动态<img>加载示例

    结果:

    不知道图片何时完成加载,需要等待

     3.事件绑定

    事件绑定示例

    结果:(点击之后才出现 clicked)

     

    不知道用户何时点击,需要等待

    三、异步和单线程

    JS 是单线程的语言,所谓“单线程”就是一根筋,对于拿到的程序,一行一行的执行,直到上面的执行为完成,只能做这一件事

    输出:100 300 200

    这个任务是串行的,不能发生阻塞,使用异步解决这种问题

    过程:1.执行第一行,打印100

               2.执行setTimeout 后,传入setTimeout 的函数会被暂存起来,不会立即执行(单线程的特点,不能同时干两件事)

               3.执行最后一行,打印300

               4.待所有程序执行完,处于空闲状态时,会立马看有没有暂存起来的要执行

               5.发现暂存起来的 setTimeout 中的函数无需等待时间,立即起来执行

    执行程序这样没有问题,但是对于 JS 最初使用的环境 ———— 浏览器客户端 ———— 就不一样了。因此在浏览器端运行的 js ,可能会有大量的网络请求,而一个网络资源啥时候返回,这个时间是不可预估的。这种情况也要傻傻的等着、卡顿着、啥都不做吗?———— 那肯定不行。

    因此,JS 对于这种场景就设计了异步 ———— 即,发起一个网络请求,就先不管这边了,先干其他事儿,网络请求啥时候返回结果,到时候再说。这样就能保证一个网页的流程运行。

  • 相关阅读:
    Mysql中判断一个点是否落在多边形内
    Linux进阶之环境变量文件/etc/profile、/etc/bashrc、/etc/environment
    gitlab打开group_member页面500错误
    jenkins连接k8s集群
    svn备份迁移
    npm管理nodejs版本
    linux远程执行shell脚本或者python脚本无法获取远程主机的环境变量
    ansible-playbook对服务器安装阿里云日志服务agent--ilogtail
    linux安装Arachni进行web网站扫描
    nginx使用免费ssl证书
  • 原文地址:https://www.cnblogs.com/jianghao233/p/8993047.html
Copyright © 2011-2022 走看看