闭包就是函数中的函数，里面的函数可以访问外面函数的变量，外面的变量是内部函数的一部分。

闭包的作用：使用闭包可以访问函数中的变量。

可以使变量长期保存在内存中，生命周期比较长。

缺点：闭包不能滥用，否则会导致内存泄漏，影响网页的性能。闭包使用完了，要立即释放资源，将引用变量指向      //只允许所有域名访问

28、防抖动与节流的区别：

1）防抖动是将多次执行变为最后一次执行。

应用场景：使用在用户输入停止一段时间过去后再去获取数据，而不是每次输入都去获取。

// 实现一个防抖函数，在规定时间内未触发第二次则执行

2）节流是将多次执行变成每隔一段时间执行。

应用场景：懒加载时要监听计算滚动条的位置，但不必每次滑动都触发，可以降低计算的频率，而不必去浪费资源；

另外还有做商品预览图的放大镜效果时，不必每次鼠标移动都计算位置。

// 实现一个节流函数，在规定时间内只触发一次

29、浏览器渲染过程：

1）浏览器将获取的HTML文档并解析成DOM树

3）将DOM和CSSDOM合并为渲染树（rending tree）将会被创建，代表一系列将被渲染的对象

4）渲染树的每个元素包含的内容都是计算过的，它被称为布局layout。浏览器使用一种流式处理的方法，只需要一次pass绘制操作就可以布局所有的元素

5）将渲染树的各个节点绘制到屏幕上，这一步被称为绘制painting

30、计算机网络TCP和UDP的区别：

1）TCP面向连接（如打电话要先拨号建立连接）；UDP是无连接的，即发送数据之前不需要建立连接

2）TCP提供可靠的服务。即，通过TCP连接传送的数据，无差错，不丢失，不重复，且按序到达；UDP尽最大努力交付，即不保证可靠交付。TCP通过校验，重传控制，序号标识，滑动窗口，确认应答实现可靠传输。如，丢包时的重发控制，还可以对次序乱掉的分包进行顺序控制。

3）UDP具有较好的实时性，工作效率比TCP高，适用于对高速传输和实时性有较高的通信或广播通信。

4）每一条TCP连接只能是点到点的；UDP支持一对一，一对多，多对一和多对多的交互通信

5）TCP系统资源要求较多，UDP对系统资源要求较少

31、进程和线程的区别:

1）一个程序至少有一个进程，一个进程至少有一个线程

2）线程的划分尺度小于进程，使得多线程程序的并发性高

3）进程在执行过程中拥有独立的内存单元，而多个线程共享内存，从而极大的提高了程序的运行效率。

4）线程在执行过程中与进程还是有区别的。每个独立的线程有一个程序运行的入口，顺序执行序列和程序的出口。但是线程不能独立执行，必须依存在应用程序中，由应用程序提供多个线程执行控制。

5）从逻辑角度来看，多线程的意义在于一个应用程序中，有多个执行部分可以同时执行。但操作系统并没有将多个线程看做多个独立的应用，来实现进程调度和管理以及资源分配。

32、如何让事件先冒泡后捕获:

在Dom标准事件模型中，是先捕获后冒泡。但是如果要实现先冒泡后捕获的效果，对于同一个事件，监听捕获和冒泡，分别对应相应的处理函数，监听到捕获事件，先暂缓执行，直到冒泡事件被捕获后再执行捕获之间。

简介：事件委托指的是，不在事件的发生地(直接dom)上设置监听函数，而是在其父元素上设置监听函数，通过事件冒泡，父元素可以监听到子元素上事件的触发，通过判断事件发生元素Dom的类型，来做出不同的响应。

举例：最经典的就是ul和li标签的事件监听，比如我们在添加事件时候，采用事件委托机制，不会再li标签上直接添加，而是再ul父元素上添加。

好处：比较合适动态元素的绑定，新添加的子元素也会有监听函数，也可以有事件触发机制。

34、图片的懒加载和预加载

预加载：提前加载图片，当用户需要查看时可直接从本地缓存中渲染‘

懒加载：懒加载的主要目的时作为服务器前端的优化，减少请求数或延迟请求数

两种技术的本质：两者的行为时相反的，一个时提前加载，一个是迟缓甚至不加载

懒加载对服务器前端有一定的缓解压力作用，预加载则会增加服务器前端压力

属于高阶函数应用，传递给函数部分参数来调用柯里化函数，让它返回一个函数去处理剩下的参数。

把接收多个参数的函数转换成接收一个单一参数的函数。

requestAnimationFrame( )方法告诉浏览器，希望执行动画并请求浏览器在下一次重绘之前调用指定的函数来更新动画。该方法使用一个回调函数作为参数，这个回调函数会在浏览器重绘之前调用

38、数据属性与访问器属性的区别：

在JS中对象的属性分为两种类型：数据属性和访问器属性。

1）数据属性：它包含的是一个数据值的位置，在这可以对数据值进行读写。

configurable：表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或能否把属性修改为访问器属性，默认为true

writable：表示能否修改属性的值

修改数据属性的默认特性： 使用Object.defineProperty( )方法，这个方法有三个参数：属性所在的对象，属性名，一个描述符对象。

2）访问器属性：这个属性不包含数据值，包含的是一对get和set方法，在读写访问器属性时，就是通过这两个方法来进行操作处理的。

configurable：表示能否通过delete删除属性从而重新定义属性，能否修改属性的特性，或能否把属性修改为访问器属性，默认为false

Get：在读取属性时调用的函数，默认值为undefined

Set：在写入属性时调用的函数，默认值为undefined

注意：访问器属性不能直接定义，要通过Object.defineProperty( )这个方法来定义。

39、Proxy 对象用于定义基本操作的自定义行为（如，属性查找、赋值、枚举、函数调用等）。

target，要使用Proxy包装的目标对象（可以时任何类型的对象，包括原生数组，函数，甚至另一个代理）。

handle，一个通常以函数作为属性的对象，各属性中的函数分别定义了在执行各种操作时代理的行为。

toolBox:{...}-----工具栏组件，内置有导出图片，数据视图，动态类型切换，数据区域缩放，重置5个工具

series:[...]-----系列，它是一个数组，里面的元素是一个对象，每个对象就是一组数据的所有信息

action:{...}-----主要是包含一些event事件和一些数据可视化的行为设置例如高亮，tooltip位置设置等

a、当X轴上面要渲染的数据太多的时候就会出现只渲染出来一部分，但是图标中的数据显示（比如说柱状图中的每个柱子）又会自动的进行宽度的缩放，所以会导致X轴与图中的信息不相匹配的问题，解决的方法是在X轴设置axisLable:{interval:0}这个属性问题就可以解决了，Y轴的使用相同的方法。

Echarts：1）封装好的方法直接调用

2）兼容到IE6以及以上的所有主流浏览器

4）封装好的，直接用，不能修改

D3：1）太底层，学习成本大

2）兼容到IE9以上以及所有的主浏览器

3）D3通过svg来绘制图形

Svg：1）不依赖分辨率

2）基于xml绘制图形，可以操作dom

4）复杂度高，会减慢页面的渲染速度

4）能以png/jpg的格式保存图片

2）IP协议之上，使用Tcp来确保数据的完整有序

三次握手，滑动窗口，慢启动，挥手，分包，重发

3）Tcp协议之上，使用http协议来作为网页传输的协议（应用层）

44、XSS防御总结：

原理：XSS攻击涉及到三方，攻击者、用户、web serve。用户是通过浏览器来访问web server上的网页，XSS攻击就是攻击者通过各种办法，在用户访问的网页中插入自己的脚本，让其在用户访问网页时在其浏览器中进行执行。攻击者通过插入的脚本的执行，来获取用户的信息，如cookie，发送到攻击者自己的网站（跨站了）。所以称为跨站脚本攻击。

（XSS，就是在用户的浏览器中执行攻击者自己定制的脚本。）

1）反射型XSS，也就是非持久性XSS。用户点击攻击连接，服务器解析后响应，在返回的响应内容中出现攻击者的XSS代码，被浏览器执行。一来一去，XSS攻击脚本被web server反射回来给浏览器，所以称为反射型XSS。

特点：XSS攻击代码非持久性，也就是没有保存在web server中，而是出现在URL地址中；一般时攻击者通过邮件，聊天软件等等方式发送攻击URL，然后用户点击来达到攻击目的。

XSS 攻击的防御：对输入（和URL参数）进行过滤，对输出进行编码。

http协议有一个缺陷，通信只能由客户端发起。做不到服务器主动向客户端推送信息。这种单向请求，注定了如果服务器有连续的状态变化，客户端要获知，只能使用“轮询”，每隔一段时间，就发出一个询问，了解服务器有没有新的信息。最典型的场景就是聊天室。轮询的效率低，非常浪费资源。

webSocket是HTML5开始提供的一种在单个TCP连接上进行全双工通讯的协议。webSocket使得客户端和服务器之间的数据交换变得更加简单，允许服务端主动向客户端推送数据。在webSocket API中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。它最大的特点就是，服务器可以主动向客户端推送信息，客户端也可以主动向服务器发送信息，是真正的双向平等对话，属于服务器推送技术的一种。

1）建立在TCP协议之上，服务器端的实现比较容易

2）与http有良好的兼容性，默认端口也是80与443，并且握手阶段采用http协议，因此握手时不容易屏蔽，能通过各种http代理服务器

3）数据格式比较轻量，性能开销小，通信高效

4）可以发送文本，也可以发送二进制数据

5）没有同源限制，客户端可以与任意服务器通信

6）协议标识符是WS（如果加密，则为wss），服务器网站就是URL

// webSocket对象作为一个构造函数，用于新建webSocket实例，实行下面语句后，客户端就会与服务器进行连接。

// 用于指定收到服务器数据后的回调函数，除了动态判断收到的数据类型，也可以用binaryType属性，显示指定收到的二进制数据类型

46、web前端性能优化常见方法：

      1）减少HTTP请求数，因为一个完整的请求要经过DNS寻址，与服务器建立连接，发送数据，等待服务器响应，接收数据这样一个消耗时间成本和资源成本的复杂的过程。  常见方法：合并多个CSS文件和JS文件，利用雪碧图整合图像，Inline Image(使用data:URL scheme在实际的页面嵌入图像数据)，合理设置HTTP缓存等。

      7）最小化iframe的数量：iframes提供了一个简单的方式把一个网站的内容嵌入到另一个网站中。但其创建速度比其他包括JavaScript和CSS的DOM元素的创建慢了1-2个数量级。

      8）避免404：HTTP请求时间消耗是很大的，因此使用HTTP请求来获得一个没有用处的响应(例如404没有找到页面)是完全没有必要的，它只会降低用户体验而不会有一点好处。

      1）使用内容分发网络（CDN）：把网站内容分散到多个，处于不同地域位置的服务器上可以加快下载速度。

      2）将JavaScript和CSS作为外部文件来引用，在实际应用中使用外部文件可以提高页面速度，因为JavaScript和CSS文件都能在浏览器中产生缓存

　  6）JavaScript代码注意：谨慎使用ｗith，避免使用eval Function函数，减少作用域链查找（eval将对应的字符串解析成js并执行，应该避免使用js，因为非常耗性能（2次，一次解析成js，一次执行））

47、JS里的垃圾回收机制是什么，常用的是哪种，怎么处理的？

JS的垃圾回收机制是为了以防内存泄漏。内存泄漏的含义就是当已经不需要某块内存时这块内存还存在着，垃圾回收机制就是间歇的不定期的寻找到不再使用的变量，并释放掉它们所指向的内存。

JS中最常见的垃圾回收方式是标记清除。

工作原理：是当变量进入环境时，将这个变量标记为“进入环境”。当变量离开环境时，则将其标记为“离开环境”。标记“离开环境”的就回收内存。

1）垃圾回收器，在运行的时候会给存储在内存中的所有变量都加上标记。

2）去掉环境中的变量以及被环境中的变量引用的变量的标记。

3）再被加上标记的会被视为准备删除的变量。

4）垃圾回收器完成内存清除工作，销毁那些带标记的值并回收他们所占用的内存空间。

程序不需要的内存，由于某些原因其不会返回到操作系统或者可用内存中。内存泄漏会导致（运行缓慢，高延迟，崩溃）的问题。

常见的导致内存泄漏的原因有：

2）被遗忘的计时器或回调函数

3）脱离文档的DOM的引用

1）循环对象属性的时候，使用for...in，遍历数组的时候使用for...of

Math.min( )如果没有参数，则返回Infinity。Infinity是JavaScript中全局对象的一个属性，在浏览器环境中就是window对象的一个属性，表示无穷大。

50、前端JS加密方法：