1. Entendendo os Object Types
1.1. O que são Object Types?
1.1.1. Em TypeScript, os Object Types são um dos tipos fundamentais que representam a estrutura de um objeto JavaScript. Eles descrevem os tipos de propriedades e métodos que um objeto pode ter.
1.2. Interface como parâmetro
1.2.1. É possível usar interfaces como tipos de parâmetros em funções. Isso é útil quando você deseja definir contratos para os tipos de objetos que podem ser passados como argumentos para suas funções.
1.3. Interface com parâmetro opcional
1.3.1. As interfaces podem conter propriedades de obejto opcionais, basta adcionar a interrogação no nome da propriedade. Exemplo: nome?:string
1.4. Propriedades readonly
1.4.1. Em TypeScript, você pode usar a palavra-chave readonly para definir propriedades de objetos que não podem ser modificadas após sua inicialização. Isso significa que uma vez que o valor de uma propriedade readonly é definido, ele não pode ser alterado posteriormente.
1.4.1.1. interface Pessoa { readonly nome: string; idade: number; }
1.5. Index Signature
1.5.1. Em TypeScript, um "Index Signature" (ou "assinatura de índice") é uma maneira de definir a estrutura de objetos que possuem chaves dinâmicas. Isso é útil quando você deseja trabalhar com objetos que têm um conjunto de propriedades conhecidas, mas também podem ter outras propriedades cujos nomes são desconhecidos antecipadamente.
1.5.1.1. { [propriedade: tipo]: tipoValor; }
1.6. Herança de interfaces (extends types)
1.6.1. Utilizamos Extends Types como uma herança para criar tipos mais complexos por meio de uma interface; Ou seja, uma infertace pode herdar as propriedades e tipos já definidos de outra. Isso acontece por meio da instruçõa extends.
1.7. Intersection types
1.7.1. Os Intersection Types (tipos de interseção) em TypeScript são usados para combinar dois ou mais tipos em um único tipo que contém todas as propriedades de cada tipo original. Em outras palavras, eles criam um novo tipo que contém todas as propriedades de cada tipo de entrada. A sintaxe para criar um Intersection Type usa o operador '&'.
1.8. Readonly array
1.8.1. O ReadOnlyArray é um tipo de para arrays, que deixa os itens como readonly. Podemos aplicar um tipo para os itens do array, além desta propriedade especial, a modificação de itens pode ser feita através de métodos , mas não podemos aumentar de tamanho do array.
1.9. Tuplas
1.9.1. Uma tupla em TypeScript é um tipo de dados que permite representar um conjunto ordenado de elementos, onde cada elemento pode ter um tipo diferente. Ao contrário de arrays, onde todos os elementos têm o mesmo tipo, as tuplas podem ter tipos distintos para cada posição.
1.9.1.1. let tupla: [string, number, boolean]; tupla = ["hello", 10, true]; console.log(tupla[0]); // Saída: hello console.log(tupla[1]); // Saída: 10 console.log(tupla[2]); // Saída: true
1.10. Tuplas com readonly
1.10.1. Você pode usar a palavra-chave readonly em uma tupla para tornar seus elementos imutáveis. Isso significa que, após a inicialização, os valores dos elementos da tupla não podem ser modificados. Aqui está um exemplo de como usar readonly com tuplas:
1.10.1.1. let tupla: readonly [string, number] = ["hello", 10];
2. Fundamentos do TypeScript
2.1. Tipos primitivos
2.1.1. Number String Boolean
2.2. Type inference e Type annotation
2.2.1. *Type inference:* é quando o TS identifica e define o tipo de dados para nós. *Type annotation:* é quando definimos o tipo de um dado manualmente.
2.3. Tipo de Retorno de funções
2.3.1. function myFunction(name:string):string{} -Faz com que aceite como retorno apenas dados do tipo string.
2.4. Funções anônimas em TS
2.4.1. Faz com que apresente o erro de chamada de função dentro de uma função anônima.
2.5. Tipos de objetos
2.5.1. A sintaxe é: { prop: tipo, prop2: tipo2}. Estamos determinando quais tipos as propriedades de um objeto possuem.
2.6. Propriedades Opcionais
2.6.1. Para que ativar a propriedade opcional basta acrescentar a interrogação: {nome:string, sobrenome?:string}
2.7. Validação de props opcional
2.7.1. A melhor forma de fazer uma validação opcional é utilizando a condicional IF dentro da função para que não seja apresentado o "undefined" no console. OBS.: O primeiro argumento não pode ser opcional.
2.8. Union type
2.8.1. Podemos determinar dois tipos para um dado. A sintaxe: number | string | boolean.
2.8.2. Pode ser utilizado condicionais tbm com os dados Union. Trilhar rumos diferentes se baseando no retorno do tipo de dado.
2.9. Type Alias
2.9.1. Sua principal função além de reduzir a sintaxe mais complexas ainda é muito boa para se trabalhar com outros tipos de entradas de dados diferentes.
3. Módulos com TS
3.1. Sobre os módulos
3.1.1. Em TypeScript, os módulos são uma forma de organizar e reutilizar código em diferentes partes de um projeto. Eles ajudam a manter o código limpo, modular e separado por responsabilidades.
3.2. Importação de arquivos
3.2.1. 1. **Crie um arquivo `module.ts`.** 2. **Defina uma função ou recurso no `module.ts` e exporte-o.** 3. **Crie um arquivo `main.ts`.** 4. **Importe a função ou recurso do `module.ts` para o `main.ts`.** 5. **Compile os arquivos TypeScript para JavaScript, se necessário.** 6. **Execute o arquivo JavaScript resultante.**
3.3. Importação de variáveis
3.3.1. 1. **Crie um arquivo `module.ts` com variáveis exportadas.** 2. **No arquivo `main.ts`, importe as variáveis necessárias do `module.ts`.** 3. **Compile os arquivos TypeScript para JavaScript, se necessário.** 4. **Execute o arquivo JavaScript resultante.**
3.4. Múltiplas importações
3.4.1. 1. **Crie os arquivos dos módulos.** 2. **No arquivo principal (`main.ts`), importe as variáveis necessárias de cada módulo.** 3. **Compile os arquivos TypeScript para JavaScript, se necessário.** 4. **Execute o arquivo JavaScript resultante.**
3.5. Alias de importação
3.5.1. 1. **No arquivo `main.ts`, importe as variáveis dos módulos desejados usando alias.** 2. **Use a palavra-chave `as` seguida pelo nome do alias desejado para renomear a variável importada.** 3. **Depois, você pode usar o alias para se referir à variável importada em vez do nome original.**
3.6. Importando diversos itens
3.6.1. No arquivo principal (main.ts), importe todos os itens do módulo usando * seguido pelo nome do módulo.
3.7. Importando tipos
3.7.1. 1. **Defina o tipo em um arquivo TypeScript.** 2. **No arquivo onde deseja usá-lo, importe-o usando a sintaxe de importação de módulos.** 3. **Agora você pode usar o tipo importado em seu arquivo como faria com qualquer outro tipo.**
4. Introdução
4.1. O que é TypeScript?
4.1.1. TypeScript é um superset para a linguagem JavaScript ou seja, adciona funções ao JavaScript, como declaração de tipos de variáveis;
4.2. Porque TypeScript?
4.2.1. -Adciona confiabilidade ao programa. -Provê novas funcionalidades a JS, como interfaces. -Verificar os erros antes da execução do código. -Deixa JavaScript mais Explícito. -Perde menos tempo com debug.
4.3. Instalações: Node.js, VS code, cmder, TypeScript...
5. Interfaces
5.1. Introdução as Interfaces
5.1.1. Ele tem uma abordagem semelhante ao type Alias na qual serve para melhorar a declaração de forma organizacional o código. Se asemelha um pouco a sua declaração a utilização do foreach/map dentro de um array em react.
5.2. Type alias x Interface
5.2.1. - A interface pode ser alterada ao longo do código, já o alias não pode. -Pode ser feito a escolha de qualquer um dos dois recursos. -Declaração: type ID = string | number; interface Person { name: string; } interface Person { age: number; }
5.3. Literal types
5.3.1. Só vai permitir ser exibido valores pré-definidos no parâmetro da função. Caso seja colocado um valor diferente dos valores da função dos pré-estabelecidos, o programa apresentará um erro, no terminal da aplicação.
5.4. Non null assertion operator
5.4.1. Quando a gente tem algum elemento do DOM e queremos identificar alguma manipulação basta colocar a exclamação juntamente com o ponto console.log(p!.innerText); para fazer a manipulação do DOM. e Evitar o erro apresentado durante a aplicação.
5.5. BigInt
5.5.1. Com o tipo bigInt podemos declarar números com valores muito altos. Pode ser utilizado valores literais exemplo: 100n Vai em: tsconfig.json e muda a target para 2020. Ex.:"target": "es2020",
5.6. Symbol
5.6.1. De forma resumida, o Symbol cria uma referência única para um valor. Mesmo que ele possua o mesmo de outra variável, teremos valores sendo considerados diferentes.
6. Narrowing (verificação de tipos e dados)
6.1. O que é narrowing?
6.1.1. É um recurso de TS para identificar tipos de dados. Há situações em que os tipos podem ser imprevisíveis, e queremos executar algo para cada uma das possibilidades.
6.2. typeof Type Guard
6.2.1. O Type Guard permite que a função se adapte dinamicamente com base nos tipos dos argumentos, tornando-a mais flexível e robusta em lidar com diferentes tipos de entrada. Isso contribui para a segurança e confiabilidade do código em TypeScript.
6.3. Checando se valor existe
6.3.1. É criado um IF que engloba toda a operação com outros IFs para que então só prossiga com o calculo se houver alguma operação com dois argumentos corretos para prosseguir com os cálculos.
6.4. Operador instanceof
6.4.1. Em TypeScript, assim como em JavaScript, o operador instanceof é usado para verificar se um objeto é uma instância de uma classe ou de uma função construtora. Ele retorna true se o objeto é uma instância da classe especificada e false caso contrário.
6.5. Operador in
6.5.1. O operador in é útil para verificar se um objeto possui uma determinada propriedade antes de acessá-la, evitando assim erros de acesso a propriedades indefinidas. Ele é comumente usado em estruturas condicionais e loops para verificar a presença de chaves em objetos dinamicamente.
7. Funções com TypeScript
7.1. Fução sem retorno
7.1.1. Basta Utilizar o void para que a função não tenha retorno e sua declaração é da seguinte forma: function withoutReturn(): void {}
7.2. Callback sem argumento
7.2.1. Podemos inserir uma função de callback como argumento de função; Nela conseguimos definir o tipo de argumento aceito pela callback e também o tipo de retorno da mesma.
7.3. Generic function
7.3.1. Em TypeScript, uma função genérica (generic function) é uma função que pode aceitar argumentos de diferentes tipos, mantendo a flexibilidade e a segurança de tipo. Elas permitem escrever código que pode ser reutilizado com diferentes tipos de dados sem sacrificar a verificação de tipo estático fornecida pelo TypeScript.
7.3.2. Para definir os generics geralmente são usadas as letras <T> ou <u>. function inverter<T>(array: T[]): T[] { return array.reverse(); }
7.4. Constraint em generic function
7.4.1. As Generic functions podem ter seu escopo reduzido por constraints, basicamente limitando os tipos que podem ser utilizadps no Generic.
7.5. Especificar tipo de argumento
7.5.1. As Generic functions podem ter seu escopo reduzido por constraints, basicamente limitando os tipos que podem ser utilizadps no Generic.
7.6. Fução sem retorno
7.6.1. Em generic function temos que utilizar parâmetros de tipos semelhantes, se não recebemos um erro. Porém há a possibilidade de determinar o tipo também dos parâmetros aceitos, com uma sintaxe especial. console.log(mergeArrays<number | string>([1,2,3], ["teste", "testando"]));
7.7. Parâmetros opcionais
7.7.1. Nem sempre utilizamos todos os parâmetros de uma função, mas se ele for opcional, precisamos declarar isso para o TS e ainda deixar ele no fim da lista de parâmetros. Basta acrescentar a interrogaçaõ para que fique opcional: function modernGreeting(name: string, lastName?: string) {...}
7.8. Parâmetro default
7.8.1. OS parâmetros default são os que já possuem um valor definido. Se não passarmos o para a função é utilizado esse valor. Para este recurso, a aplicação em TS é igual JS.
7.8.1.1. function somaDefault(n:number, m=10){ return n + m }
7.9. Tipo Unknown
7.9.1. O tipo unknown em TypeScript é um tipo que representa um valor cujo tipo é desconhecido durante a compilação. É semelhante ao tipo any, mas com uma diferença crucial: enquanto any desabilita a verificação de tipo para o valor, unknown exige que você faça verificações de tipo antes de usar o valor. Isso torna o tipo unknown mais seguro em comparação com any.
7.10. O tipo Never
7.10.1. O tipo never em TypeScript é usado para representar o tipo de valor retornado por uma função que nunca termina de executar completamente. Isso geralmente acontece em cenários onde a função lança uma exceção, entra em um loop infinito ou tem um ponto de retorno inalcançável.
7.10.1.1. function showErrorMessage(msg: string):never {...}
7.11. Rest Parameters (Rest operator)
7.11.1. Os Rest Parameters em TypeScript permitem que você defina uma função com um número variável de argumentos, agrupando-os em um único parâmetro de array. Isso é útil quando você deseja lidar com uma quantidade desconhecida de argumentos em uma função.
7.11.1.1. function calcularMedia(...numeros: number[]): number {..}
7.12. Destructuring em parâmetro
7.12.1. A desestruturação de parâmetros permite extrair valores de objetos ou arrays diretamente como parâmetros de uma função. Isso pode ser útil quando você deseja acessar propriedades de objetos ou elementos de arrays de forma mais concisa.
8. Criação de Tipos
8.1. Sobre a Criação de tipos
8.1.1. A criação de tipos em TypeScript é uma das características mais poderosas da linguagem. Permite definir estruturas de dados personalizadas que podem ser usadas para fornecer segurança de tipo, expressar intenções de código de forma mais clara e criar abstrações reutilizáveis. Existem várias maneiras de criar tipos em TypeScript, incluindo interfaces, tipos (type) e até mesmo combinações de ambos.
8.2. Revisão de Generics
8.2.1. Utilizamos Generics quado ua função pode aceitar mais de um tipo, é uma prática mais interessante do que o any, que teria um efeito semelhante.
8.3. Constraint em Generics
8.3.1. As constraints (restrições) em generics em TypeScript permitem definir limitações nos tipos que podem ser usados como argumentos genéricos. Isso é útil quando você deseja restringir o tipo genérico para um conjunto específico de tipos que oferecem suporte a determinadas operações. Você pode aplicar uma constraint a um tipo genérico usando a palavra-chave extends seguida do tipo ou da união de tipos que deseja permitir como argumentos genéricos.
8.3.1.1. function dirigir<T extends Veiculo>(veiculo: T): void { veiculo.acelerar(); }
8.4. Generics com Interface
8.4.1. Generics com interfaces em TypeScript permitem criar interfaces flexíveis que podem trabalhar com uma variedade de tipos. Isso é útil quando você deseja que uma interface seja parametrizada por um tipo específico, o que permite maior reutilização de código e flexibilidade na definição de tipos.
8.5. Type parameters
8.5.1. Type parameters, ou parâmetros de tipo, são uma característica poderosa em TypeScript que permitem escrever código genérico e reutilizável. Eles são semelhantes a parâmetros de função, mas em vez de valores, eles aceitam tipos como argumentos. Os type parameters são definidos usando a sintaxe <>.
8.6. Keyof type operator
8.6.1. O operador keyof em TypeScript é um operador de tipo que retorna a união de chaves (nomes de propriedades) de um tipo de objeto. Ele é comumente usado em conjunto com generics e restrições de tipo para criar funções ou tipos que operam em chaves de objetos de forma segura.
8.7. Typeof type operator
8.7.1. Efetua a correlação entre dos dois tipos de constante sem ter que ter a necessidade de declarar novamente que a outra constante se trata de uma string.
8.8. Indexed access types
8.8.1. Indexed access types, ou tipos de acesso indexado, são uma característica poderosa em TypeScript que permite acessar os tipos de propriedades de outro tipo usando uma chave indexada (nome da propriedade) para obter o tipo da propriedade correspondente. Essa funcionalidade é útil quando você precisa acessar dinamicamente o tipo de uma propriedade de um objeto com base em uma chave (nome da propriedade) conhecida apenas em tempo de execução. A sintaxe para tipos de acesso indexado é [Tipo][Chave], onde Tipo é o tipo do objeto do qual você deseja acessar uma propriedade e Chave é o tipo da chave indexada.
8.9. Conditional expressions types
8.9.1. O tipo por condição permite criar um novo tipo com base em um if/else. Não são aceitas expressões tão amplas, utilizamos a sintaxe de if ternário.
8.10. Template literals type
8.10.1. Podemos criar tipos com Template literals, é uma forma de custormizar tipos de maneiras infinitas, pois o texto que formamos pode depender de variáveis.
8.10.1.1. type testA = "text" type CustomType = `Some ${testA}` const testing: CustomType = "Some text"
9. Classes com TypeScript
9.1. Campos em classes
9.1.1. Em TS podemos adiconar novos campos a uma classe, ou seja, iniciar a classe com campos para os futuros dados dos objetos. Que serão as propriedades dos objetos instanciados, estes campos podem ser tipados também. Note que um campo sem valor inicial, deve ser declarado com '!'.
9.2. Constructor
9.2.1. Constructor é uma função que nos dá a possibilidade de iniciar um objeto com valores nos seus campos, Isso faz com que não precisemos mais da '!'. Provavelmente todos os capos serão preenchidos na hora de instacciar um objeto.
9.3. Propriedades readonly (campos readonly)
9.3.1. Podemos iniciar o campo com o alor e torná-lo apenas para consulta posteriomente tornando ele readonly.
9.4. Herança e super
9.4.1. Em TypeScript, assim como em JavaScript, você pode usar classes para implementar herança e chamar o construtor da classe pai usando a palavra-chave super.
9.5. Métodos
9.5.1. Métodos em TypeScript são funções definidas dentro de classes que podem ser chamadas em instâncias da classe. Eles permitem encapsular comportamentos específicos relacionados a objetos e são uma parte fundamental da programação orientada a objetos.
9.5.1.1. Ex.: Temos uma classe Carro com propriedades modelo e ano, e dois métodos: acelerar e frear.
9.6. O this em classes
9.6.1. O this em JavaScript e TypeScript é uma referência especial que se refere ao objeto atual em contexto. Ele é usado dentro de métodos de objeto ou construtores para acessar propriedades e métodos do próprio objeto
9.7. Getters
9.7.1. Em TypeScript (e JavaScript), os getters são métodos especiais que permitem acessar propriedades de um objeto como se fossem propriedades diretamente acessíveis, mas na verdade eles são invocados como métodos.
9.7.1.1. Os getters são úteis quando você deseja encapsular a lógica de acesso a propriedades de um objeto. Eles permitem que você adicione lógica personalizada ao acessar uma propriedade, como validação de entrada, cálculos dinâmicos de valores, entre outros. Além disso, os getters fornecem uma interface de acesso consistente para os consumidores da sua classe.
9.8. Setters
9.8.1. Em TypeScript (e JavaScript), os setters são métodos especiais que permitem atribuir valores a propriedades de um objeto como se fossem atribuições diretas, mas na verdade eles são invocados como métodos.
9.8.1.1. Os setters são úteis quando você deseja encapsular a lógica de atribuição de valores a propriedades de um objeto. Eles permitem que você adicione lógica personalizada ao atribuir um valor a uma propriedade, como validação de entrada, cálculos dinâmicos de valores, entre outros.
9.9. Herdando interfaces
9.9.1. Em TypeScript, assim como em muitas outras linguagens de programação orientadas a objetos, é possível herdar de interfaces. A herança de interfaces permite que uma interface herde as propriedades e métodos de outra interface, estendendo suas funcionalidades.
9.10. Override de métodos
9.10.1. O conceito de "override" em programação orientada a objetos se refere à substituição de um método de uma classe pai por um método com o mesmo nome e assinatura em uma classe filha. Isso permite que a classe filha forneça uma implementação específica para aquele método, adaptando-o às suas necessidades, ao invés de simplesmente herdar a implementação da classe pai.
9.11. Sobre a visibilidade de propriedades e métodos
9.11.1. Visibilidade: public
9.11.1.1. Public (public): Membros marcados como public são acessíveis de qualquer lugar. Esta é a visibilidade padrão em TypeScript, o que significa que, se nenhum modificador de acesso for especificado, o membro será tratado como public.
9.11.2. Visibilidade: protected
9.11.2.1. Protected (protected): Membros marcados como protected são acessíveis dentro da própria classe e por suas subclasses (classes que estendem a classe atual). Isso significa que eles não podem ser acessados diretamente por código fora da classe ou de suas subclasses.
9.11.3. Visibilidade: private
9.11.3.1. Private (private): Membros marcados como private só são acessíveis dentro da própria classe. Isso significa que eles não podem ser acessados ou modificados por código fora da classe.
9.12. Static members
9.12.1. Os membros estáticos em TypeScript são membros de uma classe que pertencem à própria classe, em vez de pertencerem a instâncias individuais da classe. Isso significa que eles são compartilhados por todas as instâncias da classe e podem ser acessados diretamente através do nome da classe, sem a necessidade de criar uma instância da classe.
9.13. Generic class
9.13.1. Uma classe genérica em TypeScript é uma classe que pode trabalhar com tipos variados, permitindo que você defina tipos específicos para suas propriedades e métodos durante a instanciação. Isso oferece maior flexibilidade e reutilização de código, pois a lógica da classe pode ser escrita de forma independente do tipo de dados que ela manipula.
9.14. Parameter properties
9.14.1. As "parameter properties" (propriedades de parâmetro) em TypeScript são uma forma concisa de definir propriedades de uma classe diretamente nos parâmetros do construtor. Isso evita a necessidade de declarar explicitamente os parâmetros do construtor e, em seguida, atribuir os valores dos parâmetros às propriedades da classe.
9.15. Class expressions
9.15.1. Em TypeScript, uma expressão de classe é uma maneira de definir uma classe usando uma expressão, em vez de uma declaração de classe tradicional. Isso permite que você defina uma classe em um contexto onde as expressões são usadas, como em atribuições, passagem de argumentos de função ou como retorno de função.
9.16. Classe abstrata
9.16.1. Uma classe abstrata em TypeScript é uma classe que não pode ser instanciada diretamente e é projetada para ser usada como uma classe base para outras classes. Ela pode conter métodos abstratos, que são métodos sem implementação, que devem ser implementados pelas classes derivadas.
9.17. Relação entre classes
9.17.1. A relação entre classes em TypeScript, assim como em outras linguagens orientadas a objetos, descreve como as classes estão conectadas umas às outras e como elas interagem.
9.17.1.1. -Associação -Agregação -Herança -Composição -Implementação de -interface -Dependência
10. Decorators
10.1. Class decorator
10.1.1. O Decorator de Class está sempre ligado ao Constructor. Sempre que o constructor for executado,teremos a execução do decorator. Permitindo assim acrescentar algo na criação da class.
10.2. Sobre os decorators
10.2.1. Decorators são funções especiais que podem ser aplicadas a classes, métodos, propriedades e outros elementos no TypeScript para adicionar ou modificar seu comportamento.
10.3. Criando o primeiro decorator
10.3.1. 1.Entender o Conceito de Decorators: Decorators são funções que podem ser usadas para modificar classes, métodos, propriedades ou parâmetros. Eles são usados para adicionar comportamentos ou metadados.
10.3.1.1. 2.Definir a Função Decoradora: Escreva uma função que contenha a lógica para modificar comportamento.
10.3.1.1.1. 3.Aplicar o Decorator: Use a sintaxe @Decorator antes da classe, método ou propriedade.
10.4. Múltiplos decorators
10.4.1. Podemos usar múltiplos decorators em TS.O primeiro a ser executado é o que está mais ao topo do código.
10.5. Decorator de método
10.5.1. Um decorator de método em TypeScript é uma função que pode ser usada para adicionar funcionalidades extras a um método de uma classe.
10.6. Acessor decorator
10.6.1. Decorators são funções especiais que podem ser aplicadas a classes, métodos, propriedades e outros elementos no TypeScript para adicionar ou modificar seu comportamento.
10.7. Property decorator
10.7.1. Um decorador de propriedade é uma função especial que você pode usar para modificar ou configurar uma propriedade de uma classe.