大前端学习笔记（二）Flow

强类型

• 语言层面上限制函数的实参类型与形参类型必须一致，不允许隐式类型转换。
• 有势是更早的暴露错误；代码更加智能编码更加准确；重构更加牢靠；减少不必要的类型判断。

弱类型

• 语言层面上不会限制实参与形参类型，允许隐式类型转换。

静态类型

• 一个变量声明时类型明确，声明过后类型不允许修改。

动态类型

• 在运行阶段明确变量类型，而且变量类型随时可以修改。变量没有类型，而变量中存放的值是有类型的

flow类型检查器

• Flow: 查询类型官网
• 第三方: 类型手册查询
• 类型推断

//类型注解
function sun (a:number,b:number){
	return a+b
}

flow-remove-types 移除类型注解

flow language support 开发工具插件

• 无需运行命令，直接在开发工具显示类型问题

flow原始类型

const a:string = 'string'
const b:number = Infinity // NaN // 100
const c:boolean = false // true
const d:null = null
const e:void = undefined
const f:symbol = Symbol()

flow数组类型

const arr1: Array<number> = [1,2,3,4]
const arr2: number[] = [1,2,3,4]
const arr3: [number,string] = [1,'aaa'] //元组

flow对象类型

const obj1 = {foo:string,bar:number} = {foo:'string',bar:12345}
const obj2 = {foo?:string,bar:number} = {bar:12345} //?表示可有可无
const obj3:{[string]:string} = {}  //动态键值只能是string
obj3.key1 = 'string'  

flow 函数类型

function foo (callback:(string,number) => void){
	callback('string',123)
}
foo((str,n) =>{
	console.log(str,n)
)

flow 特殊类型

• 字面量类型

//只能够存放自定义类型的值
 const a:'foo' = foo
 const type:'success'| 'warning'|'danger' = success //也叫或类型
 const b:string|number = 'string' // |123
 
 type StringOrNumber = string|number  //type关键字 声明一个或类型
 const b:StringOrNumber  = 'string' // |123  

• ？有可能

const gender:number? = 123 | undefined|null //?表示有可能是以上三种其中之一

flow 任意类型

• Mixed 可接收任意类型的值
• any 同上
• 俩者差异 Mixed属于强类型，而any是弱类型，相比Mixed，any不是很安全。

function passMixed(value:mixed):void{
	if(typeof value === 'string'){ //判断value传过来的值是什么类型
		value.substr(1)
	}
	if(typeof value ==='number'){
		value*value
	}
}
passMixed('string')
passMixed(123)