JS知识点

1、Promise

1.1 Promise对象有以下两个特点。

（1）对象的状态不受外界影响。Promise对象代表一个异步操作，有三种状态：pending（进行中）、fulfilled（已成功）和rejected（已失败）。只有异步操作的结果，可以决定当前是哪一种状态，任何其他操作都无法改变这个状态。这也是Promise这个名字的由来，它的英语意思就是“承诺”，表示其他手段无法改变。

（2）一旦状态改变，就不会再变，任何时候都可以得到这个结果。Promise对象的状态改变，只有两种可能：从pending变为fulfilled和从pending变为rejected。只要这两种情况发生，状态就凝固了，不会再变了，会一直保持这个结果，这时就称为 resolved（已定型）。如果改变已经发生了，你再对Promise对象添加回调函数，也会立即得到这个结果。这与事件（Event）完全不同，事件的特点是，如果你错过了它，再去监听，是得不到结果的。

1.2 Pomise.all的使用

Promise.all可以将多个Promise实例包装成一个新的Promise实例。同时，成功和失败的返回值是不同的，成功的时候返回的是一个结果数组，而失败的时候则返回最先被reject失败状态的值。

1.3 Promise.race的使用

顾名思义，Promse.race就是赛跑的意思，意思就是说，Promise.race([p1, p2, p3])里面哪个结果获得的快，就返回那个结果，不管结果本身是成功状态还是失败状态。

2、JS节流 防抖

函数节流是：在固定的时间内触发事件，每隔n秒触发一次
函数防抖是：当你频繁触发后，n秒内只执行一次

1、防抖：

如果在200ms内没有再次触发滚动事件，那么就执行函数
如果在200ms内再次触发滚动事件，那么当前的计时取消，重新开始计时
效果：如果短时间内大量触发同一事件，只会执行一次函数。
实现：既然前面都提到了计时，那实现的关键就在于setTimeout这个函数，由于还需要一个变量来保存计时，考虑维护全局纯净，可以借助闭包来实现：
对于短时间内连续触发的事件（上面的滚动事件），防抖的含义就是让某个时间期限（如上面的1000毫秒）内，事件处理函数只执行一次

2、节流

如果短时间内大量触发同一事件，那么在函数执行一次之后，该函数在指定的时间期限内不再工作，直至过了这段时间才重新生效。

3、map和set 的概念及使用

3.1 Set简介

set中成员的值都是唯一的，没有重复的值
向set中添加成员时，不会发生类型转换
向set中添加的对象总是不想等

常用的属性和方法
属性：
    size：返回set实例的成员总数
方法：
    add()：添加某个值，返回set本身
    delete()：删除某个值，返回一个布尔值，判断删除是否成功
    has()：返回一个布尔值，表示该值是否为set成员
    clear()：清除所有成员，没有返回值
    keys()：返回键名的遍历器
    values()：返回键值的遍历器
    entries()：返回键值对的遍历器
    forEach()：使用回调函数遍历每个成员

3.2 Map简介

es6中的map很大程度上和set相似，但是map是以键值对的形式存储数据的
常用的属性和方法
属性：
    size：返回map结构的成员总数
方法：
    set(key,value)：设置键名key对应的键值value,然后返回整个map结构，如果key已经有值，则键值会被更新，否则就新生成该键
    get(key)：读取key对应的键值，如果找不到key,则返回undefined
    has(key)：返回一个布尔值，表示某个键是否在当前map对象中
    delete(key)：删除某个key,返回true,如果删除失败，返回false
    clear()：清除所有成员，没有返回值
    keys()：返回键名的遍历器
    values()：返回键值的遍历器
    entries()：返回键值对的遍历器
    forEach()：遍历map的所有成员

3.3 总结

Set 是无重复值的有序列表。根据 Object.is()方法来判断其中的值不相等，以保证无重复。 Set 会自动移除重复的值，因此你可以使用它来过滤数组中的重复值并返回结果。 Set并不是数组的子类型，所以你无法随机访问其中的值。但你可以使用has() 方法来判断某个值是否存在于 Set 中，或通过 size 属性来查看其中有多少个值。 Set 类型还拥有forEach()方法，用于处理每个值。

Weak Set 是只能包含对象的特殊 Set 。其中的对象使用弱引用来存储，意味着当 Weak Set中的项是某个对象的仅存引用时，它不会屏蔽垃圾回收。由于内存管理的复杂性， Weak Set的内容不能被检查，因此最好将 Weak Set 仅用于追踪需要被归组在一起的对象。

Map 是有序的键值对，其中的键允许是任何类型。与 Set 相似，通过调用 Object.is()方法来判断重复的键，这意味着能将数值 5 与字符串 “5” 作为两个相对独立的键。使用set() 方法能将任何类型的值关联到某个键上，并且该值此后能用 get() 方法提取出来。Map 也拥有一个 size 属性与一个 forEach() 方法，让项目访问更容易。

4、JS 支持哪些数据类型

●　Undefined

●　Null

●　Boolean

●　String

●　Symbol

●　Number

●　Object

5、什么是回调

回调函数是作为参数或选项传递给某个方法的普通JS函数。它是一个函数，在另一个函数完成执行后执行，因此称为回调。在JS中，函数是对象，因此，函数可以接受函数作为参数，并且可以由其他函数返回。

6、null 和 undefined 区别

undefined是基本数据类型 表示未定义 缺少的意思。

null是引用数据类型，是对象，表示空对象

undefined是从null派生出来的 所以undefined==null 为 true

7、window 与 document 的区别：

window:JS 的 window 是一个全局对象，它包含变量、函数、history、location。

document:document也位于window之下，可以视为window的属性。

8、JS中的事件冒泡是什么

事件冒泡是HTML DOM API中事件传播的一种方式，当一个事件发生在另一个元素中的一个元素中，并且两个元素都注册了该事件的句柄时。通过冒泡，事件首先由最内部的元素捕获和处理，然后传播到外部元素。执行从该事件开始，并转到其父元素。然后执行传递给父元素，以此类推，直到body元素。

9、JS中的“严格”模式是什么以及如何启用？

严格模式是在代码中引入更好的错误检查的一种方法。

●　当使用严格模式时，不能使用隐式声明的变量，或为只读属性赋值，或向不可扩展的对象添加属性。

●　可以通过在文件，程序或函数的开头添加“use strict”来启用严格模式

10、 事件委托理解

通俗的讲，事件就是onclick，onmouseover，onmouseout，等就是事件，委托呢，就是让别人来做，这个事件本来是加在某些元素上的，然而你却加到别人身上来做，完成这个事件.
原理: 利用冒泡的原理，把事件加到父级上，触发执行效果。
target 事件属性可返回事件的目标节点（触发 该事件的节点）

11、 js单线程怎么执行异步操作

浏览器只分配给js一个主线程，用来执行任务（函数），但一次只能执行一个任务，这些任务形成一个任务队列排队等候执行，但前端的某些任务是非常耗时的，比如网络请求，定时器和事件监听，如果让他们和别的任务一样，执行效率会非常的低，甚至导致页面的假死。

所以，浏览器为这些耗时任务开辟了另外的线程，主要包括http请求线程，浏览器定时触发器，浏览器事件触发线程，这些任务是异步的。这些异步任务完成后通过回调函数让主线程知道。

12、jQuery 选择器

id选择器：　$( “#id” )

类名选择器： $( “.class” )

标签选择器： $( “div” )

13、JS原型链

当查找一个对象的某个属性时，会先从它自身的属性上查找，

如果找不到的话会从它的_proto_属性上查找，就是这个构造函数的prototype属性，

如果还没找到就会继续在_proto_上查找，直到最顶层，找不到则为undefined，

像这样一层一层去查找形成一个链式的称为原型链

14、 深拷贝的实现

转JSON再解析回来
原理： 用JSON.stringify将对象转成JSON字符串，再用JSON.parse()把字符串解析成对象，一来一回之间，新的对象产生了，而且对象会开辟新的栈，实现深拷贝

15、JS中的深拷贝与浅拷贝的区别？

深拷贝递归地复制新对象中的所有值或属性，而拷贝只复制引用。

在深拷贝中，新对象中的更改不会影响原始对象，而在浅拷贝中，新对象中的更改，原始对象中也会跟着改。

在深拷贝中，原始对象不与新对象共享相同的属性，而在浅拷贝中，它们具有相同的属性。

16、闭包是什么，有什么特性，对页面有什么影响

闭包就是能够读取其他函数内部变量的函数,使得函数不被GC回收，如果过多使用闭包，容易导致内存泄露
使用场景：
（1）变量私有化
（2）onclick（操作DOM元素是需要相应的索引值）

17、JS垃圾回收？

垃圾回收机制，简称GC（garbage collection），会定期（周期性）地回收那些不再使用的变量，然后释放其内存。

通常的解决方法：标记清除；引用计数。

1.标记清除：盒子原理，当变量要进入执行环境，则将该变量标记为“进入环境”，该标记表示不能清除回收该变量，当变量离开执行环境之后，则标记为“离开环境”，进行回收，释放内存。

2.引用计数：值占用数，当该变量作为值被赋其他变量之后，则引用计数+1，当其他变量改变被其他赋值之后，则该变量引用计数-1，当引用计数为0的时候，进行回收清除。（不常用）

18、说说前端中的事件流？

什么是事件流：事件流描述的是从页面中接收事件的顺序,DOM2级事件流包括下面几个阶段。事件捕获阶段–>处于目标阶段–>事件冒泡阶段

19、JS原型是什么？

在ES6之前，JS没有类和继承的概念，JS是通过原型来实现继承的，在JS中一个构造函数默认带有一个prototype属性，这个的属性值是一个对象，同时这个prototype对象自带有一个constructor属性，这个属性指向这个构造函数，同时每一个实例都会有一个_proto_属性指向这个prototype对象，我们可以把这个叫做隐式原型，我们在使用一个实例的方法的时候，会先检查这个实例中是否有这个方法，没有的话就会检查这个prototype对象是否有这个方法

20、介绍虚拟DOM

（1）让我们不用直接操作DOM元素，只操作数据便可以重新渲染页面
（2）虚拟dom
虚拟dom是为了解决浏览器性能问题而被设计出来的
当操作数据时，将改变的dom元素缓存起来，都计算完后再通过比较映射到真实的dom树上
（3）diff算法比较新旧虚拟dom
如果节点类型相同，则比较数据，修改数据
如果节点不同，直接干掉节点及所有子节点，插入新的节点
如果给每个节点都设置了唯一的key，就可以准确的找到需要改变的内容，否则就会出现修改一个地方导致其他地方都改变的情况。比如A-B-C-D, 我要插入新节点A-B-M-C-D,实际上改变的了C和D。但是设置了key，就可以准确的找到B C并插入