5分钟学会typescript(后两分半...)

69 阅读2分钟

tuple 元祖类型

  • 声明一个已知长度的数组,每个数组元素都要给定一个数据类型,并且以后都【无法更改】这些给死的祖宗数据类型
    let a: [number, string, [any,any]] = [1, 'string', [2,'2']]
    a = [2, 'newString', [false,true]]
    // a = [1,1,1]      报错
    console.log(a);    // [2, 'newString', Array(2)]

enum 枚举类型

作用:能给常量赋一个好听的名字,简单了解即可

    enum peopleMessige {
        NAME = '张三',
        AGE = 18,
        SEX = '男'
    }
    const myName: peopleMessige = peopleMessige.NAME;
    console.log(myName);    // 张三

void

用途:用来规则一个函数必须无返回值

    // 设置后即不能在该函数中return
    function log(): void {
        console.log(1);
        // return 1  有返回值就好报红字
    }
    log()

函数

必选参数

    // function 函数名(参数:参数数据类型)函数返回值的数据类型{}
    function add(a: number, b: number): number {
        return a + b  // 返回也是数字
    }

默认参数

    // 默认参数
    function add(a:number,b:number = 1) {
        return a+b
    }

重载函数

作用:可以让函数兼容多个规则

    function add(): void 
    function add(a: number): number;
    function add(a: number, b: number): number;
    function add(...sum: any[]) {
        if (sum.length == 0) {
            console.log('0');
        }
        if (sum.length == 1) {
           console.log('1');
           return sum[0]+1
        }
        else {
           console.log('2');
           return  sum[0]+sum[1]
        }
    }
    add(1,1)    // 2    
    add(1)      // 1 
    // // add('1','2')     非法的

class 类

新增3个类的修饰符

  •  公有属性: public
    
  •  保护属性: protected
    
  •  私有属性:private
    
    class Father {
        // 属性名:数据类型 = 初始值
        public age: number;                // 设置公有属性
        name: string;                      // 此处省略了public 依旧是个公有属性
        protected money:number = 1000      // 设置保护属性
        private wifi:string = '李四'       // 设置私有属性
        constructor(name: string, age: number) {
            this.name = name
            this.age = age
        }
        say(){
            console.log(`我的钱${this.money}`);
        }
        sayWif(){
            console.log(this.wifi);
            // 只有Father中能用【自己的私有属性】
        }
    }

    class Son extends Father{
        getMoney(){
            console.log(this.money);
            // 父子都能用money属性
        }
    }

    let fa = new Father('王五', 18);
    let son = new Son('王五儿子',9)
    console.log(fa);    // { name: '王五', age: 18 }
    son.say()           // 我的钱1000
    son.getMoney()      // 1000
    console.log(son);   // { money: 1000, name: '王五儿子', age: 9 }

    // console.log(son.money);  报错 由于设置了protected 受保护
    son.sayWif()        // 李四  只是调用方法  没有访问

抽象类

作用:常用于写一些【基类】 子类在重新对基类进行扩展

    // 一旦声明了是抽象类 就【无法直接实例化】
    abstract class Animal {
        name: string;
        constructor(n: string) {
            this.name = n
        }
        abstract eat(): any;
        /* 
         声明一个抽象方法:
         父类不负责实现,只负责声明
         所用子类来实现该方法,
         子类有不同的表现
        */
    }

    class Dog extends Animal {
        foot: string;
        constructor(myName: string, foot: string) {
            super(myName)
            this.foot = foot
        }
        eat() {
            console.log(`${this.name}正在吃${this.foot}`);
        }
    }
    // const animal = new Animal('狗')  !!报错
    const dog = new Dog('小黑','饭')
    dog.eat()   //小黑正在吃饭

接口 (可将其看成一个规则制定员,可自定义数据类型的规则)

属性类接口

    interface obj {
        name: string;
        age: number
    }
    // 必须要遵循接口的规则
    function people(peo: obj) {
        console.log(peo.name, peo.age);
    }

函数类型接口

    interface fn {
        //定义函数的入参数据类型及返回值类型
        (key: string, value: string): void
    }
    // 遵循接口函数的规则  否则报错
    const myFn: fn = function (a, b) {
        console.log(a + b);
    }
    myFn('1','2')   // 12

【ps:此文章能带你快速入门typescript,更多玩法请自行查资料~】