TypeScript中是否可以使用强类型函数作为参数?

vcs*_*nes 491 typescript

在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);
Run Code Online (Sandbox Code Playgroud)

保存回调不是类型安全的,我给它一个回调函数,其中函数的参数是一个字符串,但我传递一个数字,并编译没有错误.我可以在保存类型安全功能时创建结果参数吗?

TL; DR版本:在TypeScript中是否有等效的.NET委托?

Rya*_*ugh 725

当然:

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
Run Code Online (Sandbox Code Playgroud)

如果需要,可以定义一个类型来封装它:

type NumberCallback = (n: number) => any;

class Foo {
    // Equivalent
    save(callback: NumberCallback) : void {
        callback(42);
    }
}
Run Code Online (Sandbox Code Playgroud)

  • @nikkwong它意味着该函数接受一个参数(一个`数字`),但返回类型根本不受限制(可以是任何值,甚至是`void`) (13认同)
  • 这个语法中的"n"有什么意义?单独的输入和输出类型是否足够? (10认同)
  • @YuhuanJiang [这篇文章](/sf/ask/859091061/#12272754 ) 你可能会感兴趣 (7认同)
  • ```(n:number)=> any```表示任何函数签名? (5认同)
  • 使用内联函数与命名函数之间的一个副作用(下面回答vs这个答案)是"this"变量未使用命名函数定义,而它是在内联函数中定义的.对JavaScript编码器来说并不奇怪,但对其他编码背景来说肯定不明显. (3认同)

Dre*_*kes 87

以下是一些常见.NET委托的TypeScript等价物:

interface Action<T>
{
    (item: T): void;
}

interface Func<T,TResult>
{
    (item: T): TResult;
}
Run Code Online (Sandbox Code Playgroud)

  • 原因是 TypeScript 具有简洁的函数类型文字语法,无需此类接口。在 C# 中,委托是名义上的,但 `Action` 和 `Func` 委托都消除了对特定委托类型的大部分需求,而且有趣的是,给 C# 提供了一种结构类型的外观。这些代表的缺点是他们的名字没有任何意义,但其他优势通常超过这一点。在 TypeScript 中,我们根本不需要这些类型。所以反模式将是`function map&lt;T, U&gt;(xs: T[], f: Func&lt;T, U&gt;)`。更喜欢`function map&lt;T, U&gt;(xs: T[], f: (x: T) =&gt; U)` (7认同)
  • @AluanHaddad你能详细说明为什么你会认为这是反模式吗? (5认同)
  • 这是一个品味问题,因为它们是一种没有运行时类型的语言中的等价形式.现在你也可以使用类型别名而不是接口. (5认同)
  • 更喜欢 `Func&lt;A, B&gt;` 而不是 `(arg: A) =&gt; B` 的原因之一是语法优先级 - 在任何需要使用方括号的地方,例如 `((arg: A) =&gt; B)`,前者不需要额外的括号。也就是说,我倾向于更喜欢更具体的类型,例如“type Predicate&lt;T&gt; = (x: T) =&gt; boolean”,因为它们增加了更多的可读性。 (3认同)
  • 看起来可能很有用,但实际使用此类类型将是一种反模式。无论如何,这些看起来更像是 Java SAM 类型而不是 C# 委托。当然它们不是,它们等价于类型别名形式,它对函数来说更优雅 (2认同)

kbp*_*ius 16

我意识到这篇文章已经过时了,但是有一个更紧凑的方法,与所提出的方法略有不同,但可能是一个非常有用的选择.实际上,您可以在调用方法时在线声明函数(在本例中为Foos 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
    }
)
Run Code Online (Sandbox Code Playgroud)

multipleCallback()方法对于可能成功或失败的网络调用等非常有用.再次假设一个网络调用示例,当multipleCallbacks()调用时,可以在一个位置定义成功和失败的行为,这有助于未来代码读取器的更清晰.

一般来说,根据我的经验,这种方法有助于使整体更简洁,更简洁,更清晰.

祝你好运!


Kri*_*wal 13

type FunctionName = (n: inputType) => any;

class ClassName {
    save(callback: FunctionName) : void {
        callback(data);
    }
}
Run Code Online (Sandbox Code Playgroud)

这肯定与函数式编程范例一致.

  • 你应该把它称为`inputType`而不是`returnType`,不是吗?`inputType`是`data`的类型,你将参数传递给`callback`函数. (6认同)

Wil*_*een 7

在 TS 中,我们可以通过以下方式键入函数:

函数类型/签名

这用于函数/方法的实际实现,它具有以下语法:

(arg1: Arg1type, arg2: Arg2type) : ReturnType
Run Code Online (Sandbox Code Playgroud)

例子:

function add(x: number, y: number): number {
    return x + y;
}

class Date {
  setTime(time: number): number {
   // ...
  }

}
Run Code Online (Sandbox Code Playgroud)

函数类型文字

函数类型文字是另一种声明函数类型的方法。它们通常应用于高阶函数的函数签名。高阶函数是接受函数作为参数或返回函数的函数。它具有以下语法:

(arg1: Arg1type, arg2: Arg2type) => ReturnType
Run Code Online (Sandbox Code Playgroud)

例子:

type FunctionType1 = (x: string, y: number) => number;

class Foo {
    save(callback: (str: string) => void) {
       // ...
    }

    doStuff(callback: FunctionType1) {
       // ...
    }

}
Run Code Online (Sandbox Code Playgroud)


Hum*_*bir 5

如果您首先定义函数类型,那么它看起来像

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);
Run Code Online (Sandbox Code Playgroud)

如果没有使用普通属性语法的函数类型,它将是:

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);
Run Code Online (Sandbox Code Playgroud)

如果您想使用像 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);
Run Code Online (Sandbox Code Playgroud)


Zac*_*Dow 5

因为您无法轻松地将函数定义和另一种数据类型联合起来,所以我发现将这些类型组合起来对于强类型化很有用。基于德鲁的回答。

type Func<TArgs extends any[], TResult> = (...args: TArgs) => TResult; 
//Syntax sugar
type Action<TArgs extends any[]> = Func<TArgs, undefined>; 
Run Code Online (Sandbox Code Playgroud)

现在您可以强类型化每个参数和返回类型!这是一个比上面更多参数的示例。

save(callback: Func<[string, Object, boolean], number>): number
{
    let str = "";
    let obj = {};
    let bool = true;
    let result: number = callback(str, obj, bool);
    return result;
}
Run Code Online (Sandbox Code Playgroud)

现在,您可以编写联合类型,例如对象或返回对象的函数,而无需创建可能需要导出或使用的全新类型。

//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>;
Run Code Online (Sandbox Code Playgroud)

  • 也许这是 TS 的早期版本,但是,`let myVar1: boolean | (parameters: object) =&gt; boolean;` 不起作用,因为您需要在函数周围添加括号 =&gt; `let myVar1: boolean | ((参数:对象) =&gt; 布尔值);` (2认同)