在TypeScript中,我可以将函数的参数声明为Function类型。是否存在一种“类型安全”的方式来解决这个问题?例如,考虑一下:
class Foo {
save(callback: Function) : void {
//Do the save
var result : number = 42; //We get a number from the save operation
//Can I at compile-time ensure the callback accepts a single parameter of type number somehow?
callback(result);
}
}
var foo = new Foo();
var callback = (result: string) : void => {
alert(result);
}
foo.save(callback);
保存回调不是类型安全的,我给它一个回调函数,其中函数的参数是一个字符串,但我传递一个数字,并编译没有错误。我可以在保存类型安全功能时创建结果参数吗?
TL; DR版本:TypeScript中是否有等效的.NET委托?
答案 0 :(得分:646)
不确定
class Foo {
save(callback: (n: number) => any) : void {
callback(42);
}
}
var foo = new Foo();
var strCallback = (result: string) : void => {
alert(result);
}
var numCallback = (result: number) : void => {
alert(result.toString());
}
foo.save(strCallback); // not OK
foo.save(numCallback); // OK
如果需要,您可以定义一个类型来封装它:
type NumberCallback = (n: number) => any;
class Foo {
// Equivalent
save(callback: NumberCallback) : void {
callback(42);
}
}
答案 1 :(得分:77)
以下是一些常见.NET代理的TypeScript等价物:
interface Action<T>
{
(item: T): void;
}
interface Func<T,TResult>
{
(item: T): TResult;
}
答案 2 :(得分:11)
我意识到这篇文章已经过时了,但是有一个更紧凑的方法,与所提出的方法略有不同,但可能是一个非常有用的选择。实际上,在调用方法时,您可以在线声明函数(在这种情况下,Foo
的{{1}})。它看起来像这样:
save()
class Foo {
save(callback: (n: number) => any) : void {
callback(42)
}
multipleCallbacks(firstCallback: (s: string) => void, secondCallback: (b: boolean) => boolean): void {
firstCallback("hello world")
let result: boolean = secondCallback(true)
console.log("Resulting boolean: " + result)
}
}
var foo = new Foo()
// Single callback example.
// Just like with @RyanCavanaugh's approach, ensure the parameter(s) and return
// types match the declared types above in the `save()` method definition.
foo.save((newNumber: number) => {
console.log("Some number: " + newNumber)
// This is optional, since "any" is the declared return type.
return newNumber
})
// Multiple callbacks example.
// Each call is on a separate line for clarity.
// Note that `firstCallback()` has a void return type, while the second is boolean.
foo.multipleCallbacks(
(s: string) => {
console.log("Some string: " + s)
},
(b: boolean) => {
console.log("Some boolean: " + b)
let result = b && false
return result
}
)
方法对于可能成功或失败的网络调用等非常有用。再次假设一个网络调用示例,当调用multipleCallback()
时,可以在一个位置定义成功和失败的行为,这有助于更加清晰地显示未来的代码读取器。
一般来说,根据我的经验,这种方法有助于使整体更简洁,更简洁,更清晰。
祝你好运!答案 3 :(得分:9)
type FunctionName = (n: inputType) => any;
class ClassName {
save(callback: FunctionName) : void {
callback(data);
}
}
这肯定与功能编程范例一致。
答案 4 :(得分:0)
如果您先定义函数类型,那么它将看起来像
type Callback = (n: number) => void;
class Foo {
save(callback: Callback) : void {
callback(42);
}
}
var foo = new Foo();
var stringCallback = (result: string) : void => {
console.log(result);
}
var numberCallback = (result: number) : void => {
console.log(result);
}
foo.save(stringCallback); //--will be showing error
foo.save(numberCallback);
如果没有使用普通属性语法的函数类型,则为:
class Foo {
save(callback: (n: number) => void) : void {
callback(42);
}
}
var foo = new Foo();
var stringCallback = (result: string) : void => {
console.log(result);
}
var numberCallback = (result: number) : void => {
console.log(result);
}
foo.save(stringCallback); //--will be showing error
foo.save(numberCallback);
如果要使用像c#泛型委托这样的接口函数,它将是:
interface CallBackFunc<T, U>
{
(input:T): U;
};
class Foo {
save(callback: CallBackFunc<number,void>) : void {
callback(42);
}
}
var foo = new Foo();
var stringCallback = (result: string) : void => {
console.log(result);
}
var numberCallback = (result: number) : void => {
console.log(result);
}
let strCBObj:CallBackFunc<string,void> = stringCallback;
let numberCBObj:CallBackFunc<number,void> = numberCallback;
foo.save(strCBObj); //--will be showing error
foo.save(numberCBObj);
答案 5 :(得分:0)
在TS中,我们可以通过以下方式键入函数:
功能类型/签名
这用于函数/方法的实际实现,它具有以下语法:
(arg1: Arg1type, arg2: Arg2type) : ReturnType
示例:
function add(x: number, y: number): number {
return x + y;
}
class Date {
setTime(time: number): number {
// ...
}
}
功能类型文字
函数类型文字是声明函数类型的另一种方法。它们通常应用于高阶函数的函数签名中。高阶函数是接受函数作为参数或返回函数的函数。它具有以下语法:
(arg1: Arg1type, arg2: Arg2type) => ReturnType
示例:
type FunctionType1 = (x: string, y: number) => number;
class Foo {
save(callback: (str: string) => void) {
// ...
}
doStuff(callback: FunctionType1) {
// ...
}
}
答案 6 :(得分:0)
除了别人所说的,一个常见的问题是声明重载的同一函数的类型。典型的情况是EventEmitter on()方法,该方法将接受多种侦听器。当使用redux动作时,可能会发生类似的情况-在那里,您将动作类型用作文字来标记重载;对于EventEmitters,则使用事件名称 文字类型:
interface MyEmitter extends EventEmitter {
on(name:'click', l: ClickListener):void
on(name:'move', l: MoveListener):void
on(name:'die', l: DieListener):void
//and a generic one
on(name:string, l:(...a:any[])=>any):void
}
type ClickListener = (e:ClickEvent)=>void
type MoveListener = (e:MoveEvent)=>void
... etc
// will type check the correct listener when writing something like:
myEmitter.on('click', e=>...<--- autocompletion
答案 7 :(得分:0)
因为您不能轻易地将函数定义和另一种数据类型结合在一起,所以我发现使用这些类型对强类型化它们很有用。根据Drew的回答。
type Func<TArgs extends any[], TResult> = (...args: TArgs) => TResult;
//Syntax sugar
type Action<TArgs extends any[]> = Func<TArgs, undefined>;
现在,您可以强烈键入每个参数和返回类型!这是一个比上面参数更多的示例。
save(callback: Func<[string, Object, boolean], number>): number
{
let str = "";
let obj = {};
let bool = true;
let result: number = callback(str, obj, bool);
return result;
}
现在,您可以编写联合类型,例如对象或返回对象的函数,而无需创建可能需要导出或使用的全新类型。
//THIS DOESN'T WORK
let myVar1: boolean | (parameters: object) => boolean;
//This works, but requires a type be defined each time
type myBoolFunc = (parameters: object) => boolean;
let myVar1: boolean | myBoolFunc;
//This works, with a generic type that can be used anywhere
let myVar2: boolean | Func<[object], boolean>;
答案 8 :(得分:0)
function callbackTesting(callbacks: {onYes: (data: any) => void,onNo: (data: any) => void,onError: (err: any) => void,}, type: String){
switch(type){
case "one":
callbacks.onYes("Print yes");
break;
case "two":
callbacks.onNo("Print no");
break;
default:
callbacks.onError("Print error");
break;
}
}
const onYes1 = (data: any) : void => {
console.log(data);
}
const onNo1 = (data: any) : void => {
console.log(data);
}
const onError1 = (data: any) : void => {
console.log(data);
}
callbackTesting({onYes: function (data: any) {onYes1(data);},onNo: function (data: any) {onNo1(data);},onError: function (data: any) {onError1(data);}}, "one");
callbackTesting({onYes: function (data: any) {onYes1(data);},onNo: function (data: any) {onNo1(data);},onError: function (data: any) {onError1(data);}}, "two");
callbackTesting({onYes: function (data: any) {onYes1(data);},onNo: function (data: any) {onNo1(data);},onError: function (data: any) {onError1(data);}}, "cfhvgjbhkjlkm");