js中特殊的宏任务
一.setImmediate
目前只有IE10+和NodeJS支持该API。
立即触发回调函数,使其进入宏任务队列(macro task queue)
语法:
// 只有一个参数
setImmediate(callback)
比setTimout(fn, 0)的执行顺序要快,性能也更高。
因为setTimeout(fn,0)实质上会有4ms的延迟。
二. MessageChannelAPI
1. 作用
MessageChannelAPI允许我们新建一个消息通道,并通过它的两个属性port1和port2进行通信。
实质是通过一个端口发送数据,另一个端口通过onmessage监听另一个端口发送的数据。
触发方式:
同步触发,即port发送数据时立即触发。所以会比setTimeout(fn,0)触发要早。
2. 使用
MessageChannel是个构造函数。使用前需要创建实例,生成一条消息通道。
const channel = new MessageChannel();
实例自带两个端口,即消息通道的两端
const port1 = channel.port1;
const port2 = channel.port2;
示例:(模拟setimmediate)
const channel = new MessageChannel();
const port1 = channel.port1;
const port2 = channel.port2;
port1.onmessage = function(e) {
console.log(e.data);
}
setTimeout(function() {
console.log('settimeout'); //4ms
})
port2.postMessage('hello world'); //立即
Promise.resolve().then(() => {
console.log('then'); // 微任务
})
// 运行结果
then
hello world
settimeout
js中特殊的宏任务的更多相关文章
- JS中EventLoop、宏任务与微任务的个人理解
为什么要EventLoop? JS 作为浏览器脚本语言,为了避免复杂的同步问题(例如用户操作事件以及操作DOM),这就决定了被设计成单线程语言,而且也将会一直保持是单线程的.而在单线程中若是遇到了耗时 ...
- Js中执行变量中的命令语句,也就是所谓的宏替换(很实用的例子)
Js中执行变量中的命令语句,也就是所谓的宏替换(很实用的例子) 由其做动态编程时非常有用,必须符合js中的语法,用eval能够执行. var aaa="alert('这是变量中的语句')&q ...
- js中的宏任务与微任务
如果你已经知道了js中存在宏任务和微任务,那么你一定已经了解过promise了.因为在js中promise是微任务的一个入口. 先来看一道题: setTimeout(function(){ conso ...
- JS中的执行机制(setTimeout、setInterval、promise、宏任务、微任务)
1.执行机制 JS 是单线程的,处理 JS 任务(程序)只能一个一个顺序执行,所以 JS 中就把任务分为了同步任务和异步任务.同步的进入主线程先执行,异步的进入Event Table并注册函数,当指定 ...
- 前端面试题:JS中的let和var的区别
最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部 ...
- 为什么JS是单线程?JS中的Event Loop(事件循环)?JS如何实现异步?setimeout?
https://segmentfault.com/a/1190000012806637 https://www.jianshu.com/p/93d756db8c81 首先,请牢记2点: (1) JS是 ...
- JS中的let和var的区别
最近很多前端的朋友去面试被问到let和var的区别,其实阮一峰老师的ES6中已经很详细介绍了let的用法和var的区别.我简单总结一下,以便各位以后面试中使用. ES6 新增了let命令,用来声明局部 ...
- JS中的同步异步编程
首先我们先看看同步与异步的定义,及浏览器的执行机制,方便我们更好地理解同步异步编程. 浏览器是多线程的,JS是单线程的(浏览器只分配一个线程来执行JS) 进程大线程小:一个进程中包含多个线程,例如 ...
- 5.0 JS中引用类型介绍
其实,在前面的"js的六大数据类型"文章中稍微说了一下引用类型.前面我们说到js中有六大数据类型(五种基本数据类型 + 一种引用类型).下面的章节中,我们将详细讲解引用类型. 1. ...
随机推荐
- Object 方法的 hashCode,equals方法源码
文章目录 hashCode方法注释 equals 方法注释 equals 方法 hashCode方法注释 Object 的 hashCode 方法,是本地方法: Returns a hash code ...
- 虚拟环境搭建Django项目
下载虚拟环境包 pip install virtualenv 创建虚拟环境 virtualenv env 进入env文件夹 cd env 进入Scripts文件夹 cd Scripts 启动虚拟环 ...
- Java8新特性 - Java内置的四大核心函数式接口
Java内置的四大核心函数式接口 Consumer:消费型接口 对类型为T的对象应用操作,包含方法:void accept(T t) public class TestLambda02 { publi ...
- Python基础数据类型(数字、字符串、布尔、列表、元组、字典、集合等)
数据类型 计算机顾名思义就是可以做数学计算的机器,因此,计算机程序理所当然地可以处理各种数值.但是,计算机能处理的远不止数值,还可以处理文本.图形.音频.视频.网页等各种各样的数据,不同的数据,需要定 ...
- 0.b概述
一.计算机与算法 计算 = 信息处理 计算模型 = 计算机 = 信息处理工具 算法:特定计算模型下,解决特定问题的指令序列 要素:输入 输出 正确性 确定性 可行性 有穷性 好算法:正确 健壮 可读 ...
- VBA子程序(十六)
子程序(Sub Procedures,也叫子过程)与函数类似,但有一些差异. 子过程不需要有返回一个值,而函数可能会或可能不会有返回一个值. 子程序可以不用call关键字来调用. 子程序总是包含在Su ...
- Node.js 实战(一)之—优化汇总
Express 页面缓存 app.set("cache view",true); --设置页面缓存 开发模式下博主建议不要这么做,因为开发中我们会频繁的对页面的样式.js等进行修改 ...
- 打印html页面
// 打印类属性.方法定义 const Print = function (dom, options) { if (!(this instanceof Print)) return new Print ...
- iOS-CGContextRef
图形上下文(Graphics Context)---绘制目标 需要在iOS应用程序的屏幕上进行绘制时,需要先定义一个UIView类,并实现它的drawRect:方法,当启动程序时,会先调用loadVi ...
- array_map 去除数组参数里面左右两端空格
<?php class Test{ public function trimArray($params){ if (!is_array($params)) return trim($params ...