Vue实例挂载的实现

Vue中我们通过\$mount实例方法去挂载vm的，\$mount方法在多个文件中都有定义，如src/platform/web/entry-runtime-with-compiler.js、src/platform/web/runtime/index.js、src/platform/weex/runtime/index.js因为\$mount这个方法的实现是和平台、构建方式都相关的。接下来我们重点分析compiler版本的\$mount实现，因为抛开webpack的vue-loader,我们在纯前端浏览器环境分析Vue的工作原理，有助于我们对原理理解的深入。

JavaScript之闭包

什么是闭包？

先看一段代码：

1
2
3
4
5
6
7
8
9
10

function a() {
	var n = 0;
	function inc() {
		n++;
		console.log(n);
	}
	inc();
	inc();
}
a();  //控制台输出1，再输出2

new Vue 发生了什么

从入口代码开始分析，我们来分析new Vue背后发生了哪些事情。我们都知道，new关键字在JavaScript语言中代表实例化是一个对象，而Vue实际上是一个类，类在JavaScript中是Function来实现的，来看一下源码，在src/core/instance/index.js中。

TabIndex属性

TabIndex = ‘-1’与TabIndex = ‘0’、任意数字

html中的tabIndex属性可以设置键盘中的TAB键在控件中的移动顺序，即焦点的顺序。

基本作用

想要深入了解call()和apply() 这两个方法，那么必须要先知道他们的基本作用：

改变对象的执行上下文

什么是执行上下文？

我们在写一个方法的时候，总是会用到一个关键字this，而this的指向就是我们这里所说的执行上下文（执行环境）

Object.defineProperty()

MDN上的解释是Object.defineProperty()会直接在对象上定义一个新的属性，或者修改一个对象的现有属性，并返回这个对象。

IE6常见兼容问题

1.margin加倍问题

解决方法：设置为float的div在IE下设置的margin会加倍，这是一个IE6都存在的bug。解决方案是在这个div里面加上display：inline；

2.子集中有设置position，则父级overflow失效

什么是BFC?

w3c规范中的BFC定义

浮动元素和绝对定位元素，非块级盒子的块级容器（如：inline-block，table-cells,和table-captions），以及overflow值不为“visiable”的块级盒子，都会为他们创建新的BFC（块级格式上下文）。

在BFC中，盒子从顶端开始垂直地一个接一个的排列，两个盒子之间的垂直的间隙是由他们的margin值所决定的。在一个BFC中，两个相邻的块级盒子的垂直外边距会产生折叠。