[英]Defining TypeScript callback type
我在 TypeScript 中有以下 class:
class CallbackTest
{
public myCallback;
public doWork(): void
{
//doing some work...
this.myCallback(); //calling callback
}
}
我正在使用这样的 class:
var test = new CallbackTest();
test.myCallback = () => alert("done");
test.doWork();
该代码有效,因此它按预期显示一个消息框。
我的问题是:我可以为我的 class 字段myCallback
提供任何类型吗? 现在,公共字段myCallback
any
类型如上所示。 如何定义回调的方法签名? 或者我可以将类型设置为某种回调类型吗? 或者我可以做这些吗? 我必须使用any
(隐式/显式)吗?
我尝试过这样的事情,但它不起作用(编译时错误):
public myCallback: ();
// or:
public myCallback: function;
我在网上找不到任何解释,所以我希望你能帮助我。
我刚刚在 TypeScript 语言规范中找到了一些东西,这很容易。 我非常接近。
语法如下:
public myCallback: (name: type) => returntype;
在我的例子中,它将是
class CallbackTest
{
public myCallback: () => void;
public doWork(): void
{
//doing some work...
this.myCallback(); //calling callback
}
}
更进一步,您可以声明一个指向函数签名的类型指针,例如:
interface myCallbackType { (myArgument: string): void }
并像这样使用它:
public myCallback : myCallbackType;
您可以声明一个新类型:
declare type MyHandler = (myArgument: string) => void;
var handler: MyHandler;
declare
关键字不是必需的。 它应该用于 .d.ts 文件或类似情况。
这是一个示例 - 不接受任何参数并且不返回任何内容。
class CallbackTest
{
public myCallback: {(): void;};
public doWork(): void
{
//doing some work...
this.myCallback(); //calling callback
}
}
var test = new CallbackTest();
test.myCallback = () => alert("done");
test.doWork();
如果你想接受一个参数,你也可以添加它:
public myCallback: {(msg: string): void;};
如果你想返回一个值,你也可以添加:
public myCallback: {(msg: string): number;};
如果你想要一个通用函数,你可以使用以下内容。 虽然它似乎没有记录在任何地方。
class CallbackTest {
myCallback: Function;
}
您可以使用以下内容:
type
关键字,为函数字面量取别名)以下是如何使用它们的示例:
type myCallbackType = (arg1: string, arg2: boolean) => number;
interface myCallbackInterface { (arg1: string, arg2: boolean): number };
class CallbackTest
{
// ...
public myCallback2: myCallbackType;
public myCallback3: myCallbackInterface;
public myCallback1: (arg1: string, arg2: boolean) => number;
// ...
}
我有点晚了,但是,因为前段时间在 TypeScript 中,您可以使用以下命令定义回调类型
type MyCallback = (KeyboardEvent) => void;
使用示例:
this.addEvent(document, "keydown", (e) => {
if (e.keyCode === 1) {
e.preventDefault();
}
});
addEvent(element, eventName, callback: MyCallback) {
element.addEventListener(eventName, callback, false);
}
尝试将回调添加到事件侦听器时遇到了同样的错误。 奇怪的是,将回调类型设置为 EventListener 就解决了。 它看起来比将整个函数签名定义为类型更优雅,但我不确定这是否是正确的方法。
class driving {
// the answer from this post - this works
// private callback: () => void;
// this also works!
private callback:EventListener;
constructor(){
this.callback = () => this.startJump();
window.addEventListener("keydown", this.callback);
}
startJump():void {
console.log("jump!");
window.removeEventListener("keydown", this.callback);
}
}
这是我如何定义包含回调的接口的简单示例。
// interface containing the callback
interface AmazingInput {
name: string
callback: (string) => void //defining the callback
}
// method being called
public saySomethingAmazing(data:AmazingInput) {
setTimeout (() => {
data.callback(data.name + ' this is Amazing!');
}, 1000)
}
// create a parameter, based on the interface
let input:AmazingInput = {
name: 'Joe Soap'
callback: (message) => {
console.log ('amazing message is:' + message);
}
}
// call the method, pass in the parameter
saySomethingAmazing(input);
这是角度组件和服务的可选回调函数的示例
maincomponent(){
const param = "xyz";
this.service.mainServie(param, (response)=>{
if(response){console.log("true");}
else{console.log("false");}
})
}
//Service Component
mainService(param: string, callback?){
if(string === "xyz"){
//call restApi
callback(true);
}
else{
callback(false);
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.