面试题

2015年9月16日 百度一面   928
面试官很年轻，很阳光，也很亲和。所以进行的比较顺利。被问到的题目有：
1、DOCTYPE的作用；
2、get和post的区别；
3、跨域的方式，重点是H5的跨域方式；（腾讯是jsonp跨域是如何实现的）；
4、JS中的类型检测：
typeof、 instanceof、 object.prototype.toString、 constructor
5、JS中的继承：基于原型链的继承、基于构造函数的继承。。。
6、两栏布局（左边一栏固宽右边一栏自适应） 几种实现方式；
（1）
/*定位 定位自适应的盒子*/
.left{
width:100px;
height:100px;
background:blue;


}
.right{
position:absolute;
top:0;
left:120px;
right:0;
background:red;
}
（2）

/*浮动*/
.left{
width:100px;
height:100px;
background:blue;
float:left;


}
.right{
margin-left:120px;
height:100px;
background:red;
}
7、BFC的作用以及如何创建一个BFC；
8、 canvas的使用；（SVG也很会被问到）
9、盒子的水平、垂直居中的方式：
(1)
width:100px;
height:100px;
position:absolute;
top:50%;
left:50%;
margin-left:-50px;
margin-right:-50px;
(2)table 和 table-cell方式
(3)vertical-middle和text-align:center方式

10、将一个字符串中的所有单词的首字母大写；（正则）




2015年9月18日 百度二面 930
面试官非常平易近人，就是说话听不清
1、三栏布局（两边定宽，中间自适应）
（1）
/*一、定位（定位固宽的元素）：*/
.left,.right{
width:100px;
height:100%;
position:absolute;
top:0;
background:blue;
}
.left{
left:0;
}
.right{
right:0;
}
.main{
height:100%;
margin:0 120px;
background:red;
}




（2）
/*二、浮动+定位： （定位自适应的元素且浮动固宽的元素）*/
.left,.right{
width:100px;
float:left;
background:blue;
height:100px;
}
.right{
float:right;
}
.main{
height:100px;
position:absolute;
left:120px;
right:120px;

background:red;
}

2、累加求和问题

3、算法思想问题


4、对于前段工程师工作的理解

5、对于前端开发构建工具的使用及了解




2015年9月20日百度三面

1、自己写过的UI：
（一）、瀑布流布局
对于瀑布流的实现方式有3种：
Javascript+jquery+css3
【1】javascript原生方式实现瀑布流布局
实现原理是：加载图片时，所有图片的位置是通过计算然后通过绝对定位的方式将它定位到它该出现的位置上；
（1）所有的小盒子即box都要进行绝对定位，而他们都是相对于main大盒子（他们的父盒子）进行定位的；
（2）onscroll事件实现瀑布流布局的图片的加载功能；
页面滚走距离：
标准模式（HTML）document.documentElement.scrollTop;
混杂模式（body）document.body.scrollTop;

（二）、图片的拖曳效果：
首先计算出鼠标点击时的位置（x,y）以及该位置相对于盒子的相对距离(offX,offY)然后再计算鼠标松开时的位置(x1,y1)，最后（x1-offX,y1-offY）即为所求。

（三）、轮播图：js+jquery

2、对前端使用的框架或类：
bootstrap、fontAwesome、ratchet、jquery、flexpaper。