Typescript系列二（01）-常用类型

上周的时候，我们一起学习了Typescript的一些知识，但是有的小伙伴说，内容有点复杂，所以本章节通过非常简单代码展示的形式来从头到尾学习Typescript，从简易到深入理解Typescript，一共分为两个章节，大致30篇文章,以下是本次章节的学习清单，记得关注公众号和鬼哥一起学习

第一章节

• Any Types 任何类型
• Array Types 数组类型
• Class Types 类别类型
• Literal Types 文字类型
• Comment Types 注释类型
• Intersection Types 交叉类型
• Maybe Types 缺省类型
• Mixed Types 混合类型
• Interface Types 接口类型
• Module Types 模块类型
• Object Types 对象类型
• Primitive Types 原始类型
• Tuple Types 元组类型
• Type Aliases 类型别名
• Type Annotations 类型注释
• Type Casting Expressions 类型转换表达式
• Typeof Types 字体类型
• Union Types 工会类型
• Variable Types 变量类型

第二章节

• Utility Types 实用类型

开始

Any Types 任何类型

类型any可分配给每种类型,所以白话就是任意类型

使用如下:

function funA(obj: any) {
  let info: number = obj.foo;
}

function funB(one: any, two: any): number {
  return one + two;
}

const userInfo:any = {userName:'鬼鬼',userAge:18}

Array Types 数组类型

存储于多种类型的集合，使用 Array < Type > Type，其中 Type 是数组中元素的类型

使用如下:

const arr1: Array<number> = [1, 2, 3];

const arr2: Array<boolean> = [true, false, true];


interface User {
    userName:string,
    userAge:number
}
const arr3: Array<User> = [{
    userName:'鬼鬼',
    userAge:18
}];

Class Types 类别类别

Class类型

使用如下:

class UserInfo {
    public userName: string;
    public userAge: number;
    constructor(userName:string,userAge:number){
        this.userAge=userAge;
        this.userName=userName;
    }
  }

const userInfo: UserInfo = new UserInfo('鬼鬼',18);




class User {
  public userName: string;
  public userAge: number;
}

class UserInfo extends User {
  constructor(userName: string, userAge: number) {
    super();
    this.userAge = userAge;
    this.userName = userName;
  }
}

const userInfo: UserInfo = new UserInfo("鬼鬼", 18);
const user: UserInfo = new User();

Literal Types 文字类型

直接使用文字当做类型。然后这个类型的变量就只能为这些值

使用如下:

type colors="success" | "warning" | "danger"

function getColor(name:colors) {
    switch (name) {
      case "success" : return "green";
      case "warning" : return "yellow";
      case "danger"  : return "red";
    }
}

getColor("success");

❤️ 看完三件事