今天又经历了两场面试，先说说感受，比想象中的简单。
第一家公司做了一套题目，面聊基本没问技术，只是展示了一些线上作品，当场给的offer，只是期望薪资略高，hr说需要去申请，如果能申请下来下周三就可以入职啦。第二家公司简单聊了聊简历上的项目，问了一些很基础的问题，不过他们公司使用angular做的，而我只用过vue，虽然CTO说感觉差不多，不过觉得他们应该更希望找到一个有过angular经验的人。
下面来说说关于笔试和面试题目。
第一家公司笔试题如下：
1、js中阻止事件冒泡方式及区别
方法1: 使用event.stopPropagation( )阻止事件冒泡。(对于IE浏览器，使用event.cancelBubble = true)
方法2: 使用 event.target判断当前点击的元素是否为this，通过this匹配只触发所点击元素。
方法3: 使用 event.preventDefault()取消默认事件
2、解释说明jsonp的工作原理
ajax请求受同源策略影响，不允许进行跨域请求，而script标签src属性中的链接却可以访问跨域的js脚本，利用这个特性，服
务端不再返回JSON格式的数据，而是返回一段调用某个函数的js代码，在src中进行了调用，这样实现了跨域。
3、一个URL，用js获取参数的值，写出实例
function getParse(){
var url = window.location.href();
var str = url.split("?")[1]; //找到一个数组，通过?分割，取?后面的参数
var items = str.split("&");//通过&分割成数组
var arr,name,value;
for(var i=0;i<items.length,i++){
arr = items[i].split("=");
name = arr[0];
value = arr[1];
this[name] = value;
}
}4、Call() 和 Play() 的区别
相同点：两个方法产生的作用是完全一样的，都用来改变当前函数调用的对象。
不同点：调用的参数不同 ，apply最多只能有两个参数——this对象和一个数组，call可以接受多个参数，第一个参数与apply一样，后面则是一串参数列表。
总结： foo.call(this,arg1,arg2,arg3) == foo.apply(this, arguments)==this.foo(arg1, arg2, arg3)
5、JQuery插件的写法，写一个验证表单输入合法性的插件，要求输入以英文单词开头，数字结尾（要求正则进行匹配）
(function($){
var reg = /^[a-zA-Z].*\d$/;
var test = "a@JDSH1";
reg.test(str);
})(jQuery)6、var test =[["北京","上海","深圳"],["南京","无锡","苏州"],["杭州","金华","上海"]]，把该函数组去重
function cutname(){
var temp = [];
for(vari=0;i<test.length:i++){
var items[] = test[i].split(",");
for(var j=0;j<items.length,j++){
if(temp.indexOf(items[j]==-1)){
temp.push(items[i]);
}
}
}
return temp;
}
第二家公司面试问题：
1、display：none与visibility：hidden的区别
display:none;会让元素完全从渲染树中消失，渲染的时候不占据任何空间；
visibility: hidden;不会让元素从渲染树消失，渲染师元素继续占据空间，只是内容不可见;
display: none;是非继承属性，子孙节点消失由于元素从渲染树消失造成，通过修改子孙节点属性无法显示；
visibility: hidden;是继承属性，子孙节点消失由于继承了hidden，通过设置visibility: visible;可以让子孙节点显示;
修改常规流中元素的display通常会造成文档重排。修改visibility属性只会造成本元素的重绘。
读屏器不会读取display: none;元素内容；会读取visibility: hidden;元素内容
2、display的参数block、inline、inline-block、Flexible Box的区别
1）display：block
block元素会独占一行，多个block元素会各自新起一行。默认情况下，block元素宽度自动填满其父元素宽度。
block元素可以设置width,height属性。块级元素即使设置了宽度,仍然是独占一行。
block元素可以设置margin和padding属性。
2）display：inline
inline元素不会独占一行，多个相邻的行内元素会排列在同一行里，直到一行排列不下，才会新换一行，其宽度随元素的内容而变化。
inline元素设置width,height属性无效。
inline元素的margin和padding属性，水平方向的 margin-left, margin-right 会产生边距效果；但竖直方向的 margin-top, margin-bottom 不会产生边距效果。padding 属性会产生边距效果。
3）display：inline-block
简单来说就是将对象呈现为inline对象，但是对象的内容作为block对象呈现。之后的内联对象会被排列在同一行内。
比如我们可以给一个link（a元素）inline-block属性值，使其既具有block的宽度高度特性又具有inline的同行特性。
4）Flexible Box
意为"弹性布局"，用来为盒状模型提供最大的灵活性。设为Flex布局以后，子元素的float、clear和vertical-align属性将失效。它即可以应用于容器中，也可以应用于行内元素。
3、对于响应式布局有没有什么需要注意的地方
4、怎样让元素一个一个的横着排列
1）使用float浮动
2）使用绝对定位
5、说说浏览器的兼容性问题
列举几个例子就ok
6、你知道你们后台用的是什么框架吗？或者说整体用的是什么框架？
开放式题目，用的什么答什么就OK。