Curso TypeScript

Introdução

História

É um projeto open source criado pela Microsoft.

O que é TypeScript

TypeScript é um superset (superconjunto) do JavaScript.
Objetivo é adicionar funcionalidades que nativamente não estão disponíveis ou requerem grande esforço para utilização.
Adiciona apenas recursos estáticos opcionais de digitação e transpilação ao JavaScript.
Baseado nos padrões ES6 (ECMAScript), que podem ser compilados para JavaScript.

TypeScript cria interfaces (contratos) de comunicação.
Especifica como as coisas devem interagir entre si. O que pode ou não ser feito.
Fundamental para desenvolvimento em equipe. Ter limites bem definidos.
Ajuda a manter os padrões de codificação e legibilidade no JavaScript.

Extensão dos arquivos de TypeScript: .ts
Artefato puramente em tempo de compilação, em tempo de execução não há TypeScript, só JavaScript.
Portanto, código JS pode ser colocado em um arquivo de TypeScript, porque no final é executado como JS.

Vantagens

  • Basic Types: Tipagem de variáveis e funções.
  • Interface: Definição de contratos para classe, estrutura de dados.
  • Type: Definição de que uma variável pode ser uma interface.
    • Define um tipo baseado em N interfaces (AND, OR).
  • Generic Type: Definição de um tipo genérico, que pode receber qualquer tipo de dado.
    • Os tipos são inferidos de acordo com os valores recebidos.
  • Programação Orientada a Objetos: Suporte melhor
  • HTMLElement: Esta interface representa qualquer elemento HTML.
    • Alguns elementos implementam diretamente essa interface, outros a implementam por meio de uma interface que a herda.

    Instalação

    Instalação do TypeScript. 

    
                        npm install -g typescript
    Quando o TypeScript está instalado, temos acesso ao TSC (TypeScript Compiler).
    Para compilar, basta executar o comandotsc e o nome do arquivo com a extensão .ts 
    
                        tsc nome_do_arquivo.ts
    Mas, não precisamos fazer isso, podemos usar um bundler, como o parcel-bundler, para isso basta executar o comando:
    
                        npm install -g parcel-bundler
    O parcel-bundler isntala todas as dependências do node, incluindo o TypeScript.
    Após a instalação, basta executar o comando: 
    
                        npm run start
    No diretório da app são criados os diretórios .cache e dist.

    Configuração

    Para configurar o TypeScript, basta executar o comando: 

    
                        tsc --init
    O comando --init cria o arquivo tsconfig.json no diretório raiz da app.
    You can learn more at https://aka.ms/tsconfig.json O arquivo é gerado com algumas configurações padrão:
    Configuração Language and Environment:
    "target": "es2016" - Compila para o ES2016.
    Set the JavaScript language version for emitted JavaScript.
    Configuração Modules:
    "module": "commonjs" - Compila para o CommonJS.
    Specify what module code is generated.
    Modificar os valores para "ES6", para trabalhar com as versões mais atuais do TypeScript.
    OBS:O TypeScript compila os arquivos ".ts" para o arquivo ".js".
    Há diversas outras configurações.

    Flow

    Semelhante ao TypeScript referente a checagem de tipos.
    Mas não é um superset da linguagem JavaScript.
    É como uma versão mais simplificada do TypeScript.