Flow用起来是的确是简单,但里面的内容很多,主要原因是是要看实际不同的使用情况作搭配。JavaScript里面的原始数据类型都有支持,而在函数、对象与一些新的ES6中的类,在搭配使用时就会比较复杂,详细的情况就请到官网文档查看,以下只能提供一些简单的介绍说明。
Flow所定义的基本类型与 js 的基本数据类型类似,包括:
* `boolean`: 对应 js 的 Boolean 类型
* `number`: 对应 js 的 Number 类型
* `string`: 对应 js 的 String 类型
* `null`: 对应 js 的 null
* `void`: 对应 js 的 undefined
接下来,我们一个一个来看。
</br>
## Boolean类型
```
// @flow
function acceptsBoolean(value: boolean) {
// ...
}
acceptsBoolean(true); // 成功!
acceptsBoolean(false); // 成功!
acceptsBoolean("foo"); // 报错!
acceptsBoolean(Boolean("foo")); // 报错!
acceptsBoolean(!!("foo")); // 报错!
```
从上面还可以看出,在Flow中,默认并不会转换类型。如果你需要转换类型请使用显示或隐式转换。
</br>
## Number类型
```
// @flow
function acceptsNumber(value: number) {
// ...
}
acceptsNumber(42); // 成功!
acceptsNumber(3.14); // 成功!
acceptsNumber(NaN); // 成功!
acceptsNumber(Infinity); // 成功!
acceptsNumber("foo"); // 报错!
```
</br>
## String类型
```
// @flow
function acceptsString(value: string) {
// ...
}
acceptsString("foo"); // 成功!
acceptsString("3.14"); // 成功!
acceptsString(3.14); // 报错!
acceptsString([]); // 报错!
```
</br>
## Null类型和Void类型
```
// @flow
function acceptsNull(value: null) {
/* ... */
}
function acceptsUndefined(value: void) {
/* ... */
}
acceptsNull(null); // 成功!
acceptsNull(undefined); // 报错!
acceptsUndefined(null); // 报错!
acceptsUndefined(undefined); // 成功!
```