Skip to content

Instantly share code, notes, and snippets.

@geovanisouza92
Last active April 27, 2018 00:11
Show Gist options
  • Save geovanisouza92/dbc046e741ec3eee06552f583be13f96 to your computer and use it in GitHub Desktop.
Save geovanisouza92/dbc046e741ec3eee06552f583be13f96 to your computer and use it in GitHub Desktop.
Typescript pega os erros que você não vê
// isso indica que a função "fn" pode ser invocada com uma lista de objetos que
// tenham, pelo menos, um atributo "id" do tipo number, e que o retorno vai ser
// uma lista de números
function fn<T extends { id: number }>(items: T[]): number[];
// isso indica que a função "fn" pode ser invocada com uma lista de "qualquer
// coisa" e que o segundo parâmetro deve ser o nome de um atributo presente em
// todos os itens da lista, e que o retorno vai ser uma lista com valores dos
// tipos de cada atributo encontrado na lista
function fn<T, K extends keyof T>(items: T[], idProp: K): T[K][];
// aqui a implementação da função "fn", que define um valor padrão para o
// segundo argumento, respeitando as assinaturas
function fn(items, idProp = "id") {
return items.map(it => it[idProp]);
}
const a = [{ id: 1, name: "foo" }, { id: 2, name: "bar" }];
const b = [{ user_id: 1, name: "foo" }, { user_id: 2, name: "bar" }];
const c = [{ foo: 'bar' }, { foo: true }];
// aqui a primeira "versão" da função "fn" é usada, o segundo argumento é
// definido como "id" (o valor padrão) e o TS verifica se os itens da lista "a"
// tem um id numérico, o que resulta numa lista de números
console.log(fn(a)); // => [1, 2] (number[])
// aqui temos 3 exemplos de tentativas de uso da função "fn" que o TS rejeita,
// acusando 1) os itens da lista "b" não tem "id"; 2) "id" não é um nome de
// atributos válido para os itens da lista "b", pois eles só possuem "user_id"
// e "name"; e 3) mesma coisa que o (2), pois o nome está escrito errado.
//
// Error: "id" is missing on b's type
// console.log(fn(b));
//
// Error: "id" is not assignable to "user_id" | "name"
// console.log(fn(b, "id"));
//
// Error: "user_i" is not assignable to "user_id" | "name" (typo)
// console.log(fn(b, "user_i"));
// aqui temos um exemplo de uso correto, que resulta numa lista de strings
console.log(fn(b, "name")); // => ["foo", "bar"] (string[])
// aqui temos outro exemplo correto, que resulta numa lista com strings e
// booleanos. O interessante é que o TS é capaz de inferir o tipo da lista
// baseado nos tipos dos atributos capturados da lista de itens original
console.log(fn(c, "foo")); // => ["bar", true] (Array<string | boolean>)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment