TypeScript 简单理解

公众号有更多知识哦

 ***给博主点赞，送一套Webpack打包配置，最下方有介绍***

TypeScript VS prop-types

1.TypeScript是静态类型检查，prop-types是在运行时进行检查。
前者会提示你类型有误，但在浏览器里是可以正常运行的。而
prop-types是在浏览器里就会给出提示。
2.PropTypes是组件接收prop的约束，而typescript类型约束主要是参数传递以及返回值的约束，侧重点不一样

1.基础类型

boolean
number
string
any[]  number[]  string[] {另一种写法 Array[any] }
void 
Object

2.断言

let strlength:number= (somevalue as string).length
目的：防止somevalue由于类型错误导致页面报错

3.接口类型

interface Label{
   label:string
}

4.通过extends 来继承类
5.默认参数

（1）.必填的放前面；
（2）.选填加问号

6.多参数类型定义

function buildName(firstName: string,...restOfName:any[]){

}  

7.泛型

泛型就是解决 类 接口 方法的复用性、以及对不特定数据类型的支持(类型校验)
泛型：软件工程中，我们不仅要创建一致的定义良好的API，同时也要考虑可重用性。组件不仅能够支持当前的数据类型，同时也能支持未来的数据类型，这在创建大型系统时为你提供了十分灵活的功能。
在像C#和Java这样的语言中，可以使用泛型来创建可重用的组件，一个组件可以支持多种类型的数据。 这样用户就可以以自己的数据类型来使用组件。

例子：

function getData<T>(value:T):T{
      return value
}

8.兼容性

变量赋值的兼容性，赋值之后应该对旧值的属性要求有没有改变才允许赋值  

9.交叉类型

就是说这个类型的对象同时拥有了这三种类型的成员

10.联合类型

padding: any  转成  padding: string | number  
但是当访问联合类型时，只能访问共有成员，避免出错，需要类型断言

11.迭代器和生成器

let pets = new Set(["Cat", "Dog", "Hamster"]);
pets["species"] = "mammals";
{...pets}   //{species: "mammals"}
[...pets]   // ["Cat", "Dog", "Hamster"]
很无敌，对象和数组都放在一起了

12.模块

export和import都可以导出重命名    
ts官方文档如是说：TypeScript和ECMAScript2015一样，任何包含顶级import或者export的文件都被当成一个模块。其实，也不一定是顶级。以上就是对什么叫模块的简单认知。

13.声明合并

interface Box {
    height: number;
    width: number;
}

interface Box {
    scale: number;
}

let box: Box = {height: 5, width: 6, scale: 10};

需要的联系博主