笔试题目：
这个面试官好吓人。显示笔试题做30分钟。然后拿着一大本面试题。照着答案抽问我。懵逼。还是一家外包公司
==============
我的参考答案：
1. 题目可能有误。应该是两个div，一个是bigbox，一个是smallbox，图中多了些莫名其妙的东西。
.bigbox{
position: relative;
}
.smallbox{
margin: auto;
position: absolute;
left: 0; right: 0; top: 0; bottom: 0;
overflow:auto
}
2. 清除浮动方法 在浮动元素后使用一个空元素如 <div class="clear"></div> ，并在CSS中赋予 .clear{clear:both;} 属性即可清理浮动。
3. 宽高都是142
4. 选择器类型：①通用元素选择器 ②类型选择器 ③class选择器④id选择器
可以继承的属性（随便写四个，不要写太全了）：1、字体系列属性 2、文本系列属性 3、元素可见性：visibility 4、表格布局属性：caption-side 5、列表属性：list-style-type 6、设置嵌套引用的引号类型：quotes
优先级： 下面列表中，选择器类型的优先级是递增的：类型选择器< class选择器< id选择器 给元素添加的内联样式 (例如，style="font-weight:bold") 总会覆盖外部样式表的任何样式 ，因此可看作是具有最高的优先级。 当在一个样式声明中使用一个 !important 规则时，此声明将覆盖任何其他声明
5. 常用的有Sass、Less 和 Stylus 这三种 css 预处理器。使用的好处：弥补了直接写 css 的一些缺憾：
语法不够强大，比如无法嵌套书写导致模块化开发中需要书写很多重复的选择器；
没有变量和合理的样式复用机制，使得逻辑上相关的属性值必须以字面量的形式重复输出，导致难以维护。
6. 实现响应式布局有以下几种方法：
1. 媒体查询
CSS3媒体查询可以让我们针对不同的媒体类型定义不同的样式，当重置浏览器窗口大小的过程中，页面也会根据浏览器的宽度和高度重新渲染页面。
2.百分比布局
通过百分比单位，可以使得浏览器中组件的宽和高随着浏览器的高度的变化而变化，从而实现响应式的效果。
3.rem布局
REM是CSS3新增的单位，并且移动端的支持度很高，
7. 相同点：都是存储数据，存储在web端，并且都是同源
不同点：
（1）cookie 只有4K 小 并且每一次请求都会带上cookie 体验不好，浪费带宽
（2）session和local直接存储在本地，请求不会携带，并且容量比cookie要大的多
（3）session 是临时会话，当窗口被关闭的时候就清除掉 ，而 local永久存在，cookie有过期时间
（4）cookie 和local都可以支持多窗口共享，而session不支持多窗口共享 但是都支持a链接跳转的新窗口
8. 基本类型：String、Number、Boolean、Symbol、Undefined、Null
判断类型的5种方法：
1.使用typeof
2.使用instanceof
3.使用constructor：undefined和null没有contructor属性
4.使用Object.prototype.toString.call
5.使用jquery中的$.type
9. JavaScript实现继承的方式：
类式继承
构造函数继承
组合继承
寄生组合式继承
extends继承
10. 1、语法更加简洁、清晰
2、箭头函数不会创建自己的this
3、箭头函数继承而来的this指向永远不变
4、.call()/.apply()/.bind()无法改变箭头函数中this的指向
5、箭头函数不能作为构造函数使用
6、箭头函数没有自己的arguments
7、箭头函数没有原型prototype
8、箭头函数不能用作Generator函数，不能使用yeild关键字
11. 利用filter去重
function unique(arr) {
return arr.filter(function(item, index, arr) {
//当前元素，在原始数组中的第一个索引==当前索引值，否则返回当前元素
return arr.indexOf(item, 0) === index;
});
}
12 第一个： 01234
第二个：12435
笔试后问到的技术问题：
1.vuejs的生命周期？
什么是 vue 生命周期？有什么作用？
答：每个 Vue 实例在被创建时都要经过一系列的初始化过程——例如，需要设置数据监听、编译模板、将实例挂载到 DOM 并在数据变化时更新 DOM 等。同时在这个过程中也会运行一些叫做 生命周期钩子 的函数，这给了用户在不同阶段添加自己的代码的机会。（ps：生命周期钩子就是生命周期函数）例如，如果要通过某些插件操作DOM节点，如想在页面渲染完后弹出广告窗， 那我们最早可在mounted 中进行。
请详细说下你对vue生命周期的理解？
答：总共分为8个阶段创建前/后，载入前/后，更新前/后，销毁前/后。
创建前/后： 在beforeCreated阶段，vue实例的挂载元素$el和**数据对象**data都为undefined，还未初始化。在created阶段，vue实例的数据对象data有了，$el还没有。
载入前/后：在beforeMount阶段，vue实例的$el和data都初始化了，但还是挂载之前为虚拟的dom节点，data.message还未替换。在mounted阶段，vue实例挂载完成，data.message成功渲染。
更新前/后：当data变化时，会触发beforeUpdate和updated方法。
销毁前/后：在执行destroy方法后，对data的改变不会再触发周期函数，说明此时vue实例已经解除了事件监听以及和dom的绑定，但是dom结构依然存在。
2.vuejs的传值有哪些方式？
3.vuejs的监听和计算属性介绍一下？
分别简述computed和watch的使用场景
答：computed:
当一个属性受多个属性影响的时候就需要用到computed
最典型的栗子： 购物车商品结算的时候
watch:
当一条数据影响多条数据的时候就需要用watch
栗子：搜索数据
4.项目怎么优化的？
你如何优化自己的代码？
代码重用
避免全局变量（命名空间，封闭空间，模块化mvc..）
拆分函数避免函数过于臃肿
注释
5.js的基本数据类型和引用数据类型。及区别？
JS分两种数据类型：
基本数据类型：Number、String、Boolean、Null、 Undefined、Symbol（ES6），这些类型可以直接操作保存在变量中的实际值。
引用数据类型：Object（在JS中除了基本数据类型以外的都是对象，数据是对象，函数是对象，正则表达式是对象）
6.vuejs的路由传参方式？
7.同步和异步有什么区别？
同步
所有的操作都做完，才返回给用户。这样用户在线等待的时间太长，给用户一种卡死了的感觉（就是系统迁移中，点击了迁移，界面就不动了，但是程序还在执行，卡死了的感觉）。这种情况下，用户不能关闭界面，如果关闭了，即迁移程序就中断了。
异步
将用户请求放入消息队列，并反馈给用户，系统迁移程序已经启动，你可以关闭浏览器了。然后程序再慢慢地去写入数据库去。这就是异步。但是用户没有卡死的感觉，会告诉你，你的请求系统已经响应了。你可以关闭界面了。
同步，是所有的操作都做完，才返回给用户结果。即写完数据库之后，再响应用户，用户体验不好。
异步，不用等所有操作都做完，就相应用户请求。即先响应用户请求，然后慢慢去写数据库，用户体验较好。
异步操作例子
为了避免短时间大量的数据库操作，就使用缓存机制，也就是消息队列。先将数据放入消息队列，然后再慢慢写入数据库。
引入消息队列机制，虽然可以保证用户请求的快速响应，但是并没有使得我数据迁移的时间变短（即80万条数据写入mysql需要1个小时，用了redis之后，还是需要1个小时，只是保证用户的请求的快速响应。用户输入完http url请求之后，就可以把浏览器关闭了，干别的去了。如果不用redis，浏览器不能关闭）。
同步就没有任何价值了吗？
银行的转账功能。
8.