前端面试题集锦三

1. 浏览器怎么匹配某个选择器？

   从后往前判断，浏览器先产生一个元素集合，这个集合往往由最后一个部分的索引产生，然后向上匹配，如果不符合上一部分，就把元素从集合中删除，直到整个选择器都匹配完。还在集合中的元素就匹配这个选择器了。类似于body.ready #wrappper > .lol233 先把所有class中有lol233的元素拿出来组成一个集合，然后上一层，对每一个集合中的元素，如果元素的parentid不为#wrapper则把元素从集合中删去，再向上，从这个元素的父元素开始向上找，没有找到一个 tagName 为 body 且 class 中有 ready 的元素，就把原来的元素从集合中删去。至此这个选择器匹配结束，所有还在集合中的元素满足。

2. https的原理，加密方式？

   由于HTTP是明文传送数据，不具备加密的功能。通信协议中通过SSL（安全套接层）或TSL的组合使用 来加密HTTP的通信内容。HTTP+加密+认证+完整性保护=HTTPS。
   加密方式：对称加密方式和非对称加密。
   对称加密即为加密和解密共用同一个方式。
   非对称加密使用一对非对称的加密，发送密文的一方使用对方的公开密钥进行加密处理，对方收到被加密的信息之后，再使用自己的私有密钥进行解密。
   HTTPS采用的是共享密钥加密和公开密钥加密共同作用的方式。在交换密钥环节使用公开密钥加密方式，之后的建立通信交换报文阶段则使用共享密钥加密方式。

3. CSS动画和JS动画的区别

   CSS动画：浏览器可以对动画进行优化，它必要时可以创建图层，然后在主线程之外运行。缺点是：缺乏强大的控制能力。而且很难以有意义的方式结合在一起，使得动画变得复杂且易于出问题。
   JS动画：与CSS预先设置好的动画不一样，可以在动画过程中进行控制.并且一些动画效果只有js能完成。缺点：js动画在浏览器的主线程运行，有可能会导致线程出现阻塞，从而造成丢帧的现象。

4. TCP/UDP的区别

   UDP是提供面向无连接通信服务的一种协议。即使是出现网络拥堵的情况下，UDP也无法进行流量控制等避免拥堵的行为。且传输途中出现丢包也不会负责重发。甚至当包的顺序乱掉时也没有纠正的功能。传输速度快，针对UDP的简单高效性，运用于以下几个方面：1.包总量较少的通信(DNS,SNMP);2.视频，音频等多媒体通信；3.广播通信。
   TCP作为一种面向有连接的协议，只有在确认通信对端存在时才会发送数据，从而控制通信流量的浪费。且充分实现了数据传输时各种控制功能，可以进行丢包时的重发控制，还可以对次序乱掉的分包进行顺序控制。可以实现高可信的通信。
   TCP支持的应用协议：Telnet,FTP,SMTP
   UDP支持的应用协议：NFS(网络文件系统)、SNMP、DNS（主域名称系统）、TFTP（通用文件传输协议）

5. DNS解析的方法

   DNS是一个有效管理主机名与IP地址之间对应关系的系统。
   缓存查找： 当输入网址后，首先会进行DNS解析过程，首先检测浏览器缓存终有没有这个域名解析的IP地址，如果有解析过程结束，若没有，则查看本机的Hosts文件中有没有网址映射关系，如果有这个映射关系，则返回IP映射地址。完成域名解析，若没有，则查找本地DNS解析服务器缓存，是否有这个映射关系。若没有，则需要进行查找。
   查找过程： 解析器为了查询IP地址，首先会向根服务器进行查询处理。接收到这个查询处理的域名服务器会在自己的数据库中进行查找，如果有该域名对应的IP地址就返回。如果没有，则向上一层根域名服务器进行查询处理。从根开始对这颗树按照顺序进行遍历，直到找到指定的域名服务器，并由这个域名服务器返回想要的数据。

6. 函数柯里化

   柯里化允许我们把函数与传递给它的参数相结合，产生一个新的函数。
   Function.method(‘curry’,function()){
   var slice = Array.prototype.slice,
   args = slice.apply(arguments),
   that = this;
   return function(){
   var newArgs = args.concat(slice.apply(arguments));
   return that.apply(null, newArgs);
   }
   }

7. 流式布局和响应式布局如何实现？

   流式布局主要是针对于类似设备不同分辨率之间的兼容问题。
   响应式布局主要是解决不同设备不同分辨率之间的兼容问题。
   流式布局主要是靠百分比进行排版，可以在不同分辨率下显示相同的版式。
   响应式布局的关键技术是CSS3中的媒体查询，可以在不同分辨率下对元素重新设置样式（不只是尺寸）， 在不同屏幕下可以显示不同版式
   一般来说响应式布局配合流式布局效果更好。例如Bootstrap。

8. 浏览器报告的错误类型

   RangeError (数值超过相应范围)
   ReferenceError (变量不存在会抛出范围)
   SyntaxError(解析js代码，发现不符合语法规范的token会抛出SyntaxError、TypeError(访问不存在的方法或变量中保存着意外的类型))
   URIError(URI格式不正确时会抛出任务)。

9. cookie和session的区别？

   cookie机制采用的是在客户端保持状态的方案，而session机制采用的是在服务器端保持状态的方案。
   cookie的机制是通过HTTP协议来传送的，cookie的主要内容包括名字，值，过期时间，路径和域。当设置了过期时间，浏览器会把cookie保存在硬盘里，且可以在不同的浏览器进程中共享，比如两个IE窗口。
   session实现原理：session机制是一种服务器端的机制，服务器使用一种类似散列表的结构来保存信息。当程序需要为某个客户端的请求创建一个session时，服务器会首先检查这个客户端请求是否已包含了一个session标识（sessionID）,若已包含，则把sessionID对应的session信息取出来使用，sessionID将被在本次响应返回客户端保存，保存这个sessionID的形式可以采用cookie,但是当cookie被禁用后必须采用其他机制来保存。经常被使用的一种技术叫做URL重写，就是把session id直接附加在URL路径的后面。还有一种技术叫做表单隐藏字段。
   区别： cookie安全性不高，可以分析保存在本地的cookie并进行cookie欺骗考虑到安全应使用session; session会在一定时间内保存在服务器上，当访问增多，会比较占用服务器的性能。但单个cookie保存的数据不能超过4k,一个浏览器都限制一个站点最多保存20个cookie.

10. HTTP请求中哪些是幂等性的？

    HTTP的幂等性是指一次或者多次请求某一个资源应该具有相同的副作用。
    首先针对于GET用于请求资源，没有副作用，所以是幂等性的；PUT主要用于传输文件，更新资源本身，会产生相同的副作用，而POST不具备幂等性，两次相同的请求，资源会被创建两次，所以不具备；HEAD与GET都用于请求资源，但是HEAD不返回报文主体，所以具备幂等性。OPATIONS也具备幂等性，主要是检测支持的方法。

11. 数据库为什么要进行读写分离？

    当用户到一定规模，数据库会因为负载压力过高而成为网站的瓶颈。
    目前大部分数据库都提供主从热备功能，通过配置两台数据库主从关系，可以将一台数据库服务器的数据更新到另一台服务器，实现数据库读写分析，改善数据库负载压力。应用服务器将数据写入主服务器，主服务器通过主从复制将数据更新同步到从服务器，即应用服务器可以从从服务器读取数据。

12. 正向代理和反向代理的区别？

    正向代理代理客户端来向客户端发送一个请求，主要是用于用户端部署使用，反向代理代理服务器，用于接收客户端的请求。接收到客户端请求后，将请求分配给真实的服务器。