小开

最佳答案

语言规范在p.64f上写着

形式<T >(…=>{…}可以解析为an 带有类型参数或类型断言的箭头函数表达式应用于没有类型参数的箭头函数。它被解析为前[. .]< / p >

例子:

// helper function needed because Backbone-couchdb's sync does not return a jqxhr
let fetched = <
R extends Backbone.Collection<any> >(c:R) => {
return new Promise(function (fulfill, reject) {
c.fetch({reset: true, success: fulfill, error: reject})
});
};

小开

我发现上面的例子令人困惑。我正在使用React和JSX，所以我认为它使场景复杂化

我从TypeScript Deep Dive中得到了澄清，它声明了箭头泛型:

解决方法:在泛型参数上使用扩展来提示编译器它是一个泛型，这来自一个更简单的例子，帮助了我。

    const identity = < T extends {} >(arg: T): T => { return arg; }

小开

编辑

根据@Thomas的评论，在更新的TS编译器中，我们可以简单地做:

const foo = <T,>(x: T) => x;

原来的答案

完整的例子解释了语法罗宾引用…带回家给我:

通用函数

像下面这样的东西是可以的:

function foo<T>(x: T): T { return x; }

然而，使用箭头泛型函数将不会:

const foo = <T>(x: T) => x; // ERROR : unclosed `T` tag

解决方法:在泛型参数上使用扩展来提示编译器它是一个通用的，例如:

const foo = <T extends unknown>(x: T) => x;

小开

这对我很有用

const Generic = <T> (value: T) => {
return value;
}

小开

如果你在.tsx文件中，你不能只写<T>，但这是可行的:

const foo = <T, >(x: T) => x;

与extends {}黑客相反，这种黑客至少保留了意图。

小开

虽然流行的答案是extends {}，比extends any更好，但它迫使T成为一个对象

const foo = <T extends {}>(x: T) => x;

为了避免这种情况并保持类型安全，您可以使用extends unknown代替

const foo = <T extends unknown>(x: T) => x;

小开

我喜欢使用这种类型的声明:

const identity: { <T>(arg: T): T } = (arg) => arg;

它允许在需要时为函数定义额外的道具，在某些情况下，它有助于使函数体相对于泛型定义更清晰。

如果你不需要额外的道具(命名空间之类的东西)，它可以简化为:

const identity: <T>(arg: T) => T = (arg) => arg;

小开

这么晚了，但与ES6不需要扩展它仍然为我工作....：）

let getArray = <T>(items: T[]): T[] => {
return new Array<T>().concat(items)
}


let myNumArr = getArray<number>([100, 200, 300]);
let myStrArr = getArray<string>(["Hello", "World"]);
myNumArr.push(1)
console.log(myNumArr)

小开

2021年，Ts 4.3.3

const useRequest = <DataType, ErrorType>(url: string): Response<DataType, ErrorType>
=> {
...
}

小开

使用<T扩展{}>当您试图将null作为参数传递时，将引发错误。我更喜欢使用<T，>因为这解决了问题。我还不知道原因。但这对我很管用。

小开

这对我很有用

 const logSomething = <T>(something:T): T => {
return something;
}

小开

我知道我回答这个问题有点晚了。但我想到了回答这个问题，以防其他人发现它有帮助。没有一个答案提到如何使用async箭头函数的泛型。

是这样的:

const example = async <T> (value: T) => {
//awaiting for some Promise to resolve or reject;
const result = await randomApi.getData(value);


}

小开

添加多个依赖泛型类型的示例:

这个函数，转换为箭头函数，如下所示:

http.get = function <T = any, R = AxiosResponse<T>>(url: string, config?: AxiosRequestConfig): Promise<R> {
config.withCredentials = true;
....
};

注意这里的扩展号代替了等号:

http.get = async <T extends any, R extends unknown = AxiosResponse<T>>(url: string, config?: AxiosRequestConfig): Promise<R> => {
config.withCredentials = true;
...
};

小开

这里我有2个带泛型的箭头函数:

直接呼叫:

const foo = <T>(value: T): void => {
console.log(value);
foo('hello') // hello
}

创建一个稍后使用的类型:

type TFoo<S> = (value: S) => boolean;
const foo: TFoo<number> = (value) => value>0;
console.log(foo(1)) // true
console.log(foo(-1)) // false

希望这对你有所帮助!

小开

非箭头函数的方法。扩展OP中的例子。

function foo<T>(abc: T): T {
console.log(abc);
return abc;
}


const x = { abc: 123 };
foo(x);


const y = 123;
foo<number>(y);

除了把整个事情嵌入到一个语句中的答案之外:

const yar = <T,>(abc: T) => {
console.log(abc);
return abc;
}

另一种方法是使用中间类型:

type XX = <T>(abc: T) => T;


const bar: XX = (abc) => {
console.log(abc);
return abc;
}

游乐场

带泛型的Typescript箭头函数的语法是什么?

编辑

原来的答案

通用函数