Last active
April 27, 2018 00:11
-
-
Save geovanisouza92/dbc046e741ec3eee06552f583be13f96 to your computer and use it in GitHub Desktop.
Typescript pega os erros que você não vê
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// 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