typescript知识基础
typescript 定义
type类型+ES6
javascript的超级
包含ES6
静态类型语言
类型检查,接口,oop非常完善
可以编译成 javascript 在浏览器运行
安装
npm i typescript -g
tsc 常用命令
tsc --init 初始化项目
tsc ./src/xxx.ts 编译某个文件
tsc -w 检测变化并编译
tsconfig.json
{"compilerOptions":{
"outDir":"./dist", //输出文件夹
"rootDir":"./src" //源文件夹
}}
接口
在 TypeScript 中,我们使用接口(Interfaces)来定义对象的类型。
什么是接口
在面向对象语言中,接口(Interfaces)是一个很重要的概念,它是对行为的抽象,而具体如何行动需要由类(classes)去实现(implement)。 TypeScript 中的接口是一个非常灵活的概念,除了可用于对类的一部分行为进行抽象以外,也常用于对「对象的形状(Shape)」进行描述。
我们定义了一个接口 Person,接着定义了一个变量 tom,它的类型是 Person。这样,我们就约束了 tom 的形状必须和接口 Person 一致。 接口一般首字母大写。有的编程语言中会建议接口的名称加上 I 前缀。 定义的变量比接口少了一些属性是不允许的:
常见类型
boolean
布尔
let b:boolean = true;
number
数字
let num:number = 18;
string
字符串
let str:string = "I love China"
数组
let arr1:number[] = [1,3,5]
let arr2:Array<string> = ["I","love"];
let arr3:any = [123,"abc"]
对象
Object
let obj :Object= {name:"mumu",age:18}
任意
any
let notSure:any ="I am";
没有返回 void
function fun():void{}
null类型只能是null
let n:null = null;
undefined没有定义
let u:undefined = undefined ;
面向对象
可选属性
有时我们希望不要完全匹配一个形状,那么可以用可选属性:
任意属性
有时候我们希望一个接口允许有任意的属性,可以使用如下方式:
只读属性
有时候我们希望对象中的一些字段只能在创建的时候被赋值,那么可以用 readonly 定义只读属性:
函数
函数返回值
function fun():void{}
无返回值
function fun():string{}
返回字符串类型
[一旦定义了返回类,在函数内部必须要返回该类型]
参数
参数指定类型
function add(a:number,b:number):number{xxxxx}
参数可选
function add(a:number,b?:number):number{xxxxx}
参数默认值
function add(a:number,b:number=10):number{xxxxx}
箭头函数
let add(a:number,b:number):number=>a+b