• [TypeScript] Function Overloads in Typescript


    It's common in Javascript for functions to accept different argument types and to also return different types. In this lesson we learn how to 'teach' Typescript about these dynamic functions so that we can still benefit from the powerful static type analysis.

    const getTasks = (taskname: string, x: any) : any => {
        if(typeof x === 'function'){
            return {taskname, fn: x};
        }
    
        if(Array.isArray(x)){
            return {taskname, deps: x};
        }
    };
    
    const task1 = getTasks('taskname1', ['dep1', 'dep2']);
    const task2 = getTasks('taskname2', function(){});
    
    task1.fn(); // Runtime Error, fn not exists on task1
    task2.deps; // Runtime Error, deps not exists on task2

    In the code above, the IDE cannot help much during the compile time. 

    But if we use Function overloads, then IDE can help to check error:

    interface GroupTask {
        taskname:string
        deps:string[]
    }
    
    interface Task {
        taskname:string
        fn:Function
    }
    
    function getTasks(taskname:string, x:string[]):GroupTask
    function getTasks(taskname:string, x:Function):Task
    function getTasks(taskname:string, x:any):any {
        if (typeof x === 'function') {
            return {taskname, fn: x};
        }
    
        if (Array.isArray(x)) {
            return {taskname, deps: x};
        }
    }
    const task1 = getTasks('taskname1', ['dep1', 'dep2']);
    const task2 = getTasks('taskname2', function () {
    });
    
    task1.fn // Property 'fn' doesn't not exist on type 'GrouptTask'
    task2.deps // Property 'deps' doesn't not exist on type 'Task'
  • 相关阅读:
    单例模式
    C++继承-重载-多态-虚函数
    c++仿函数 functor
    常用排序算法实现与效率比较
    树的中序非递归遍历
    二叉树递归遍历
    队列的顺序存储框架
    栈的链式存储框架
    栈的顺序存储构架
    函数指针和回调函数
  • 原文地址:https://www.cnblogs.com/Answer1215/p/5592632.html
Copyright © 2020-2023  润新知