zoukankan      html  css  js  c++  java
  • [TypeScript] Generic Functions, class, Type Inference and Generics

    Generic Fucntion:

    For example we have a set of data and an function:

    interface HasName {
        name: string;
    }
    
    const heros: HasName[] = [
        {name: 'Jno'},
        {name: 'Miw'},
        {name: 'Ggr'},
        {name: 'Gew'},
        {name: 'Wfe'}
    ];
    
    function cloneArray(ary: any[]): any[] {
        return ary.slice(0);
    }
    
    const clones = cloneArray(heros);

    When we check the 'clones' type, you can see it is 'any[]'.

    To add more type information we can change the function:

    function cloneArray<T>(ary: T[]): T[] {
        return ary.slice(0);
    }

    Now we get 'clones' type as 'HasName[]'.

    Generic Class:

    class SuperCharacter {
        constructor(public name: string) {
    
        }
    }
    
    class Hero extends SuperCharacter {
    
    }
    
    class SuperTeam {
        constructor(public members: SuperCharacter[],
            public leader: SuperCharacter
        ) {
    
        }
    }
    
    const captainAmerica = new Hero('Captain America');
    const thor = new Hero('Thor');
    const ironMan = new Hero('IronMan');
    
    const avengers = new SuperTeam(
        [captainAmerica, thor, ironMan],
        captainAmerica
    );
    
    const members = avengers.members;

    If we check 'avengers' type is 'SuperTeam'. 'memebers' type is 'SuperCharacter[]'.

    To add more information to the types we can do:

    class SuperTeam<T> {
        constructor(public members: T[],
            public leader: T
        ) {
    
        }
    }

    Now the 'avengers' type is 'SuperTeam<Hero>' and 'members' type is 'Hero[]'.

    Now, let's say we have another class:

    class Villain extends SuperCharacter {
    
    }

    Have some members.

    const luthor = new Villain('Luthor');
    const bizarro = new Villain('Bizarro');
    const captainCold = new Villain('Captain Cold');
    
    const megaCrossoverTeam = new SuperTeam([
        captainAmerica, thor, ironMan, luthor,
        bizarro, captainCold
    ], captainAmerica);

    'megaCrossoverTeam' is type of 'SuperTeam<Hero | Villain>'.

    If we want to add some restrictions to the class, we can do:

    class SuperTeam<T extends SuperCharacter> {
        constructor(public members: T[],
            public leader: T
        ) {
    
        }
    }

    Then the example below will throw error:

    const avengers = new SuperTeam(
        [0, 1, 2],
        0
    );

    Because the type is number.

  • 相关阅读:
    对于进程的理解
    反汇编引擎实现——流程分析
    window异常处理——except_handler4以及栈展开分析
    对于硬盘驱动的理解
    对文件系统的理解
    移动端适配flexible.js
    vue学习(5)-评论功能(利用父组件的方法)
    vue学习(4)-组件的创建,父子组件传值,$refs
    vue学习(3)-增删改查
    vue学习(2)-过滤器
  • 原文地址:https://www.cnblogs.com/Answer1215/p/8443574.html
Copyright © 2011-2022 走看看