js

闭包和作用域

原型和原型链

所有原型链的终点都是 Object 函数的 prototype 属性
每一个构造函数都拥有一个 prototype 属性，此属性指向一个对象，也就是原型对象
原型对象默认拥有一个 constructor 属性，指向指向它的那个构造函数
每个对象都拥有一个隐藏的属性 __ proto __，指向它的原型对象

事件循环机制

js垃圾回收

不同垃圾是按存活时间分为新生代和老生代。不同的代回收机制也不同
新生代由from和to区域组成（默认64位 from和to各占16M），老生代则只有一块区域

image.png

新生代中的垃圾回收机制----引用计数
新生代的空间小，存活对象少
1、开始垃圾回收的时候，会检查FROM区域中的存活对象，如果还活着(引用计数)，拷贝到TO空间，完成后释
放空间
2、完成后FROM 和TO 互换

当一个对象经历过多次的垃圾回收依然存活的时候，生存周期比较长的对象会被移动到老生代，这个移动过程被成为晋升或者升级
1.经过5次以上的回收还存在
2.TO的空间使用占比超过25%，或者超大对象

新生代中的垃圾回收机制----标记清除、标记整理
老生代空间大，大部分都是活着的对象,GC耗时比较长

mark-sweep(标记清除) mark-compact(标记整理)

image.png

mark-sweep(标记清除)

标记活着的对象，随后清除在标记阶段没有标记的对象，只清理死亡对象
问题在于清除后会出现内存不连续的情况，这种内存碎片会对后续的内存分配产生影响
如果要分配一个大对象，碎片空间无法分配

mark-compact(标记整理)

标记死亡后会对对象进行整理，活着的对象向左移动，移动完成后直接清理掉边界外的内存

image.png

节流与防抖

async和defer

async : 加载脚本和渲染后续文档元素并行进行，脚本加载完成后，暂停html解析，立即解析js脚本
defer : 加载脚本和渲染后续文档元素并行进行，但脚本的执行会等到 html 解析完成后执行

image.png

如果你的脚本代码依赖于页面中的DOM元素（文档是否解析完毕），或者被其他脚本文件依赖。可以用defer。如果不依赖就可以用async

target和currentTarget的区别

target：指的是事件流的目标阶段，获取的是被点击的元素。
currentTarget：在事件流的捕获和冒泡阶段时，是指向当前事件活动对象，只有在目标阶段的时候，两者才会相等

getxxxByxxx 和 queryxxx区别

1、getxxxByxxx获取的是动态的元素，query获取的是静态的
2、get是dom规范，query是selector规范