vue源码学习 --- flow学习

一. flow的作用

静态检测JavaScript类型,可以在编译阶段(说法不太准)识别出错误,规避运行时才显现的bug

二. 基本类型

// @flow

/**
 * JavaScript 基本类型在flow中使用
 */

/**
 * boolean
 * 如下例子中,只接受一个boolean的参数,一个到达acceptsBoolean函数不再需要转换为boolean的参数(因此不接受0,'str'等值)
 */
function acceptsBoolean(value: boolean) {
  // ...
}
acceptsBoolean(true);			// work
acceptsBoolean(false);		// work
// acceptsBoolean('foo');		// error
// acceptsBoolean(0);				// error
acceptsBoolean(Boolean(0)); // Works!
acceptsBoolean(!0);        // Works!
acceptsBoolean(!0);        // Works!

/**
 * number
 */
function acceptsNumber(value: number) {
  // ...
}
acceptsNumber(42);       // Works!
acceptsNumber(3.14);     // Works!
acceptsNumber(NaN);      // Works!
acceptsNumber(Infinity); // Works!
// acceptsNumber("123");    // Error!

/**
 * string
 * 同boolean中的js类型隐式转换,当到达acceptsString函数时,是字符串会被接受
 */
function acceptsString(value: string) {
  // ...
}
acceptsString("foo"); // Works!
// acceptsString(false); // Error!
acceptsString("foo" + 42); // Works!
// acceptsString("foo" + {}); // Error!

/**
 * null 和 void(void is undefined in javascript)
 */
function acceptsNull(value: null) {
  /* ... */
}
function acceptsUndefined(value: void) {
  /* ... */
}
acceptsNull(null);      		 // Works!
// acceptsNull(undefined);      // Error!
// acceptsNull(undefined);      		 // Error!
acceptsNull(null);      // Works!

/**
 * 可能是 null 和 void(undefined) 和 空值, (属性值前加?)
 */
function acceptsMaybeString(value: ?string) {
  // ...
}
acceptsMaybeString("bar");     // Works!
acceptsMaybeString(undefined); // Works!
acceptsMaybeString(null);      // Works!
acceptsMaybeString();          // Works!

/**
 * 对象属性前加?
 */
function acceptsObject(value: { foo?: string }) {
  // ...
}
acceptsObject({ foo: "bar" });     // Works!
acceptsObject({ foo: undefined }); // Works!
// acceptsObject({ foo: null });      // Error!
acceptsObject({});                 // Works!

function acceptsOptionalString(value?: string) {
  // ...
}
acceptsOptionalString("bar");     // Works!
acceptsOptionalString(undefined); // Works!
// acceptsOptionalString(null);      // Error!
acceptsOptionalString();          // Works!

/**
 * 默认值
 */
function acceptsOptionalString(value: string = "foo") {
  // ...
}
acceptsOptionalString("bar");     // Works!
acceptsOptionalString(undefined); // Works!
// acceptsOptionalString(null);      // Error!
acceptsOptionalString();          // Works!

/**
 * Symbol 不支持
 */