typescript介绍_文件的三大属性

TypeScript是微软开发的一个开源的编程语言，通过在JavaScript的基础上添加静态类型定义构建而成。

常用操作

类型推断：TypeScript会根据变量存放的初始值来进行变量类型限定

类型注解：在书写变量的时候通过（:）为变量进行类型的限定

let str : string let str : string = '123' let arr1: number[] = [1, 2, 3] let arr2: Array<string> = ['a', 'b', 'c'] 

类型断言：用来强制转换数据类型。 假设有一个JSON对象，它是一个字符串数组，但是TypeScript默认将其识别为any[]或unknown[]。这时可以使用类型断言将其强行转换为string[]：

const json = JSON.parse(someJsonString); // 假设这是一个JSON字符串 const stringArray = json as string[]; // 使用as关键字进行类型断言 // 或者 const stringArray = json as string[]; // 使用尖括号进行类型断言 

但是，如果类型断言不正确，这可能会在运行时导致错误。

基础类型和联合类型

基础类型： string、number、Boolean、null、undefined 联合类型：有多种类型可能时，通过竖线来分配多个类型，也可以用来做特定值的限定

let value : string | null = '123' 

元组

元组类似于数组，但限定了可存储的数据个数 限定了数组中每个元素的类型，其中？代表可选，即数组中可以只包含两个值，第三个值非必填(number | undefined)。

let t1: [number, string, number?] 

枚举enum

枚举是一个键值对的形式，可以看做是JavaScript中的json对象一样。枚举成员一但定义就不可改变了。

数字枚举

• 数字枚举可以双向映射，即键值一一对应。
• 只要定义了枚举对象，默认不赋值，那么当前枚举对象中成员的值从0开始依次递增。
• 枚举对象成员递增只会看当前值的前一个枚举成员是否有值，有值的话后面依次跟着递增1。跟第一个枚举成员值无关

对下面的枚举值,等价为 MyEnum[MyEnum["A"] = 0] = "A";

即 MyEnum.A = 0 => MyEnum[0] = A

enum MyEnum { A, B, C } 

上面的值是A 0、B 1、C 2。

enum device { phone = 2, notebook = 1, desktop } console.log(device.phone) // 2 console.log(device[2]) // desktop 

上面代码中，device.phone = 2 ，然后我们使用反向这种方式访问device[2]却是desktop。这是因为默认我们给phone赋值为2，然后又给notebook赋值为1，这时desktop跟着上一个枚举成员（notebook）值去递增，所以这时2已经被替换为desktop了。(ts不会检查是否有重复的值。)

字符串枚举

字符串枚举没有递增的，也没有反向映射，字符串枚举如果不赋值就会报错

enum device { phone = "1", notebook = "2", desktop = "3" } 

聊聊TypeScript中枚举对象(Enum)

函数的返回值和void类型

void类型: 常用于函数的返回值，表示没有任何类型,通常用于函数没有返回值的情况。

//返回string类型,如果无需返回值，返回值规定为void function myFn(a = 10, b: string, c?: boolean, ...rest: number[]): string { return a + b + c } const F = myFn(20, 'A', undefined, 1, 2, 3) 

接口

interface 定义了一个契约，规定了对象应该具有哪些属性以及这些属性的数据类型。用于定义对象的形状和结构，可以定义属性、方法等，但不涉及具体的实现。主要用于类型检查。

interface Obj { name: string, age: number } const obj: Obj = { name: 'A', age: 18 } 

type类型别名

type User = string | number let a: User = 'a' 

泛型

支持类型推断，如果引用时不规定<>，默认以第一位参数类型为规定

//t是占位变量，写什么都行 function myFn<T>(a: T, b: T): T[] { return [a, b] } myFn<Number>(1, 2) 

函数重载

实现一个函数根据参数的类型不同以达到不同操作

function hello(value: number | string): string { if (typeof value === 'string') { return 'my name is' + value } else if (typeof value === 'number') { return 'I am' + value + 'years old' } else { return '类型错误' } } 

接口继承

其实就是定义了一个名为parent的新类型，并对里面的值做了约束

interface Parent{    prop1:string    prop2:number } //可以实现类型的继承,使用extends关键字  interface Child extends Parent{ prop3:string } const myObj:Child = { prop1:'a',    prop2:1,    prop3:'bb'//可以看到子类型/接口，不止继承了父类型，还有自己的方法  } 

类的修饰符

可选属性 属性默认值 私有属性 受保护属性 静态成员 只读aaa?:stringbbb = 100 privateprotectedstaticreadonly

class Article{   //设置属性   title:string（默认是public）   content:string   aaa?:string//？代表可选属性   bbb = 100 //属性默认值（ts自动进行类型推断）   public x = 123 //public,属性可以从外部调用   private y = 456 //私有属性,只能在类里面访问，外面获取不到（子类也不行）   protected z = 789 //受保护属性，只能在类中以及其子类里面使用，外界获取不到   static author = 'Mio_Huang'//静态属性，只将属性设置给类本身，而不是设置给类的实例   private static readonly kkk = 1 //类修饰符可以联合使用（static只能放在最后）属性只读不能修改   //初始化构造函数   constructor(title:string,content:string){     this.title = title     this.content = content//如果不设置初始属性，会报错：类型article上不存在属性content  } } const a = new Article('标题','内容') console.log(a.author)//输出public、private、protected属性都可以，唯独输出static是undefined，Article.static才能输出 class B extends Article{   //继承要在构造函数体上标记参数类型   constructor(title:string,content:string){ //子类继承父类以后，需要在子类的方法或构造器中使用super，表示调用父类的属性或方法。。     super(title,content) //私有属性和静态属性都不会被继承  } } 

存取器属性

存，会触发get方法，取，会触发set方法

class User{ //对私有属性前缀_以便查找   private _password: string = ''   get password(): string{     return '*'//读取时，只会获得这个值  }   set password(newPass:string){     this._password = newPass  } } const u = new User() console.log(u.password)//读，触发get u.password = ''//取，触发set 

抽象类

abstract 作为子类基类使用，用来规范格式。 抽象类里面可以有抽象的属性，方法，存取器。也可以有非抽象的属性

abstract class Animal{   //name:string = '123' //普通属性   abstract name:string //抽象类不需要初始化表达式或者明确赋值（仅代表必须实现该属性）   abstract maskSound(): void //抽象方法可以不返回   callMe():void{ //普通方法     console.log('Mio_huang')  } } class Cat extends Animal{   //在实例化抽象类时，抽象对象缺一不可，缺一个就会报错   //因为在子类继承的时候，如果不给抽象类的抽象方法赋值内容，他就是空空如也   name: string = '小猫'   maskSound():void{     console.log('Miao~')  } } 

类实现接口 可接入多个接口

通过interface来定义类实现应遵循的规则：使用implements关键字 好处是implements可以后面跟多个interface，用逗号隔开。优点是一个对象不可继承自多个类，但是这个可以补齐这个遗憾

interface Animal{   name:string   get sound():string   makeSound():void } interface B{ age: number } class Dog implements Animal,B{   //值得注意，这个类必须声明上述interface的全部属性，否则会报错   name:string = 'dog' age:number = 6   get sound(){     return '狗叫'  }   makeSound():void{  } } 

类与泛型结合 泛型类

class MyClass<T>{   public value: T   constructor (value: T){     this.value = value  }   do(input: T): T{     console.log('处理数据'，this.value) return input  } } const myStr = new MyClass<string> ('hello') myStr.do('abc') 参数与返回值必须与设置一致