酷狗一面
1. 如何实现三栏布局（左右两边固定宽度，中间自适应）？
使用flex布局： 父元素设置
display: flex，左右两边设置固定宽度，中间设置flex-grow: 1；使用浮动布局：左右两边设置固定宽度，而且分别设置
float:left和right，这个方法有一个需要注意的是在HTML中，中间栏需要和右边栏进行对调；使用绝对定位布局：左右两边设置固定宽度和
position:absolute,而且分别设置left: 0和right: 0，中间栏只要设置左右margin为左右栏的宽度就可以了（需要注意的是左右两边需要设置top: 0，不然右边会被订下来）
补充
其实还有表格布局，网格布局和圣杯布局，详细请看三栏布局的5种解决方案及优缺点
2. 如何实现弹窗水平垂直居中？
3. ==和 === 的区别
===为恒等符：当等号两边的值为相同类型的时候，直接比较等号两边的值，值相同则返回true，若等号两边的值类型不同时直接返回false。
==为等值符： 当等号两边的值为相同类型时比较值是否相同，类型不同时会发生类型的自动转换，转换为相同的类型后再作比较。
a、如果一个是null、一个是undefined，那么[相等]。
b、如果一个是字符串，一个是数值，把字符串转换成数值再进行比较。
c、如果任一值是 true，把它转换成 1 再比较；如果任一值是 false，把它转换成 0 再比较。
d、如果一个是对象，另一个是数值或字符串，把对象转换成基础类型的值再比较。对象转换成基础类型，利用它的toString或者valueOf方法。 js核心内置类，会尝试valueOf先于toString；例外的是Date，Date利用的是toString转换。非js核心的对象，令说（比较麻 烦，我也不大懂）
e、任何其他组合，都[不相等]。
4. 30 == '30' 的过程是怎样的？
30为数值类型，而'30'未字符串类型，因此等号两边的数据类型不相等，需要进行转换类型；
由于一个是数值，另一个字符串，所以需要将字符串转换成数值再进行比较，即
'30' => 30;这时等号两边同样为数值型数据，即
30 == 30，所以返回true
5. 以下代码输出的是什么？为什么呢？
-
for (var i=0; i<5; i++) { -
setTimeout( function timer() { -
console.log(i); -
}, 0 ); -
}
6. 你有使用过闭包吗？
7. 模块化的异步加载怎样做？
8. window.onload执行时间？
9.图片加载完的时候会执行吗？
10. 了解JS继承吗？
11. 利用原型链的继承有什么缺点吗？
12. 知道如何修改this的指向吗？
修改this指向的办法有三种：
apply、call和bindapply、call：通过传入需要指向的对象，从而改变this的指向，指向传入的第一个参数;bind：它会创建一个函数的实例，其this值会被绑定到传给bind()函数的值。
-
window.color = 'red'; -
var o = { color:'blue' }; -
function sayColor(){ -
console.log(this.color); -
} -
var globalSaycolor = sayColor; -
var objectSaycolor = sayColor.bind(o); -
globalSaycolor(); // red -
objectSaycolor(); // blue
补充
其实还有一种：new关键字改变this指向
因为在new的过程中，其中有一个步骤为将构造函数内部的this指向实例对象，所以通过new关键字也可以改变this的指向。
13. apply和 call的区别？
相同点：可以用来代替另一个对象调用一个方法，将一个函数的对象上下文从初始的上下文改变为由thisObj指定的新对象。
不同点：实际上，
apply和call的功能是一样的，只是传入的参数列表形式不同。apply：最多只能有两个参数——新this对象和一个数组argArray。如果给该方法传递多个参数，则把参数都写进这个数组里面，当然，即使只有一个参数，也要写进数组里。如果argArray不是一个有效的数组或arguments对象，那么将导致一个TypeError。如果没有提供argArray和thisObj任何一个参数，那么Global对象将被用作thisObj，并且无法被传递任何参数。
call：它可以接受多个参数，第一个参数与apply一样，后面则是一串参数列表。这个方法主要用在js对象各方法相互调用的时候，使当前this实例指针保持一致，或者在特殊情况下需要改变this指针。如果没有提供thisObj参数，那么 Global 对象被用作thisObj。
14. 有一个按钮是异步生成的，怎样对它进行事件绑定？
由于按钮是异步生成的，所以我选择将事件绑定在按钮生成的父元素上，通过事件委托的机制，利用事件冒泡，把事件绑定在父元素上，可以通过判断
event.target按钮是否已经生成，从而实现相应的事件。科普补充：
事件冒泡可以形象地比喻为把一颗石头投入水中，泡泡会一直从水底冒出水面。也就是说，事件会从最内层的元素开始发生，一直向上传播，直到document对象；
事件捕获则跟事件冒泡相反，事件会从document对象开始发生，直到最具体的元素；
15. 跨域有处理过吗？
我处理过的跨域有两种情况：
一种是在页面中嵌入了一个iframe，因此父子iframe间产生了跨域，要解决这个问题，只需要把
document.domain设置成相同的值就可以在两个页面里进行相应的操作了；另外一种情况是用Vue开发涉及到的跨域问题，这个问题只需要修改config文件夹下的index.js中的dev:{}部分中修改proxyTable参数即可，相当于对跨域的url进行了代理，从而可以顺利访问。
另外说了一下自己比较熟悉的一种跨域解决方案：JSONP
JSONP解决跨域问题的本质其实就是<script>标签可以请求不同域名下的资源，即<script>请求不受浏览器同源策略影响。
面试官听到JSONP立刻提出了一个问题：JSONP是否可以支持 POST方法？为什么？
JSONP只支持
GET的请求方法，上面也提到了JSONP原理其实就是利用<script>标签发送了一个URL给服务器，其实与ajax XMLHttpRequest协议无关了，相当于输入了一个url而已，所以必然只能为GET请求方法。
16. 既然提到 POST和 GET，说说两者的区别？
大小：
GET提交的数据最大为2k（原则上url长度无限制，可是浏览器通常限制url长度在2k左右）；POST理论上没有限制大小（实际上IIS4中最大量为80KB，IIS5中为100KB）。发送方式：
GET请求数据放在url上，即HTTP协议头中，其格式为：url?key=value&key2=value;POST把数据放在HTTP的包体中（Request Body）。安全性：
GET请求可被缓存，请求保存在浏览器历史记录中；POST则不能被缓存。与POST相比，GET的安全性较差，因为发送的数据是URL的一部分。发送TCP包：对
GET请求只产生一个TCP包，浏览器会把http header和data一并发送出去，服务器响应200（返回数据）；对于POST请求产生两个TCP数据包，浏览器先发送http header，服务器确认权限正确响应100(continue)返回浏览器，浏览器收到100确认继续请求，再次发送data，服务器响应200（返回数据）。
17. 听到你提到浏览器，你了解浏览器缓存的方式吗？
18. 看你有用过Promise，知道Promise有几种状态？
19. 你知道 pending状态可以停止吗？
20. 那XMLHttpRequest 的 pending状态可以停止吗？
21. 知道Promise和setTimeout的执行顺序吗？
22. vue中生命周期中的钩子函数用过哪些？
23. 为什么不把数据放在created函数中？
24. 对Vue的数据双向绑定有了解吗？
25. 了解重绘和回流吗？页面的加载顺序？
26. 如何减少回流、重绘？怎样控制只有一部分回流？
27. 了解什么算法？快排？
28. 还了解什么排序算法？
29. 了解二叉查找树吗？
30. 有了解什么后端语言吗？知道面向对象的特性吗？
31. 知道数据库连接池吗？
32. 未来前端的规划？
酷狗二面
在面完第一面之后，本来以为终于结束了，没想到迎来的是第二技术面，后面面试官介绍说其实本来是应该两个人同时面我的，因为有一个面试官没空，所以就错开了，就有了"二面"了，其实本质上还是一面而已。
