前端知识点汇总
前端框架面试题：
项目
1 说一下做过哪些项目？
2 项目难点
1 vue
1 说一下Vue的生命周期？
2 滚动效果的实现？
3 如何使用JS实现滚动效果?
4 说说你对vuex的理解？
5 前端路由的实现说说？
2 HTML
1 H5中的webstorage和cookie的区别是什么？
（1）存储大小：webstorage提供5G或更多的存储空间，webstorage每个域（包括子域）都有独立的存储空间，各个存储空间是完全独立的，因此不会造成数据混淆。cookie只提供4KB的存储空间，每个域名的cookie总数是有限的，各个浏览器之间各有不同。
（2）接口：webstorage提供了许多丰富易用的接口，拥有setItem，removeItemgetItem，clear，key等方法，操作数据更简单；cookie需要自己封装setCookie，getCookie等。
（3）是否与服务器交互：webstorage是为本地数据存储而生，内部数据不会和服务器发生任何交互；cookie作为HTTP规范的一部分而存在，cookie的内容会随着请求一并发送到服务器（每请求一个新的页面时，cookie都会被发送过去，无形中造成带宽浪费）。
2 H5中的语义化标签用过哪些？
突出文本
...
3 CSS
1 css动画了解吗？
2 怎么实现一个阴影？
3 CSS行内和块状元素的区别？
4 行内元素可以设置margin和padding吗？是四个方向都能设置吗？
5 什么是标准盒模型和IE盒模型？怎么切换？
6 position的取值，绝对定位的用法
7 用浮动时遇到过的问题
8 清除浮动的方法
9 动态页面的交互
10 实现一个元素水平垂直居中都有哪些方法？
4 JavaScript
1 js的原型链和原型了解吗？
2 JS基本类型有哪些?
String，Number，Null，Undefined，Boolean
（补充：引用类型有Object）
3 this的指向问题？
4 会不会正则表达式？ 正则对象的创建方式是？
（1）正则表达式(regular expression)描述了一种字符串匹配的模式，可以用来检查一个串是否含有某种子串、将匹配的子串替换或者从某个串中取出符合某个条件的子串等。正则表达式通常缩写成“regex”。
下面先给出两个简单的示例：
-
^ 为匹配输入字符串的开始位置。
-
[0-9]+匹配多个数字， [0-9] 匹配单个数字，+ 匹配一个或者多个。
-
abc$匹配字母 abc 并以 abc 结尾，$ 为匹配输入字符串的结束位置。
又比如：
-
runoo+b，可以匹配 runoob、runooob、runoooooob 等，+ 号代表前面的字符必须至少出现一次（1次或多次）。
-
runoo*b，可以匹配 runob、runoob、runoooooob 等，* 号代表字符可以不出现，也可以出现一次或者多次（0次、或1次、或多次）。
-
colou?r 可以匹配 color 或者 colour，? 号代表前面的字符最多只可以出现一次（0次、或1次）。
（2）正则对象的创建方式
a.隐式创建（即字面量方式）
var 正则对象 = /正则表达式/匹配模式;
b.直接实例化（构造函数方法）
var 正则对象 = new RegExp(‘正则表达式’,’匹配模式’);
（补充：在Javascript中的正则表达式中，匹配模式只有两个。小写字母g：global的缩写，全局匹配；小写字母i：ignore的缩写，忽略大小写）
5 如何全局匹配和多行匹配？
6 数组创建的方式有哪些？
7 删除数组元素的方法?
js中一共有七种方法可删除数组元素。
（1）length属性
JavaScript中Array的length属性非常有特点一一它不是只读的。因此，通过设置这个属性可以从数组的末尾移除项或添加新项，请看下面例子：
1 var colors = ["red", "blue", "grey"]; //创建一个包含3个字符串的数组
2 colors.length = 2;
3 console.log(colors[2]); //undefined（2）delete关键字
要注意的是，使用delete删除元素之后数组长度不变，只是被删除元素被置为undefined了。
1 var arr = [1, 2, 3, 4];
2 delete arr[0];
3 console.log(arr); //[undefined, 2, 3, 4]（3）pop()栈方法
JavaScript中的Array对象提供了一个pop()栈方法用于弹出并返回数组中的最后一项，某种程度上可以当做删除用。
1 var colors = ["red", "blue", "grey"];
2 var item = colors.pop();
3 console.log(item); //"grey"
4 console.log(colors.length); //2（4）shift()队列方法
JavaScript中的Array对象提供了一个shift()队列方法用于弹出并返回数组中的第一项，某种程度上也可以当做删除用。
1 var colors = ["red", "blue", "grey"];
2 var color = colors.shift();
3 console.log(color); // "red"
4 console.log(colors.length); // 2（5）splice()操作方法
在JavaScript的Array对象中提供了一个splice()方法用于对数组进行特定的操作。在删除数组元素的时候，它可以删除任意数量的项，只需要指定2个参数：要删除的第一项的位置和要删除的项数。
1 var colors = ["red", "blue", "grey"];
2 var color = colors.splice(0, 1);
3 console.log(color); // "red"
4 console.log(colors); // ["blue", "grey"]可以看出，在调用了splice(0, 1)方法时，数组从第一项开始，删除了一项。
（6）迭代方法
所谓的迭代方法就是用循环迭代数组元素，发现符合要删除的项则删除。用的最多的地方，可能是当数组中的元素为对象的时候，可以根据对象的某个属性（例如ID）来删除数组元素。
a.第一种用最常见的ForEach循环来对比元素找到之后将其删除。
var colors = ["red", "blue", "grey"];
colors.forEach(function(item, index, arr) {
if(item === "red") {
arr.splice(index, 1);
}
});可以看到这里还要配合splice()方法去实现删除，循环只是为了找到特定的元素。另外一种思路是循环将不需要删除的元素推入到新的数组中，也能达到假性删除特定元素的目的。
b.第二种用循环中的filter方法
var colors = ["red", "blue", "grey"];
colors = colors.filter(function(item) {
return item != "red"
});
console.log(colors); // ["blue", "grey"]找出元素不是red的项数返回给colors（其实是得到了一个新的数组，并不是在原数组上进行删除操作），一定程度上也算是达到了删除特定元素的目的。
（7）prototype原型方法
Array.prototype.remove = function(dx) {
if(isNaN(dx) || dx > this.length){
return false;
}
for(var i = 0, n = 0; i < this.length; i++) {
if(this[i] != this[dx]) {
this[n++] = this[i];
}
}
this.length -= 1;
};
var colors = ["red", "blue", "grey"];
colors.remove(1);
console.log(colors); // ["red", "grey"]这种方法其实就是自己实现一个删除的逻辑，然后把删除方法添加给了Array的原型对象，则在此环境中的所有Array对象都可以使用该方法。尽管可以这么做，但是不推荐在产品化的程序中修改原生对象的原型。道理很简单，如果只是某个实现中缺少某个方法，就在原生对象的原型中添加这个方法，那么当在另一个支持该方法的实现中运行代码时，就可能导致命名冲突。而且这样做可能会意外地导致原生方法被重写。
8 js中长度为10的数组，在其索引为15的位置上添加元素会报错吗？ 为什么？
会报undefined错误，因为数组越界，超出范围了。
9 DOM的增删查有哪些方法？
10 JS的事件绑定和事件委托
11 动态页面中一个后添加的按钮怎么绑定事件？
12 json格式的数据传到前端是怎么解析的？
13 js的类型判断有几种，区别、原理、使用场景都说一下？
14 JS事件模型
15 怎么在事件捕获阶段触发事件
16 JS的函数防抖和函数节流的区别？。
5 JQuery
6 Servlet
jsp是在浏览器端还是服务器端执行?
2 http状态码说一下
3 http的详细过程？
4 关于缓存的头有哪些？
5 说一下协商缓存和强缓存？协商缓存请求时，body中的参数会传给后端吗？
6 什么是强制缓存？
7 什么是同源策略？
同源策略是由NetScape提出的一个著名的安全策略。所谓的同源，指的是协议，域名，端口相同。浏览器处于安全方面的考虑，只允许本域名下的接口交互，不同源的客户端脚本，在没有明确授权的情况下，不能读写对方的资源。
（设想这样一种情况：A网站是一家银行，用户登录以后，又去浏览其他的网站，如果其他网站可以读取A网站的Cookie,会发生什么？很显然，如果Cookie包含隐私（比如存款总额），这些信息就会泄漏。更可怕的是Cookie往往用来保存用于的登录状态，如果用没有退出登录，其他网站就可以冒充用户为所欲为，因为浏览器同时还规定，提交表单不受同源策略的限制。）
由此可见，同源策略是必须的。如果非同源，那么在请求数据时，浏览器会在控制台中报一个异常，提示拒绝访问。
8 JS 的跨域有哪些？
9 为什么JSONP能跨域？
算法
1 说一下排序算法有哪些？哪些稳定和不稳定？