Description
Debounce 和 Throttle 防抖 节流
HTML5、CSS3、ES6(es2015)新特性总结
https://zhuanlan.zhihu.com/p/78661051
es2020(ES11)新特性
- String.prototype.matchAll
- 提出import()
- BigInt 任意精度整数
- Promise.allSettled
- globalThis
- for-in 机制
- 可选链
- 空值合并运算符
- export * as ns from “mod”
小知识点
- 营销页面上加上圣诞雪花效果
pointer-events: none - css动画如何GPU加速，优化性能
transform：translateZ(0) - 精确获取元素相对页面位置的方式
getBoundingClientRect
那就是使用getBoundingClientRect()方法。它返回一个对象，其中包含了left、right、top、bottom四个属性，分别对应了该元素的左上角和右下角相对于浏览器窗口（viewport）左上角的距离。
var X= this.getBoundingClientRect().left;
var Y =this.getBoundingClientRect().top;
//再加上滚动距离，就可以得到绝对位置
var X= this.getBoundingClientRect().left+document.documentElement.scrollLeft;
var Y =this.getBoundingClientRect().top+document.documentElement.scrollTop;
react fiber react hook
JS 异步解决方案的发展历程以及优缺点
Advanced-Frontend/Daily-Interview-Question#11
-
回调函数（callback）
-
Promise
-
Generator
4 Async/await
浏览器 多进程 多线程 js单线程
JavaScript是单线程的，但是JavaScript的执行环境不是单线程的，如浏览器、nodejs
event loop至少包含两个队列，macrotask队列和microtask队列
Macrotask
-
Macrotasks 包含了解析 HTML、生成 DOM、执行主线程 JS 代码和其他事件如 页面加载、输入、网络事件、定时器事件等。从浏览器的角度，Macrotask 代表的是一些离散的独立的工作。
-
常见应用
setTimeout, setInterval, setImmediate, requestAnimationFrame, I/O, UI rendering
Microtasks
-
Microtasks 则是为了完成一些更新应用程序状态的较小的任务，如处理 Promise 的回调和 DOM 的修改，以便让这些任务在浏览器重新渲染之前执行。Microtask 应该以异步的方式尽快执行，所以它们的开销比 Macrotask 要小，并且可以使我们在 UI 重新渲染之前执行，避免了不必要的 UI 渲染。
-
常见应用
process.nextTick, Promises, Object.observe, MutationObserver
Ajax请求 和 web worker 同样是开了额外线程 ，区别呢
-
Ajax也是系统单独开了一个线程去执行的网络请求
浏览器虽然会在一个单独的线程去进行网络请求，但是我们是通过传递一个回调的方式去处理数据，浏览器在网络请求成功后，然后会切换回js线程来执行我们的回调，也就是说我们所有的js代码都是在js线程中运行的。所以javascript确实是在一个单线程中 -
而web worker不同，我们的js代码可以运行在js主线程之外，这也是为什么不能在web worker里面直接共享js主线程中定义的变量，不能操作ui (dom树)的原因，因为根本不在一个线程
总体的执行顺序为：常规代码 -> promises -> events 和 setTimeout 等