用血与泪换来的面试经

今天面试被血虐，故好好总结一番，希望明天可以不用丢脸。
先说第一家面试问题比较水，态度也不好，但我也不会：
主要问了一些http和ajax的问题。
http请求过程：

1. 建立连接，tcp的三次握手，通过网址进行DNS解析，找到网址对应的IP地址，没有端口号的url使用默认端口号（一般是80）
2. 客户端想服务端发送请求，包括请求头
3. 服务端向客户端发送响应，包括请求头的响应
   常用的HTTP头信息有：
   　　① HTTP 1.0 200 OK 　这是Web服务器应答的第一行，列出服务器正在运行的HTTP版本号和应答代码。代码"200 OK"表示请求完成。
   　　② MIME_Version:1.0　它指示MIME类型的版本。
   　　③ content_type:类型　这个头信息非常重要，它指示HTTP体信息的MIME类型。如：content_type:text/html指示传送的数据是HTML文档。
   　　④ content_length:长度值　它指示HTTP体信息的长度（字节）。
4. 关闭连接
   JS实现缓存：
   第一次请求的时候把一些数据存在JS对象中，这样可以减少对服务器的访问。
   Var data = { data : [a,b,c,d]}//需要请求的数据放在json里
   Var cache;//缓存对象
   $.ajax({//向后台请求数据
   Type:”post”,
   dataType:”json”,
   data:data,
   url:main/main.act,
   success:function(result){
   cache = result.json;
   }
   })
   这样所需要的数据从cache中取，即可减少对服务器的访问。
   Ajax
   关于ajax，今天两家都说道了。我好好总结一下ajax整个请求过程。
   JS原生
   Var xhr = new XMLHttpRquest();
   Xhr.open(‘post’,url,async)
   Xhr.send(null);
   Xhr.onreadystatechange=function(){
   If(xhr.readystate == 4 && xhr.status == 200 || xhr.status == 304){
   document.getElementById("myDiv").innerHTML= xmlhttp.responceText;
   }
   }
   Readystate状态码：
   0是请求未初始化，1是服务器已建立连接，2是请求已接受，3是请求处理中，4是请求已完成，并响应数据。
   Status服务器状态码：
   200OK，304请求数据没有发生变化，404url错误，500服务器错误。
   JQ：
   $.ajax({
   Type : “post/get”,
   url : “main/main.act”,
   data : {
   a : a,
   b:b,
   c:c
   }
   DataType:”json”,//预期返回值类型
   Cache:false//默认是false，get方式请求有效，true为请求第一次的数据
   Success:function(result){
   document.getElementById("myDiv").innerHTML= result;
   }
   Error:function(){
   Alert(“网络异常！”);
   }
   beforeSend:function(){//请求得到之前
   }
   })
   Ajax get和post的区别，
   Get方式若url地址不变，请求第一次返回的数据；会被缓存，且数据小，字符有要求。
   Ajax跨域请求
   Jsonp:”callbackParam”,
   jsonpCallBack:” jsonpCallBack1”
   意思就是在url+? callbackParam= jsonpCallBack1;,只支持get方式
   Enchar的使用
   变量提升，这个我竟然懵住了
   变量先参与运算后声明，这种情况声明会被提前，叫做变量提升

再说第二家面试，面试完我感觉都要死了。
首先做一套面试题，第一题我就错了，
1.”5”+4 = ?
正确答案是”54”，我竟然迷之自信的答了个9.疯了丢死人了。
2.怎么判断是chrome浏览器，机智的背了一遍，之后面试又让我重写了一下。
Var agent = Window.navigator.userAgent;
agent.indexOf(“Chrome”)!=-1;
拓展：判断IE8
agent.indexOf(“compatible”)!=-1&& agent.indexOf(“MSIE”)!=-1;
3.cookie,sessionStorage,localStorage的区别。
主要区别是cookie缓存比较小不能大于4K，后两者由于储存在客户端，所以缓存比较大但不能大于5M。sessionStorage是当前对话的缓存，浏览器窗口关闭即消失，localStorage持久存在，除非清除浏览器缓存。

1. js如何实现继承
   这里用call()和apply();
   Function a(){
   Var u = this.u;
   }
   Functionb(){
   a.call(this,u);
   }
   Call()和apply()的区别在于apply第二个参数是数组。
   还有一种能看懂的：
   Function parent(){
   This.property = true;
   }
   Function child(){};
   Child.property = new parent();
   利用原型链进行继承。
2. 闭包
   为什么要用闭包，这个我答的不好。
   回来查了一下，能看懂的是循环绑定。
   var a = document.getElementsByTagName("a");
   for(var i =0; i<a.length; i++){
   a[i].onclick = (function(i){
   return function(){alert(i);}
   })(i);
   }
   下面说提问到的问题：

3. css层叠上下文：z轴上展现的位置顺序，background最后，block<float<inline<+z-index

4. margin影响父级元素。
   垂直方向，嵌套或者毗邻的盒元素会发生外边距重叠的现象。
   解决方法：在父级元素div添加一个padding-top:1px;或者overflow:hidden;
   Css就是前两个了，我都不会也就没机会再被问下去，JS部分更惨，ajax写的很丢脸。
5. 两个数组合并
   a. concat(b);
   之后问了一些前后端分离的理解，H5的理解，用过哪些打包工具，前端MVC，敏捷开发，vue,react之类的。
   前后端分离：后台给前台一个API（JSON），前后台的开发互不影响。
   前端MVC：把视图和数据分离开。
   敏捷开发：以人为核心，少写文档，快速迭代，大项目分为多个小项目。更适应市场环境。
   H5新特性：语义话标签，video,audio标签，离线缓存，canvas画布，xmlhttprequest2跨域请求。