以面试为提纲的前端知识
目录
1.闭包是什么？有什么用途？使用的时候应该注意什么？
2.n的阶乘怎么实现？
3.get 和post 有什么区别？
4.如何实现自动刷新和自动跳转？
5.append和append to的区别？
6.css中隐藏不删除的方法？
7.ajax跨域如何解决？
8.继承的五种方式是什么？
9.请简述浏览器渲染过程。
10.清除浮动的方式。
11.自适应和响应式的区别是什么？
1.闭包是什么？有什么用途？使用的时候应该注意什么？（此问题总结自阮一峰老师的学习JavaScript闭包）
答：闭包就是能够读取其他函数内部变量的函数。
在需要将一个变量存储起来的时候就需要用到闭包。
使用时应注意两点：第一，耗内存；第二，不可轻易改变父函数内部变量的值。
举例：
1 function f1(){ 2 var a = 666; 3 aAdd = function (){a+=1} 4 function f2(){ 5 console.log(a); 6 } 7 return f2; 8 } 9 var result = f1(); 10 result(); //666 11 aAdd();aAdd();aAdd(); 12 result(); //667
2.n的阶乘怎么实现？
1 //n! 2 function fun(n){ 3 if(n < 2){ 4 return 1; 5 }else{ 6 return n * fun(n - 1); 7 } 8 } 9 console.log(fun(3)); //6
3.get 和post 有什么区别？
答：来自w3c的直接对比
4.如何实现自动刷新和自动跳转？
答：
<meta http-equiv="refresh" content="2"> <!--2s后自动刷新--> <meta http-equiv="refresh" content="2; url=http://www.cnblogs.com/qingruozhu/"> <!--2s后自动跳转到我的博客主页-->
5.append和append to的区别？
答：参考百度经验
append(content)方法
方法作用：向每个匹配的元素内部追加内容。
参数介绍：content (<Content>): 要追加到目标中的内容。
用法示例：HTML代码为 <p> I come from </p><p>I love </p>
向所有p标签中追加一个单词china，则写法为 $("p").append("china");
结果为： <p> I come from china</p><p>I love china</p>
appendTo(expr)方法
方法作用：把所有匹配的元素追加到指定的元素集合中。
参数介绍：expr (String): 用于匹配元素的jQuery表达式。
用法示例：HTML代码为 <b>I love china </b><p></p>
把标签b追加到p元素中，写法为 $("b").appendTo("p");
结果为： <p><b>I love china </b></p>
使用appendTo这个方法是颠倒了常规的$(A).append(B)的操作，即不是把B追加到A中，而是把A追加到B中。
6.css中隐藏不删除的方法？
答：visibility: hidden;
7.ajax跨域如何解决？
答：参考悟寰轩-叶秋的博客
一个专门用来解决跨域问题的jQuery插件-jquery-jsonp。
比较一下json与jsonp格式的区别：
json格式：
{
"message":"获取成功",
"state":"1",
"result":{"name":"工作组1","id":1,"description":"11"}
}
jsonp格式：
callback({
"message":"获取成功",
"state":"1",
"result":{"name":"工作组1","id":1,"description":"11"}
})
了解了jsonp之后，使用jsonp插件也就比较简单了，server端代码无需任何改动。
来看一下如何使用jquery-jsonp插件解决跨域问题吧。
1 var url="http://localhost:8080/WorkGroupManagment/open/getGroupById"+"?id=1&callback=?"; 2 $.jsonp({ 3 "url": url, 4 "success": function(data) { 5 $("#current-group").text("当前工作组:"+data.result.name); 6 }, 7 "error": function(d,msg) { 8 alert("Could not find user "+msg); 9 } 10 });
8.继承的五种方式是什么？
答：参考阮一峰老师的Javascript面向对象编程（二）：构造函数的继承
9.请简述浏览器渲染过程。
答：1.解析HTML文件，创建DOM树。2.解析CSS。3.将CSS与DOM合并，构建渲染树（renderingtree）。4.布局和绘制，重绘（repaint）和重排（reflow）。（参见浅析浏览器渲染页面过程）
10.清除浮动的方式。
答：1.父级元素添加overflow：hidden属性。 2.浮动元素下方添加标签并添加clear：both属性。3.伪元素:after。4.双伪元素。（详见关于清除浮动的四种方法）
11.自适应和响应式的区别是什么？
答：自适应的体验http://m.ctrip.com/html5/
响应式的体验 http://segmentfault.com/
（详见响应式和自适应的区别）
12.给个字符串 str = abcbaa，得出{a:3，b:2，c:1}。如何实现？
答：
1 let stri = "abcbaa"; 2 let obj = {}; 3 let arri = stri.split(""); 4 for(let i = 0; i < arri.length;i++){ 5 if(!obj[arri[i]]){ 6 obj[arri[i]] = 1; 7 }else { 8 obj[arri[i]]++; 9 } 10 } 11 console.log(obj);
