TypeScript 接口是否具有匿名和命名函数？

Question

我认为接口很少同时具有匿名和命名函数。这是正确的吗？

TypeScript 编译器允许接口同时具有匿名函数和命名函数。

// no error
interface Foo {
  (x: number, y: number): number; // anonymous
  namedMethod: (z: string, w: string) => string; // named
}

但它似乎不可用。

// badProp is not assignable
const foo1 : Foo = {
  badProp(x: number, y: number) { return 1 },
  namedMethod(a: string, b: string) { return 'str'; }
}

// syntax error
const foo2 : Foo = {
  (x: number, y: number) { return 1 },
  namedMethod(a: string, b: string) { return 'str'; }
}

使用any 类型，它可以工作。

const temp: any = function (x: number, y: number) { return 1 };
temp.namedMethod = function (a: string, b: string) { return 'str'; }
const foo3: Foo = temp;

虽然在技术上可以同时使用两者，但接口很少同时具有匿名函数和命名函数。 是这样吗？

Answer 1

TypeScript 接口中的“未命名” 成员不是指匿名成员，而是声明接口类本身的函数签名as described in this section of the documentation。

例如：

/**
 * Interface for function that takes two numbers as arguments, and returns
 * a number.
**/
interface TwoNumberFunction {
    (x: number, y: number): number,
}

// simple function: adds two numbers
function add(x: number, y: number): number {
    return x + y;
}

// 'add' is a function that takes two numbers and returns a
// number, so it matches the interface's requirements:
const func: NumberFunction = add;
func(1, 2); // = 3

Answer 2

TypeScript 允许接口具有混合类型，即接口可以具有属性、函数声明、索引器和方法的组合。这种灵活性可以与 JavaScript 的动态特性保持一致。

interface Foo {
    (x: number, y: number): number; // anonymous
    namedMethod: (z: string, w: string) => string; // named
    randomNumber: number
}

const foo2 = ((x: number, y: number) => x+ y + 1) as Foo;
foo2.namedMethod = (z: string, w: string) => z;
foo2.randomNumber = 4
console.log(foo2(1, 3)); // prints 5
console.log(foo2.namedMethod('hello', 'world')); // prints 'hello'
console.log(foo2.randomNumber); // prints 4

观看此视频了解what is hybrid types in typescript?

Answer 3

有两种方式来写Function types。 https://github.com/Microsoft/TypeScript/blob/master/doc/spec.md#334-function-types 很有帮助。

1。对象类型文字中的调用签名。

https://github.com/Microsoft/TypeScript/blob/master/doc/spec.md#392-call-signatures

// call signatures is like this.
(x: number, y: number): number,

声明函数类型的接口

spec 这么说

由于函数和构造函数类型只是包含调用和构造签名的对象类型，因此接口可用于声明命名函数和构造函数类型。

所以我可以写这个。

// interface with call signatures
interface TwoNumberFunctionInterface {
  (x: number, y: number): number,
}

2。函数类型字面量。

https://github.com/Microsoft/TypeScript/blob/master/doc/spec.md#388-function-type-literals

// function type literal is like this
let a: (x: number, y: number) => number;

函数类型文字是包含单个调用签名的对象类型的简写。

// object type containing a single call signature
let a: {(x: number, y: number): number};