我要评论函数重载
javascript并没有提供函数重载
typescript提供的函数重载，仅仅用作提示效果，实现还需手动
函数重载简单点说就是，同一个函数的不同实现方式，根据传入的参数的类型或者长度，决定最终调用哪一个实现
最终效果,typescript的类型校验也会变化
code
创建函数重载函数
根据参数的类型，调用不同的实现，如果没有对应的实现，则报错。
export function createoverload () {
const map: map<string, function> = new map();
const overload = ( ...args: any[] ) => {
const key = args.map( it => typeof it ).join( " " );
const fn = map.get( key );
if ( !fn ) throw new error( "no overload function matched" );
return fn( args );
};
overload.addimpl = function ( args: array<"number" | "string" | "boolean" | "function" | "object" | "symbol" | "undefined" | "bigint">, fn: function ) {
if ( typeof fn !== "function" ) throw new error( "last argument must be a function" );
const key = args.join( " " );
map.set( key, fn );
};
return overload;
}
使用
const overload = createoverload()
overload.addimpl(["string","number"],()=>{
console.log("string number")
})
overload.addimpl(["number","string"],()=>{
console.log("number string")
})
overload("yang jun",18) // console.log("string number")
overload(18,"yang jun") // console.log("number string")
封装一层，因为上述使用没有代码提示，离了代码提示活不下去了
创建抽象类。
在js中创建抽象类方法，在construct中执行 if( new.target === overload ) throw new error("不允许直接new")
在下述实现中，转为 es6 类实现，新增了重载函数的映射表，用于继承类的多个函数的重载。
export abstract class overload {
private overloads = new map<string, function>();
protected addimpl ( name: string, args: array<"string" | "number" | "bigint" | "boolean" | "symbol" | "undefined" | "object" | "function">, fn: function ) {
let overload = null;
if ( this.overloads.has( name ) ) {
overload = this.overloads.get( name );
} else {
overload = createoverload();
this.overloads.set( name, overload );
}
overload.addimpl( args, fn );
};
protected getoverload ( name: string ): function | undefined {
if ( this.overloads.has( name ) ) return this.overloads.get( name );
throw new error( "no overload matched" );
}
}
使用
非常舒服，再也不用自己在函数中写一串的 if 了
import { overload } from "./utils";
class test extends overload {
constructor () {
super();
this.addimpl( "getinfo", [ "boolean", "number", "string" ], () => {
console.log( "boolean", "number", "string" );
} );
this.addimpl( "getinfo", [ "number", "string", "boolean" ], () => {
console.log( "number", "string", "boolean" );
} );
this.addimpl( "getinfo", [ "string", "number", "boolean" ], () => {
console.log( "string", "number", "boolean" );
} );
}
getinfo ( age: number, name: string, ishandsome: boolean ): object;
getinfo ( ishandsome: boolean, age: number, name: string ): object;
getinfo ( name: string, age: number, ishandsome: boolean ): object;
getinfo (): object {
const overload = this.getoverload( "getinfo" );
return overload( ...arguments );
}
getname ( name: string ) {
}
}
const test = new test();
test.getinfo( 18, "yang jun", true ); // console.log( "number", "string", "boolean" );
test.getinfo( "yang jun", 18, true ); // console.log( "string", "number", "boolean" );
test.getinfo( true, 18, "yang jun" ); // console.log( "boolean", "number", "string" );
以上就是typescript 实现函数重载的方式的详细内容，更多关于typescript函数重载的资料请关注代码网其它相关文章！
发表评论