Type Annotations §

Definição §

O TypeScript tem a inferência de tipos, ou seja, não é necessário definir o tipo da variável explicitamente, apenas quando o mesmo já foi inicializado.

O type annotation é definido com : [tipo] após o nome da variável.

Tipos primitivos no TypeScript §

any §

É o tipo genérico do TypeScript, ou seja, quando ele não conseguir inferir o tipo é definido como any.

• any implícito:

  function showMessage(msg: any) {
    return msg;
  }

• any explícito:

  function showMessage(msg) {
    return msg;
  }

msg é do tipo any.

string §

let someString: string = "Luiz";

number (integer, float, hexadecimal, binário e octal) §

let integer: number = 30;
let negativeInteger: number = -30;
 
let float: number = 3.14;
let negativeFloat: number = -3.14;
 
let hexadecimal: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o7744;

boolean §

let someBoolean: boolean = true;

symbol §

let someSymbol: symbol = Symbol("qualquer-symbol");

bigint (disponível apenas nas versões ES2020 ou superior) §

let bigNumber: bigint = 10n;

array §

É possível utilizar generics ou a notação de array ([]).

let arrayOfNumberGeneric: Array<number> = [1, 2, 3];
let arrayOfNumber: number[] = [1, 2, 3];
 
let arrayOfStringsGeneric: Array<string> = ["a", "b", "c"];
let arrayOfStrings: string[] = ["a", "b", "c"];

object §

É possível utilizar as seguintes formas para declarar o tipo de um objeto:

• object:

  const objetoA: object = {
    chaveA: "Valor A",
    chaveB: "Valor B",
  };

  Não é recomendado definir explicitamente o tipo de um objeto com object.

• type aliases:

                                // Assinatura da propriedade: (property) adult?: boolean | undefined
                                            ^
                                            |
  let person: {name: string, age: number, adult?: boolean} = {
    name: 'Luiz',
    age: 30
  }

  OBS: em adult?: boolean a ? indica que um compo de um objeto é opcional

• Notação de objeto ({}):

  const objetoA: {} = {
    chaveA: "Valor A",
    chaveB: "Valor B",
  };

• Record:

  Ao utilizar o Record com o tipo unknown, desabilita o intellisense da IDE, uma vez que esse tipo está acima do tipo any na hierarquia.

  const objetoA: Record<string, unknown> = {
    chaveA: "Valor A",
    chaveB: "Valor B",
  };

• Index signature:

  const objetoA: {
    [key: string]: unknown; // chave opcional
  } = {
    chaveA: "Valor A",
  };
   
  objetoA.chaveA = "Nova chave A";

function §

function sum(x: number, y: number): number {
  return x + y;
}

  // Assinatura da função: function sum(x: number, y: number): number
          ^
          |
function sum(x: number, y: number) {
  return x + y;
}

          // Assinatura da função anônima: const sumArrowFunction: (x: number, y: number) => number
                ^
                |
const sumArrowFunction: (x: number, y: number) => number = (x, y) => x + y;

O tipo de retorno é inferido com base nos parâmetros da função. Caso uma função não tenha o return, o TypeScript infere o tipo de retorno como void (sem retorno)

void §

Indicar que uma função não tem retorno.

function semRetorno(...args: string[]): void {
  console.log(args.join(" "));
}

const pessoa = {
  nome: "Luiz",
  sobrenome: "Otávio",
 
  exibirNome(): void {
    console.log(this.nome + " " + this.sobrenome);
  },
};

tuple §

O tipo tuple é exclusivo do TypeScript.

Esse tipo é parecido com um array, porém nele é possível armazenar vários tipos de dados. Dessa forma, os métodos do array também funcionam na tupla.

• Sintaxe básica de uma tupla:

  const tuple: [number, string, string?] = [1, "Luiz", "Otávio"];
   
  console.log(tuple); // [ 1, 'Luiz', 'Otávio' ]

• Tupla imutável:

  const tuple: readonly [number, string] = [1, "Luiz"];
   
  console.log(tuple); // [ 1, 'Luiz' ]

  const tuple: ReadonlyArray<string> = ["Luiz", "Otávio"];
   
  console.log(tuple); // [ 'Luiz', 'Otávio' ]

never §

É um type annotation do TypeScript para representar um que uma função nunca retorna nada.

Geralmente, quando uma função retorna never, é porque ele lança um erro ou trava a aplicação.

IMPORTANTE: void é diferente de never

export function createError(): never {
  throw new Error('Error');
}
 
createError();

unknown §

É a classe “pai” de todos os tipos do TypeScript.

Ao definir uma variável com esse tipo, é necessário verificar o seu tipo antes de utilizá-la.

let x: unknown;
 
x = 100;
x = 'Luiz';
x = 900;
x = 100;
 
const y = 800;
 
if (typeof x === 'number') console.log(x + y);

undefined §

Serve para indicar que uma propriedade (não) será definida.

let x;
 
if (typeof x === 'undefined') {
  x = 20;
}
 
console.log(x * 2); // 40

null §

É a representação de um valor inexistente ou “vazio”.

export function squareOf(x: any) {
  if (typeof x === 'number') {
    return x + x;
  }
 
  return null;
}
 
const squareOfNumber = squareOf(2);
 
if (squareOfNumber === null) {
  console.log('Conta inválida.');
} else {
  console.log(squareOfNumber);
}
 
const squareOfString = squareOf('2');
 
if (squareOfString === null) {
  console.log('Conta inválida.');
} else {
  console.log(squareOfString);
}
 
/*
4
Conta inválida.
*/

Exemplo §

let name: string = "Luiz";

  // let name: string
      ^
      |
let name = 'Luiz';