vue源码解读-Flow

版本基于2.5.17-beta.0
在阅读源码之前建议大家先了解下Flow
Flow 是 facebook 出品的 JavaScript 静态类型检查工具。Vue.js 的源码利用了 Flow 做了静态类型检查，所以了解 Flow 有助于我们阅读源码
这里简单的介绍下Flow
Flow 的工作方式
类型推断：通过变量的使用上下文来推断出变量类型，然后根据这些推断来检查类型。
类型注释：事先注释好我们期待的类型，Flow 会基于这些注释来判断。

类型推断

function split(str) {
    return str.split('')
}
split(11)

Flow 检查上述代码后会报错，因为函数 split 期待的参数是字符串，而我们输入了数字。

类型注释
添加类型注释可以提供更好更明确的检查依据

/*@flow*/
function test(x: number, y: number): number {
    return x + y
}
test('str', 0)

因为函数参数的期待类型为数字，而我们提供了字符串。flow会报错

flow中对数组，函数，类和对象都能添加类型注释
数组

/*@flow*/

var arr: Array<number> = [1, 2, 3]

arr.push('str')

类和对象

/*@flow*/

class Person {

constructor(name: string, age: string | number) {
this.name= name
this.age= age
this.sex= false
}}

var per: Person = new Person('xiaoli', 4)

var obj: { arr: Array<string>, per: Person} = {
arr: ['hello']
per: new Person('hello', 3)
}

想到数据类型大家当然忘不了 null， undefined
如果先让任意类型可以是 null 或者 undefined 则需要写成 ?T 的格式即可，注意T就是类型

/*@flow*/
var age: ?number = null
age可以为数字或者 null