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