vue源碼分析——認識flow

Flow是facebook出品的JS類型檢查工具，他能夠作類型檢查，所謂的類型檢查就是在編譯期間今早發現由類型錯誤引發的bug，又不影響代碼運行，使編寫JS具備編寫JAVA等強elixir語言相近的體驗，因此vue使用flow作了靜態檢查。

Flow一般類型檢查分紅兩種：

1.類型判斷

2.類型註釋

1、類型判斷是經過變量的使用上下文來推斷出變量類型，而後根據這些判斷來檢查類型（相對於在那寫了個If），他不須要任何修改便可進行類型檢查。

　　例子：

　　

/*@flow*/''

function aplit(str){

    return str.split('');

}

split(11);　　　　//這個會報錯由於函數split期待的參數是字符串，咱們輸入了數字

2、類型註釋：在某種條件下添加類型註釋能夠更高明確的檢查依據。

　　例子：

　　

/*@flow*/

function add(x:number,y:number):number{

    return x+y

}

add('hello',11);　　//報錯由於hello是字符串

 

常見的類型註釋

數組：

　　例子

/*@flow*/

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

arr.push('hello');　　　　//報錯

 

類和對象

　　例子

/*@flow*/

class Bar{

    x:string;

    y:string | number;

    z:boolean;

　　constructor(x:string,y:string|number){
　　　　this.x = x;
　　　　this.y = y;
　　　　this.z = false
　　}
}

var bar:Bar = new Bar('hellow',4)

var obj:{ a:string, b:number, c:Array<string>,d:Bar} = {
　　
　　a:'hello',
　　b:11,
　　c:['hello','world'],
　　d:new Bar('hello',3);
}

Null:若想任意類型能夠爲null或者是undefined，那麼如例子所示就好了

　　例子

　　

/*@flow*/

var foo:?string = null

若是想了解更多，那麼能夠訪問flow官方文檔。