javascript编程单线程之同步模式

主流的js 环境都是单线程吗模式执行js 代码, js采用为单线程的原因与最开始设计初衷有关,最早是运行在浏览器端的脚本语言,目的是为了实现页面上的动态交互,实现页面交互的核心就是dom操作,这也就决定了js必须使用单线程的模式来处理,不然就会造成严重的线程同步问题。如果js多个线程同时修改dom元素,此时浏览器就无法明确以那个线程的结果为准,为了避免这种线程同步问题,所以从一开始js就被设置成了单线程模式工作。这里所说的单线程指的是javascript执行环境中负责执行代码的线程只有一个

可以想象成只有一个人来执行任务,一个人一次只能执行一个任务,如果有多个任务就需要排队依次去完成。这种模式最大的优点是更安全更简单,缺点也很明显,遇到某一个特别耗时的任务后面的任务就需要等这个任务的结束,这也就导致整个程序的执行的拖延,出现假死的情况。

  • 优点:更安全、更简单
  • 耗时任务会出现程序假死的情况

为了结局耗时任务的问题,javscript 把 任务的执行分了两种模式,分别是

  • 同步模式(Synchoronous)
  • 异步模式(Asynchronous)

同步模式Synchoronous

代码依次执行,后一个任务要等待前一个任务执行完成,同步执行比较简单,代码的执行顺序就是代码的顺序。单线程大部分都是同步模式。

Console 是输出的打印,Call stack 是执行栈

开始执行 js 会把我们的整体的代码加载进来并放到一个匿名函数里面执行,然后逐行开始执行,

第一行 执行会把 console.log('global begin') 压入调用栈中,控制台打印global begin 执行结束,弹出调用栈

接下来是两个函数的声明,函数的声明不会产生调用所以接着往下执行

接下来是一个foo 函数的调用,会把 foo压入调用栈,foo 函数打印了一个消息,接着执行了 bar 函数,bar 函数也会被放入执行栈中,bar函数执行过程中又打印了一次,bar执行完毕弹出调用栈,紧接着 foo 函数也执行结束,弹出调用栈

最后打印了一个消息,也是一样的压栈,整体代码执行完,执行栈就会被清空掉

这种排队执行的机制下某行代码执行时间过长,后面的任务就会被延迟。我们把这种延迟称为阻塞,这种阻塞对于用户而言会有页面卡顿或者叫卡死,所以需要异步模式来解决程序中无法避免的耗时操作,比如ajax操作,或者nodejs中的大文件读写

更多内容微信公众号搜索充饥的泡饭

小程序搜一搜开水泡饭的博客

javascript编程单线程之同步模式的更多相关文章

  1. javascript编程单线程之异步模式Asynchronous

    异步模式Asynchronous 不会等待这个任务结束才开始执行下一个任务,开启之后立即执行下一个任务,后续逻辑一般会通过回调函数的方式定义,异步模式对js 非常重要,没有异步任务单线程的 js 语言 ...

  2. 并发编程(ReentrantLock&&同步模式之顺序控制)

    4.13 ReentrantLock 相对于 synchronized 它具备如下特点 可中断 可以设置超时时间 可以设置为公平锁 支持多个条件变量,即对与不满足条件的线程可以放到不同的集合中等待 与 ...

  3. JavaScript 单线程之异步编程

    Js 单线程之异步编程 先了解一个概念,为什么 JavaScript 采用单线程模式工作,最初设计这门语言的初衷是为了让它运行在浏览器上面.它的目的是为了实现页面的动态交互,而交互的核心是进行 Dom ...

  4. Javascript教程:js异步模式编程的4种解决方法

    随着人们对网站视觉效果及用户体验的要求越来越高,所以在未来网站的建设中,设计师们开始越来越多的使用了js文件来达到预期的效果,随着js文件的越来越多,令设计师们最头痛的事情也就来了,那就是Javasc ...

  5. Javascript编程模式(JavaScript Programming Patterns)Part 1.(初级篇)

    JavaScript 为网站添加状态,这些状态可能是校验或者更复杂的行为像拖拽终止功能或者是异步的请求webserver (aka Ajax). 在过去的那些年里, JavaScript librar ...

  6. JavaScript异步编程助手:Promise模式

    :Promises是一种令代码异步行为更加优雅的抽象,它很有可能是JavaScript的下一个编程范式,一个Promise即表示任务结果,无论该任务是否完成. 异步模式在Web编程中变得越来越重要,对 ...

  7. JavaScript同步模式,异步模式及宏任务,微任务队列

    首先JavaScript是单线程的语言,也就是说JS执行环境中,负责执行代码的线程只有一个.一次只能执行一个任务,如果有多个任务的话, 就要排队,然后依次执行,优点就是更安全,更简单.缺点就是遇到耗时 ...

  8. Javascript异步编程之setTimeout与setInterval详解分析(一)

    Javascript异步编程之setTimeout与setInterval 在谈到异步编程时,本人最主要会从以下三个方面来总结异步编程(注意:特别解释:是总结,本人也是菜鸟,所以总结不好的,请各位大牛 ...

  9. 《JavaScript编程实战》

    <JavaScript编程实战> 基本信息 原书名:JavaScript programming: pushing the limits 作者: (美)Jon Raasch 译者: 吴海星 ...

随机推荐

  1. Apache DolphinScheduler 项目笔记 — 1. 问题定位和排查问题

    导语: Yuanhao Ji 同学是<暑期 2021 - API 模块 UT 测试问题解决>项目负责人,本文记录了他是如何排查和定位问题. 1. 背景 问题:在部分 UT 中使用 Powe ...

  2. django中的forms组件

    form介绍 用户需要向后端提交一些数据时,我们常常把这些数据放在一个form表单里,采用form标签,里面包含一些input等标签把用户的数据提交给后端. 在给后端提交数据的时候,我们常常也需要对于 ...

  3. Luogu3398 仓鼠找sugar (LCA)

    第一发lg[]没开够RE了,下了数据本地一直停止运行,还以为是dfs死了,绝望一交,A了... 判断\(x\)是否在路径\(s-t\)上,只需满足 \(dep_{x} >= dep_{LCA(s ...

  4. 大数据Hadoop入门教程 | (一)概论

    数据是什么 数据是指对客观事件进行记录并可以鉴别的符号,是对客观事物的性质.状态以及相互关系等进行记载的物理符号或这些物理符号的组合,它是可识别的.抽象的符号. 它不仅指狭义上的数字,还可以是具有一定 ...

  5. flutter系列之:用来管理复杂状态的State详解

    目录 简介 StatefuWidget和State State的生命周期 总结 简介 Flutter的基础是widget,根据是否需要跟用户进行交互,widget则可以分为StatelessWidge ...

  6. K8S中部署apisix(非ingress)

    不使用pvc的方式在K8S中部署apisix-gateway 简介 因为公司项目准备重构,现在做技术储备,之前公司项目使用的ocelot做网关,ocelot是.net平台下的一个网关,也是很不错,但是 ...

  7. UIView Animation 动画学习总结

    目录 一.前言 二.UIView Animation 2.1 简单动画 2.2 关键帧动画 2.3 View 的转换 三.CALayer Animation 3.1 基本动画(CABasicAnima ...

  8. 大家都能看得懂的源码之ahooks useInfiniteScroll

    本文是深入浅出 ahooks 源码系列文章的第十七篇,该系列已整理成文档-地址.觉得还不错,给个 star 支持一下哈,Thanks. 简介 useInfiniteScroll 封装了常见的无限滚动逻 ...

  9. 踩坑之旅:配置 ROS 环境

    以下内容为本人的著作,如需要转载,请声明原文链接微信公众号「englyf」https://www.cnblogs.com/englyf/p/16660252.html 最近在学习机器人相关的导航算法, ...

  10. ASP.NET Core 6框架揭秘实例演示[35]:利用Session保留语境

    客户端和服务器基于HTTP的消息交换就好比两个完全没有记忆能力的人在交流,每次单一的HTTP事务体现为一次"一问一答"的对话.单一的对话毫无意义,在在同一语境下针对某个主题进行的多 ...