2017校招
1 写出inline和inline-block的差别：
布局方式相同，唯一的区别在inline-block可以设置宽高，inline不可以。另外：inline设置上下内边距和上下外边距会造成一些mess。
2 写出五大主流浏览器的内核名称
ie(trident),firefox(gecho),google chrome(blink),safari(webkit),oprea(blinnk)
3 根据具体的情景写出一个JSON数据
知道JSON数据怎么写，了解JSON数据和JS对象的区别就可以，很简单。
4 考察字体大小的单位：rem,em,百分比
em:
核心观点:
可以复合计算，当前元素的一个em值的大小等于父元素的字体大小（如果父元素被定义了字体大小，递归找父元素），否则等于浏览器一般默认的16px
rem
核心观点：避免em的复合计算，相对root html元素的大小。
百分比：与em相似
5 隐藏元素的N种方式
opacity
.hide {
opacity: 0;
}
占据空间，可以响应用户交互，可以有动画。
visibility
.hide {
visibility: hidden;
}
占据空间，但是不响应用户交互，可以有动画。
display
display: none
不占据空间，不响应交互，没有动画。
Position
.hide {
position: absolute;
top: -9999px;
left: -9999px;
}
不占据空间，响应交互
6 jQuery中live,bind,on,delegate的区别
.bind()是直接绑定在元素上
.live()则是通过冒泡的方式来绑定到元素上的。更适合列表类型的，绑定到document DOM节点上。和.bind()的优势是支持动态数据。
.delegate()则是更精确的小范围使用事件代理，性能优于.live()
.on()则是最新的1.9版本整合了之前的三种方式的新事件绑定机制
7 如何去除img元素底部的空白
1.img{vertial-align:middle}
2.div{line-height:0}//div为img的父标签
3.img{float:left}
4.img{font-size:0}//会造成图文混乱
5.img{display:block}
1.svg画四边形，四个点的坐标分别是（220，100）（300，210）（170，250）（123，234）
<svg height="300">
<polygon points="220,100 300,210 170,250 123,234" style="fill:blue;stroke:black;stroke-width:1;">
</svg>
2.写出promise构造函数
var promise=new Promise(
function (resolve,reject) {
if("异步处理成功"){
resolve ();
}else{
reject();
}
});
promise.then(
function A () {
console.log("事件处理成功时的操作")
},
function B() {
console.log("事件处理失败时的操作")
}
)
3.如何让动态插入的div响应绑定事件
<div id="testdiv">
<ul></ul>
</div>
//jquery 1.7版以后使用on动态绑定事件
$("#testdiv ul").on("click","div", function() {
//do something here
});
4.如何阻止冒泡事件和默认事件
（1）阻止冒泡事件
function stopBubble(e) {
if(e && e.stopPropagation){
e.stopPropagation();
} else {
window.event.cancelBubble = true;
}
};
（2）阻止默认事件
function stopDefault(e){
if(e && e.preventDefault) {
e.preventDefault();
} else {
window.event.returnValue = false;
}
return false;
};
JavaScript停止冒泡和阻止浏览器默认行为
5.翻译：Using store state in a component simply includes returning the state within a computed property , because the store state is reactive . Triggering changes simply means committing mutations in component methods .
在组件中使用存储状态简单地包括在计算属性中返回状态，因为存储状态是被动的。触发的变化意味着在组件的方法进行突变。
6.实现ajax的过程和代码
（1）创建XMLHttpRequest对象；
（2）注册回调函数，在XMLHttpRequest中设置要发送的请求，利用的是open（first,second,third）方法
@param first：提交的方式 get或者是post
@param second：该次请求的路径url，如果是get，则需要在路径后加上传递的相应参数parama，该url为servlet对应的url
@param third：提交的模式是同步模式还是异步模式 true代表异步模式
（3）发送请求给服务器，利用的是xmlHttp.send(null) ，加上null代表火狐和ie都支持
（4）利用xmlHttp的onreadystatechange的事件来监视xmlHttp.readyState的状态，每次改变时都调用函数(回调函数)
（5）在回调函数中处理返回值 利用dom模型写到页面的指定位置 实现局部刷新
var XHR=null;
var XHRcreate=function() {
if (window.XMLHttpRequest) {
//针对FireFox，Mozillar，Opera，Safari，IE7，IE8
XHR = new XMLHttpRequest();
//针对某些特定版本的mozillar浏览器的BUG进行修正
if (XHR.overrideMimeType) {
XHR.overrideMimeType("text/xml");
}
} else if (window.ActiveXObject) {
//针对IE6，IE5.5，IE5
var activexName = ["MSXML2.XMLHTTP","Microsoft.XMLHTTP"];
for (var i = 0; i < activexName.length; i++) {
try{
//如果创建失败，回抛出异常，然后可以继续循环，继续尝试创建
XHR = new ActiveXObject(activexName[i]);
break;
} catch(e){
}
}
}
}
XHRcreate();
XHR.onreadystatechange = callback;
//XHR.open("GET","login_verify.jsp?name="+ userName,true);
//XHR.send(null);
XHR.open("POST","AJAXXMLServer",true);
XHR.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
XHR.send("name=" + userName);
function callback() {
//判断对象的状态是交互完成
if (XHR.readyState == 4) {
//判断http的交互是否成功
if (XHR.status == 200) {
var responseText = XHR.responseText;
//通过dom的方式找到div标签所对应的元素节点(为了简便,这里客户端的程序未写了)
var divNode = document.getElementById("result");
divNode.innerHTML = responseText;
} else {
alert("error！");
}
}
}
7.new操作符做了什么？
（1）创建了一个空对象
var obj = new object();
（2）设置原型链
obj._proto_ = fn.prototype;
（3）让fn的this指向obj，并执行fn的函数体
var result = fn.call(obj);
（4）判断fn的返回值类型，如果是值类型，返回obj。如果是引用类型，就返回这个引用类型的对象。
if (typeof(result) == "object"){
fnObj = result;
} else {
fnObj = obj;
}
8.写出3种异步加载方案
异步加载又叫非阻塞加载，浏览器在下载执行js的同时，还会继续进行后续页面的处理。默认情况javascript是同步加载的，也就是javascript的加载时阻塞的，后面的元素要等待javascript加载完毕后才能进行再加载，对于一些意义不是很大的javascript，如果放在页头会导致加载很慢的话，是会严重影响用户体验的。异步加载主要有以下三种方式：
（1）async：
定义：async 属性规定一旦脚本可用，则会异步执行。
用法：<script type="text/javascript" src="async.js" async="async"></script>
注释：async 属性仅适用于外部脚本（只有在使用 src 属性时）。
注释：有多种执行外部脚本的方法：
如果 async=”async”：脚本相对于页面的其余部分异步地执行（当页面继续进行解析时，脚本将被执行）；
如果不使用 async 且 defer=”defer”：脚本将在页面完成解析时执行；
如果既不使用 async 也不使用 defer：在浏览器继续解析页面之前，立即读取并执行脚本 。
（2）defer：
只支持IE
defer 属性规定是否对脚本执行进行延迟，直到页面加载为止。有的 javascript 脚本 document.write 方法来创建当前的文档内容，其他脚本就不一定是了。
如果您的脚本不会改变文档的内容，可将 defer 属性加入到
<script type="text/javascript" defer="defer">
alert(document.getElementById("p1").firstChild.nodeValue);
</script>
（3）创建script，插入到DOM中，加载完毕后callBack
function loadScript(url, callback){
var script = document.createElement_x("script")
script.type = "text/javascript";
if (script.readyState){ //IE
script.onreadystatechange = function(){
if (script.readyState == "loaded" || script.readyState == "complete"){
script.onreadystatechange = null;
callback();
}
};
} else { //Others: Firefox, Safari, Chrome, and Opera
script.onload = function(){
callback();
};
}
script.src = url;
document.body.appendChild(script);
}
19春招
1、写出手机号的正则表达式
^1[3|4|5|7|8]\d{9}$ ^开始符号 首位为1 第2位为3或4或5或7或8 后面9位为任意数字 $结束符号
2、css的继承属性
字体系列：font、font-size、font-weight
文本系列：text-align、line-height、color、text-transform
cursor、visibility、list-style
3、css制作动画效果的3个属性
transition、transform、animation
4、Promise的例子
function aaa(){
var p = new Promise(function(resolve,reject){
setTimeout(function(){
console.log('11111');
resolve('2222'); },1000); });
return p;}
aaa().then(function(data){
console.log(data);
});
5、css绘制一个直角梯形
一开始想到了border，但设置了高度，所以没有成功
<head>
<style>
.mask{ height: 0; width: 100px; border-top: 100px solid red; border-left: 37px solid transparent; }
</style>
</head>
<body>
<div class="mask"></div>
</body>
6、HTTP协议请求方式
get、post、put、head、connect、trace、options、delete
18年
JS基础是要有的，字符串函数 split() 还有数组一些api ， reverse() join('') 这些要熟悉
正则表达式！是必考，反正我做的校招笔试题都会有问到，不直接问都会应用到。多益问的是写出手机号正则，还算简单
图像格式： .jpg .png .svg .gif 图像有啥区别
写出几个你网站优化的方法 ： 应该往减少http请求，压缩源代码，控制图片大小，缓存，减少DOM操作方面等答。
原生AJAX 其实ajax蛮简单的，用的也很多。这个记住四步就可以了
form 表单 提交的属性 和请求的方法属性 分别是？ action 和 method 这个method属性临时忘了，自己都想打一巴自己了
翻译英文片段， 多益还有这个题，有点够呛，看了应该是框架文档原文。
大题： 给你一段JSON数据，每条JSON代表一个对象，有个属性指向它的父对象，请把这段JSON转为一个树形结构的对象。
2、计算机网络中五层协议分别是什么，HTTP属于哪一层？
计算机网络中五层协议分别是（从下向上）：1) 物理层 2）数据链路层 3）网络层 4）传输层 5）
应用层七层：物理层->数据链路层->网络层->传输层->会话层->表示层->应用层
其功能分别是：
1）物理层主要负责在物理线路上传输原始的二进制数据；
2）数据链路层主要负责在通信的实体间建立数据链路连接；
3）网络层主要负责创建逻辑链路，以及实现数据包的分片和重组，实现拥塞控制、网络互连等功能；
4）传输曾负责向用户提供端到端的通信服务，实现流量控制以及差错控制。（TCP、UDP）
5）会话层：定义了何时开始、控制和结束一个回话，包括对多个双向消息的控制和管理，以便在只完成连续消息的一部分时可以通知应用，从而使得表示层看到的数据是连续的，某些情况下，如果表示层收到了所有的数据，则用数据代表表示层。
6）表示层：主要功能是定义数据格式以及加密，
7）应用层为应用程序提供了网络服务。一般来说，物理层和数据链路层是由计算机硬件（如网卡）实现的，网络层和传输层由操作系统软件实现，而应用层由应用程序或用户创建实现。
3、传输层有哪些协议?TCP协议与UDP协议的区别。
传输层（Transport Layer）是OSI中最重要, 最关键的一层,是唯一负责总体的数据传输和数据控制的一层.传输层提供端到端的交换数据的机制，检查分组编号与次序。传输层对其上三层如会话层等，提供可靠的传输服务,对网络层提供可靠的目的地站点信息.主要功能： 为端到端连接提供传输服务.这种传输服务分为可靠和不可靠的,其中Tcp是典型的可靠传输,而Udp则是不可靠传输. 为端到端连接提供流量控制,差错控制,服务质量(Quality of Service,QoS)等管理服务. 具有传输层功能的协议： TCP UDP SPX NetBIOS NetBEUI
4、你听过 DNS吗？可以讲讲吗？（我只听过没印象） DNS（Domain Name System，域名系统），万维网上作为域名和IP地址相互映射的一个分布式数据库，能够使用户更方便的访问互联网，而不用去记住能够被机器直接读取的IP数串。通过域名，最终得到该域名对应的IP地址的过程叫做域名解析（或主机名解析）。DNS协议运行在UDP协议之上，使用端口号53。
5、排序算法有哪些？并给出时间复杂度
插入排序
选择排序
冒泡排序
快速排序
哈希排序
堆排序
6、事件响应问题事件：JavaScript 创建动态页面。事件是可以被 JavaScript 侦测到的行为。 网页中的每个元素都可以产生某些可以触发 JavaScript 函数或程序的事件。比如说，当用户单击按钮或者提交表单数据时，就发生一个鼠标单击（onclick）事件，需要浏览器做出处理，返回给用户一个结果。
7、你听过 ES6规范吗，列举一些你所知道的差别
答案请参考：https://blog.csdn.net/chenjuan1993/article/details/80952918
