前
前
前端内参
搜索文档…
前端内参
零.0.1 前言·写给有缘人
零、准备Hard模式下的面试
零.1.1 一线互联网公司有什么不同?
零.1.2 该公司是做什么的,实力怎么样,前景如何,口碑怎样?
零.1.3 该岗位负责做什么的,岗位所属部门在什么位置,上升空间多大?
零.1.4 准备一份好的简历
零.1.5 不卑不亢,不疾不徐地说话
零.1.6 “有什么问题要问我吗”,如何回答?
壹、前端之灵:JavaScript/ECMAScript
壹.1.1 新版 ECMAScript 特性分析
壹.1.2 JavaScript未来的方向
壹.2.1 函数
壹.2.2 作用域、执行上下文、作用域链
壹.2.3 彻底搞懂 this
壹.2.4 深入理解 call、apply、bind
壹.2.5 面试时高频问到的“闭包”
壹.2.6 原型和原型链
壹.2.7 同步和异步,阻塞和非阻塞
壹.2.8 Event Loop
壹.2.9 强大的数组
壹.2.10 正则表达式
壹.2.11 位操作符与进制转换
壹.2.12 spread和rest操作符
壹.2.13 实现异步非阻塞的任务
壹.2.14 模块化开发
壹.3.1 深拷贝与浅拷贝
壹.3.2 JavaScript函数柯里化
壹.3.3 JavaScript元编程:Proxy与Reflect
壹.3.4 JavaScript中的进程、线程、协程
壹.4.2 页面重排(Reflow)与重绘(Repaint)
壹.4.3 DOM、Shadow DOM、Virtual DOM
壹.5.2 了解TCP、UDP、TLS
壹.5.3 Http几个版本的区别
壹.5.4 Http和Https的区别在哪里
壹.5.5 XSS与CSRF攻击
贰、数据结构与算法
贰.0 本章导读
贰.1.1 十大排序算法
贰.1.2 链表
贰.1.3 单调栈
贰.1.4 二叉树的遍历
贰.1.5 实战:字节跳动前端面试2道算法题
贰.1.6 分治法、动态规划与贪心算法的区别
贰.1.7 实战:阿里巴巴前端面试题
叁、主流框架/库
叁.1.1 jQuery过时了吗?
叁.1.2 React、Vue和Angular对比
叁.2.1 React Hooks究竟是什么?
肆、必会的工具
肆.1.1 深入理解Webpack打包
肆.3.2 适用于前端开发者的20个VSCode插件
伍、编程范式
伍.1.1 面向对象与面向过程有什么区别?
伍.1.3 重新认识JavaScript面向对象: 继承
伍.1.4 彻底搞懂泛型
伍.1.5 用JavaScript实现抽象类
伍.1.6 用JavaScript实现接口
伍.2.1 什么是函数式编程?
伍.2.2 JavaScript的函数式编程探索
伍.2.3 Pointfree无参数风格编程
伍.3.1 什么是响应式编程?
伍.3.2 RxJS
陆、设计原则与编程范式
陆.1.0 导读:SOLID
陆.1.1 单一职责原则
陆.1.2 接口隔离原则
陆.1.3 开放封闭原则
陆.1.4 里氏替换原则
陆.1.5 依赖倒置原则
柒 、设计模式与软件工程
柒.1.5 发布-订阅模式
柒.1.14 适配器模式
柒.2.1 MVC的前世今生
玖、公众号&博客推荐
玖.1 一线互联网公司前端团队官方公众号
玖.2 知名前端人物
拾、后记
拾.1 成为一个好的程序员远比找份好工作重要
拾.2 2020年前端技术展望
由
GitBook
提供支持
壹.2.7 同步和异步,阻塞和非阻塞
本篇文章其实是讲编程全领域通行的概念,之所以单独拎出来写在本书,是因为笔者发现绝大多数前端工程师对这块儿的概念理解得不太严谨。
在实际的开发中,我们经常会听到同步、异步,阻塞、非阻塞这些编程概念,可能都会比较懵,然后就各种查网上似是而非的资料,结果越查越迷糊,大部分文章都千篇一律,没有说到本质上的区别。所以下次再碰到这些概念,印象还是比较模糊,尤其是在一些场景下同步与阻塞,异步与非阻塞感觉没什么区别,但其实这四个术语描述的事物还真不是一回事。
下面我们来慢慢探讨他们之间的区别与联系,在这之前,我们还会经常看到下面的组合术语:
同步+阻塞
同步+非阻塞
异步+阻塞
异步+非阻塞
在当什么是同步和异步,阻塞与非阻塞的概念还没弄清楚之前,更别提上面这些组合术语了,只会让你更加困惑。
壹.2.7.1 同步和异步
同步和异步其实指的是,请求发起方对消息结果的获取是主动发起的,还是等被动通知的。
如果是请求方主动发起的,一直在等待应答结果(同步阻塞),或者可以先去处理其他的事情,但要不断轮询查看发起的请求是否有应答结果(同步非阻塞 )因为不管如何都要发起方主动获取消息结果,所以形式上还是同步操作。
如果是由服务方通知的,也就是请求方发出请求后,要么在一直等待通知(异步阻塞),要么就先去干自己的事了(异步非阻塞),当事情处理完成之后,服务方会主动通知请求方,它的请求已经完成,这就是异步。异步通知的方式一般是通过状态改变,消息通知,或者回调函数来完成,大多数时候采用的都是回调函数。
壹.2.7.2 阻塞和非阻塞
阻塞和非阻塞在计算机的世界里面,通常指的是针对IO的操作,如网络IO和磁盘IO等。
那么什么是阻塞和非阻塞呢?简单的说就是我们调用了一个函数之后,在等待这个函数返回结果之前,当前的线程是处于挂起状态,还是运行状态,如果是挂起状态,就意味着当前线程什么都不能干,就等着获取结果,这就叫同步阻塞,如果仍然是运行状态,就意味当前线程是可以的继续处理其他任务,但要时不时的去看下是否有结果了,这就是同步非阻塞。
壹.2.7.3 场景举例
同步,异步,阻塞和非阻塞,会组合成上面提到过的四种结果:
举个例子,比如我们去照相馆拍照,拍完照片之后,商家说需要30分钟左右才能洗出来照片。
1. 同步+阻塞
这个时候如果我们一直在店里面啥都不干,一直等待商家面前等待它洗完照片,这个过程就叫同步阻塞。
2. 同步+非阻塞
当然大部分人很少这么干,更多的是大家拿起手机开始看电视,看一会就会问老板洗完没,老板说没洗完,然后我们接着看,再过一会接着问,直到照片洗完,这个过程就叫同步非阻塞。
3. 异步+阻塞
因为店里生意太好了,越来越多的人过来拍,店里面快没地方坐了,老板说你把你手机号留下,我一会洗好了就打电话告诉你过来取,然后你去外面找了一个长凳开始躺着睡觉等待老板打电话,啥不都干,这个过程就叫异步阻塞。
4.异步+非阻塞
当然实际情况是,大家可能会直接先去逛街或者吃饭做其他的活动,店老板来了电话就去取照片,这样一来两不耽误,这个过程就叫异步非阻塞。
壹.2.7.4 小结
只有严谨地理解了同步、异步,阻塞、非阻塞的概念,才能更好地理解JavaScript的事件处理机制以及Eventloop,我们下一篇见。
壹、前端之灵:JavaScript/ECMAScript - 以前
壹.2.6 原型和原型链
下一个 - 壹、前端之灵:JavaScript/ECMAScript
壹.2.8 Event Loop
最近更新
2yr ago
复制链接
大纲
壹.2.7.1 同步和异步
壹.2.7.2 阻塞和非阻塞
壹.2.7.3 场景举例
1. 同步+阻塞
2. 同步+非阻塞
3. 异步+阻塞
4.异步+非阻塞
壹.2.7.4 小结