链接：https://pan.baidu.com/s/1kWV8-YZGGf7sb7DxjSJy-w 

提取码：k9k7 

 

前端面试题（JavaScript）

1、get 请求传参长度的误区

误区：我们经常说get 请求参数的大小存在限制，而post 请求的参数大小是无限制的。

实际上HTTP 协议从未规定GET/POST 的请求长度限制是多少。对get 请求参数的限制

是来源与浏览器或web 服务器，浏览器或web 服务器限制了url 的长度。为了明确这个

概念，我们必须再次强调下面几点:

HTTP 协议未规定GET 和POST 的长度限制

GET 的最大长度显示是因为浏览器和web 服务器限制了URI 的长度

不同的浏览器和WEB 服务器，限制的最大长度不一样

要支持IE，则最大长度为2083byte，若只支持Chrome，则最大长度8182byte

 

2、补充get 和post 请求在缓存方面的区别

post/get 的请求区别，具体不再赘述。

补充补充一个get 和post 在缓存方面的区别：

get 请求类似于查找的过程，用户获取数据，可以不用每次都与数据库连接，所以可以使用缓存。

post 不同，post 做的一般是修改和删除的工作，所以必须与数据库交互，所以不能使用缓存。因此get 请求适合于请求缓存。

 

3、说一下闭包

一句话可以概括：闭包就是能够读取其他函数内部变量的函数，或者子函数在外调用，子函数所在的父函数的作用域不会被释放

 

4、如何解决异步回调

promise、generator、async/await

 

5、说说前端中的事件流

HTML 中与javascript 交互是通过事件驱动来实现的，例如鼠标点击事件onclick、页面

的滚动事件onscroll 等等，可以向文档或者文档中的元素添加事件侦听器来预订事件。

想要知道这些事件是在什么时候进行调用的，就需要了解一下“事件流”的概念。

什么是事件流：事件流描述的是从页面中接收事件的顺序,DOM2 级事件流包括下面几个阶段。

事件捕获阶段

处于目标阶段

事件冒泡阶段

addEventListener：addEventListener 是DOM2 级事件新增的指定事件处理程序的操作，这个方法接收3 个参数：要处理的事件名、作为事件处理程序的函数和一个布尔值。最后这个布尔值参数如果是true，表示在捕获阶段调用事件处理程序；如果是false，表示在冒泡阶段调用事件处理程序。

IE 只支持事件冒泡。

 

6、说一下图片的懒加载和预加载

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

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

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

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

 

7、mouseover 和mouseenter 的区别

mouseover：当鼠标移入元素或其子元素都会触发事件，所以有一个重复触发，冒泡的过程。对应的移除事件是mouseout

mouseenter：当鼠标移除元素本身（不包含元素的子元素）会触发事件，也就是不会冒泡，对应的移除事件是mouseleave

 

8、JS 的new 操作符做了哪些事情

new 操作符新建了一个空对象，这个对象原型指向构造函数的prototype，执行构造函数后返回这个对象。

 

9、改变函数内部this 指针的指向函数（bind，apply，call 的区别）

通过apply 和call 改变函数的this 指向，他们两个函数的第一个参数都是一样的表示要

改变指向的那个对象，第二个参数，apply 是数组，而call 则是arg1,arg2...这种形式。通过bind 改变this 作用域会返回一个新的函数，这个函数不会马上执行。

 

10、JS 的各种位置，比如clientHeight,scrollHeight,offsetHeight ,以及scrollTop,

offsetTop,clientTop 的区别？

clientHeight：表示的是可视区域的高度，不包含border 和滚动条

offsetHeight：表示可视区域的高度，包含了border 和滚动条

scrollHeight：表示了所有区域的高度，包含了因为滚动被隐藏的部分。

clientTop：表示边框border 的厚度，在未指定的情况下一般为0

scrollTop：滚动后被隐藏的高度，获取对象相对于由offsetParent 属性指定的父坐标(css定位的元素或body 元素)距离顶端的高度。

 

11、Ajax 解决浏览器缓存问题

在ajax 发送请求前加上anyAjaxObj.setRequestHeader("If-Modified-Since","0")。

在ajax 发送请求前加上anyAjaxObj.setRequestHeader("Cache-Control","no-cache")。

在URL 后面加上一个随机数： "fresh=" + Math.random()。

在URL 后面加上时间搓："nowtime=" + new Date().getTime()。

如果是使用jQuery，直接这样就可以了$.ajaxSetup({cache:false})。这样页面的所有ajax

都会执行这条语句就是不需要保存缓存记录。