How to add typescript type to ES6 arrow function?

Question

Nowadays, I need to update javascript code to typescript.

But I found a question.

Before, I use a lot of arrow functions in before project. Now, I need to add type definition for many of them like after:

(a: number): string => { return `${a}` }

By using many npm packages, the package provide function type like after:

export declare type AAACallback = (a: number) => string

I wanna use the function type to my es6 arrow function.

Maybe you say like this:

let a: AAACallback = a => { return `${a}` }

// then use a

But I don't need to define a at all.

So, do you have any way to use function definition with es6 arrow function without define other variate?

Interesting you use the word “update” when referring to converting to typescript. — evolutionxbox
– evolutionxbox, Commented Oct 8, 2018 at 7:47
@evolutionxbox maybe I mean rewrite. you have any idea about my question? — tomision
– tomision, Commented Oct 8, 2018 at 7:48
@TomIsion not really clear to me what you are asking? You have a callback type AAACallback you assign an arrow function to it. What is the question ? You want to declare the type of a without the extra type ? — Titian Cernicova-Dragomir
– Titian Cernicova-Dragomir, Commented Oct 8, 2018 at 7:50
@TitianCernicova-Dragomir AAACallback is typescript function type. I wanna use it to define my arrow function. — tomision
– tomision, Commented Oct 8, 2018 at 8:25

Matt McCutchen · Accepted Answer · 2018-10-08 21:52:17Z

2

TypeScript doesn't have a built-in syntax to annotate that an arrow function (or any other expression) has a given overall type without declaring a separate variable. (If you use a type assertion, you may be unintentionally downcasting the expression since type assertions allow both upcasts and downcasts.) One thing you can do is use an identity function:

function id<T>(arg: T) { return arg; }

element.addEventListener('click', id<AAACallback>(event => {}), false)

answered Oct 8, 2018 at 21:52

Matt McCutchen

31.4k3 gold badges76 silver badges82 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to add typescript type to ES6 arrow function?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related