js是单线程

即同一个时间只能做一件事,JavaScript是为处理页面中用户的交互,以及操作DOM而诞生的。比如我们对某个DOM元素进行添加和删除操作,不能同时进行。应该先进行添加,之后在进行删除。

单线程就意味这所有任务都需要排队,前一个任务结束才会执行后一个任务,这样所导致的问题就是:如果JS执行的时间过长,这样就会造成页面的渲染不连贯,导致页面渲染加载阻塞的感觉。

同步和异步

解决上述问题,利用多核CPU的计算能力,HTML5提出Web Worker标准,允许JavaScript脚本创建多个线程,于是,JS中出现和同步和异步

  1. 同步任务都在主线程执行,形成一个执行栈。
  2. JS的异步是通过回调函数实现的。一般而言,异步任务有以下三种类型:
    • 普通事件,click,resize等
    • 资源加载,load,error等
    • 定时器,setInterval,setTimeout等
  3. 异步任务相关回调函数添加到任务队列中(任务队列也称消息队列)
  4. 先执行执行栈中的同步任务。

    异步任务(回调函数)放入任务队列中。

    一旦执行栈中的所有同步任务执行完毕,系统就会按次序读取任务队列中的异步任务,于是被读取的异步任务结束等待状态,进入执行栈,开始执行。

看案例

【js】js执行机制-js单线程-同步和异步的更多相关文章

  1. 深入理解 JS 引擎执行机制(同步执行、异步执行以及同步中的异步执行)

    首先明确两点: 1.JS 执行机制是单线程. 2.JS的Event loop是JS的执行机制,深入了解Event loop,就等于深入了解JS引擎的执行. 单线程执行带来什么问题? 在JS执行中都是单 ...

  2. JS 引擎执行机制

    JS JS 是单线程语音 JS 的 Event Loop 是 JS 的执行机制.类似于 Android Handler 消息分发机制 JS 单线程 技术的出现都跟现实世界里的应用场景密切相关 JS 单 ...

  3. JS代码执行机制

    JS代码从编译到执行 我们写出一段JS代码,JS的引擎并不是按照我们书写的顺序从上到下顺序编译并且执行的,首先是按照自己的规则对我们的代码先进行编译,然后从上到下执行编译的代码. 在全局作用域中,JS ...

  4. js的执行机制

    遇到一个问题,因为自己本身就是菜鸟的原因,弄懂了还是很高兴的. console.log(a) function a() { return "this is function" } ...

  5. 0182 JavaScript执行机制:单线程,同步任务和异步任务,执行栈,消息队列,事件循环

    以下代码执行的结果是什么? [结果是1 2 3 ] console.log(1); setTimeout(function () { console.log(3); }, 1000); console ...

  6. 小tips:在JS语句执行机制涉及的一种基础类型Completion

    看一个如下的例子.在函数 foo 中,使用了一组 try 语句.在 try 中有 return 语句,finally 中的内容还会执行吗? function foo(){ try{ return 0; ...

  7. js中的callback(阻塞同步或异步时使用)

    1.回调就是一个函数的调用过程,函数a有一个参数,这个参数是个函数b,当函数a执行完以后执行函数b, 那么这个过程就叫回调 eg. function a(callback){ alert('paren ...

  8. js为什么是单线程的?10分钟了解js引擎的执行机制

    深入理解JS引擎的执行机制 1.JS为什么是单线程的? 为什么需要异步? 单线程又是如何实现异步的呢? 2.JS中的event loop(1) 3.JS中的event loop(2) 4.说说setT ...

  9. JS 引擎的执行机制

    关于JS引擎的执行机制,首先牢记2点: .JS是单线程语言 JS的Event Loop是JS的执行机制.深入了解JS的执行,就等于深入了解JS里的event loop 关于单线程相对还比较好理解,就是 ...

  10. JS学习笔记:(三)JS执行机制

    首先我们先明确一点:JavaScript是一门单线程语言.单线程也就是说同一时间只能执行一个任务,所有的任务都必须排队顺序执行.那么如果一个任务耗时很长,阻塞了其它任务的执行,就会给用户造成不友好的体 ...

随机推荐

  1. NC16644【字符串的展开】

    正确代码: #include <iostream>#include <algorithm>using namespace std;bool IsSame(char a, cha ...

  2. abap screen表格控件后续增加栏位

    当我们通过screen的表控件(含向导)创建完表格之后,后续想再增加栏位,要先把输入控件拖入表格控件内,再按钮控控件拖进去即可. 注:输入控件的名称和格式要和程序中的一致,否则会显示不出数据 效果图如 ...

  3. String intern的理解

    String s1 = "Programming";   s1在栈内存中,Programming在常量池中. String s2 = new String("Progra ...

  4. oracl ocp认证到底有没有用!!!

    从一个网友听说有个OCP专家认证,我们本地也有,要1万3,问题是我想真的学东西而不是为了考证,不知道这个培训能学到多少呀.

  5. sprinboot多个子模块下 依赖包没有找到 解决方案

    最近因为在使用springboot开发项目,在开发过程中,发现自己的子模块导入通用的模块 在启动中 说找不到这个类 百度下 说我要在pom文件下 pulus 插件 那里 加上这段代码 <conf ...

  6. java抽象类继承抽象类和抽象方法 java抽象类继承抽象类和抽象方法

    抽象类除了不能实例化对象之外,类的其它功能依然存在,成员变量.成员方法和构造方法的访问方式和普通类一样. 由于抽象类不能实例化对象,所以抽象类必须被继承,才能被使用.也是因为这个原因,通常在设计阶段决 ...

  7. mybatis自增主键的获取

    实体类 package org.example.entity; public class User { private Integer id; private String name; private ...

  8. python生成随机中文姓名和拼音

    def sayhello(): print('hellopython') import pinyin import random def random_name(): # 删减部分,比较大众化姓氏 f ...

  9. javaSE-验证码生成

    一.使用Math类的radom() 方法 //生成验证码 String verifcationCode = ""; for (int i = 0; i <= 5; i++) ...

  10. sql-SQL Prompt

    本人用的是win10系统,这里也着重介绍win10系统的激活方式 激活方式: 1.首先系统HOSTS文件添加以下屏蔽网络 127.0.0.1 red-gate.com 127.0.0.1 www.re ...