zoukankan      html  css  js  c++  java
  • 单线程

    什么是单线程?
    单线程:只有一个线程,同一时间只能做一件事
    原因:避免DOM渲染的冲突
    解决方案:异步
    单线程demo1
    // 循环运行期间,JS执行 和 DOM渲染暂时卡顿
    var i, sum = 0;
      for(i=0; i<100000000; i++){
      sum += i;
    }
    console.log(sum);

    定义一个循环,循环很多次,再打印一个结果,循环那么多次,很耗费时间,在循环过程中,浏览器处于卡顿状态



    单线程demo2

    //alert不处理,js执行和dom渲染暂时卡顿
    console.log(1);
    alert('hello');
    console.log(2);

    不点弹框的确认,不继续走,浏览器卡顿

    不执行完是不会走下一步的。为什么会有单线程,像后端开发,java,c#都有多线程,可以这个线程做这个,哪个线程做哪个,同时多个线程,做多件事情。但是为什么JS只能是单线程,而且和浏览器渲染是同一个线程。原因就是避免dom渲染冲突,
    1、浏览器需要渲染DOM
    2、JS可以修改DOM结构
    3、JS执行的时候,浏览器DOM渲染会暂停(不断修改,不断重新渲染)
    4、两段JS不能同时执行(修改同一个dom就冲突了)
    5、webworker支持多线程,但是不能访问dom。也是避免dom渲染冲突
    那怎么办呢?也不能一直卡那,很多情况下,我们是不需要等在那里的。
    解决方案-异步。
    console.log(100);
    setTimeout(() => {
      console.log(200);
    }, 1000);
    console.log(300);
    console.log(400);

    如果是单线程,1秒钟就在那等着,浏览器卡在那,js也不执行,也关掉,电脑在那呼呼的转。肯定不科学。那么js异步是什么,就是我先打印100,然后1s钟后打印200。我先不管,反正1s以后再执行,先打印300,400,打印之后。还有个1s之后打印200,那么再1s之后打印200.

    console.log(100);
    $.ajax({
      url:'xxxx',
      success: function(result){
        console.log(result);
      }
    })
    console.log(300);
    console.log(400);

    也是异步,先把该执行的执行完了,再做定时不定时的等待。不是异步的都执行完了,再看异步中的任务。

    那么怎么样通过我们先不管,后面再执行,这种真实的实现是怎么样的。这个时候就是事件轮询的过程
    现在异步的解决方案还是有一些问题
    1、没按照书写方式执行,可读性差
    2、callback中不容易模块化,回过头来执行,上面的ajax,success就是callback。
  • 相关阅读:
    左边定宽, 右边自适应方案
    C3 Transitions, Transforms 以及 Animation总结
    ES6中的Rest参数和默认参数
    Vue项目搭建流程 以及 目录结构构建
    在vue组件的stylus样式总 取消search类型的input按钮中默认样式
    JS与JQ绑定事件的几种方式.
    `<img>`放到`<div>`中底部出现空隙 以及解放方案.
    总结
    一道简单的编程题_ 关于定时器.
    mybatis-resultType和resultMap
  • 原文地址:https://www.cnblogs.com/wzndkj/p/10971292.html
Copyright © 2011-2022 走看看