Como Definir o Tipo de uma Variável que Armazena uma Função no TypeScript

No JavaScript, temos funções nomeadas e funções anônimas. O segundo tipo pode ser armazenado em uma variável, como no exemplo abaixo, já escrito com anotações de tipo do TypeScript:

let minhaFuncao = function(a: string, b: number): string {
  return `O valor da string é ${a} e o valor do numero é ${b}`;
};

Variáveis no TypeScript podem ter uma anotação de tipo, por exemplo:

let meuNumero: number = 48;

A expressão acima declara uma variável do tipo number com o valor 48.

Podemos adicionar o tipo de uma variável que armazena uma função da seguinte maneira, usando o nosso exemplo anterior:

let minhaFuncao: (x: string, y: number) => string = 
function(a: string, b: number): string {
  return `O valor da string é ${a} e o valor do numero é ${b}`;
};

No exemplo acima, o tipo da variável minhaFuncao é a assinatura de função (x: string, y: number) => string.

Os nomes dos parâmetros foram mudados de propósito para você saber que o que importam são os tipos e não os nomes. O nome da variável na assinatura pode ser diferente da definição no lado direito do igual, mas os tipos não podem ser diferentes.

Note que separamos os parâmetros de entrada do tipo do valor de saída com a seta =>. No exemplo, temos como parâmetros da função o x e y, de tipo string e number, respectivamente. O tipo do valor de retorno e declarado no lado direito da seta =>, nesse caso uma string.

Declarar a assinatura do tipo da variável as vezes pode deixar a linha muito longa, então podemos aproveitar a inferência de tipo do compilador do TypeScript. Às vezes definindo de um lado da expressão basta para que o compilador deduza os tipos do outro lado.

Para aprender mais sobre o TypeScript, assista às aulas do NBK Mundo Tech:

Nos vemos lá!