TypeScript: o que é, diferenças para o JS e como começar a aprender

TypeScript: o que é, diferenças para o JS e como começar a aprender | Alura Cursos Online

Se você está procurando uma fonte de conhecimento sobre TypeScript, chegou ao lugar certo!

Talvez você só esteja querendo se livrar daqueles erros estranhos que permeiam nossas aplicações:


cannot read properties of undefined (reading 'map')

Ou ouviu falar que TypeScript nos ajuda nas atividades de pessoas que escrevem código. Ou, talvez, está vindo de uma linguagem orientada a objetos, como C# ou Java, e quer se arriscar um pouco com JavaScript.

Ou, então, alguma amizade te falou que TypeScript pode te ajudar a ter menos erros na produção. Se encaixa em alguma das situações?

Bom, vamos dar uma olhada no que o Typescript consegue ajudar:

Aumentar a segurança, prevenindo erros comuns;
Documentar o código, facilitando a vida do seu eu do futuro ou mesmo das pessoas que vão trabalhar na sua aplicação;
Facilitar a refatoração.


interface Mago {
  nome: string;
  nivel: number;
  lancarFeitico: (feitiço: string) => string;
}
const gandalf: Mago = {
  nome: "Gandalf",
  nivel: 20,
  lancarFeitico: (feitiço: string) => {
    return `Lançando ${feitiço}...`;
  }
};


class Bolo {
  sabor: string;
  camadas: number;
  constructor(sabor: string, camadas: number) {
    this.sabor = sabor;
    this.camadas = camadas;
  }
  servir(): void {
    console.log(`Servindo um bolo de ${this.sabor} com ${this.camadas} camadas.`);
  }
}


function misturar<T>(ingrediente: T): T {
  console.log(`Misturando ${ingrediente} na tigela.`);
  return ingrediente;
}
let frangoMisturado = misturar("frango");
let carneMisturada = misturar(500); // Gramas de carne


namespace Ingredientes {
    export class Massa {
        static preparar() {
            console.log("Preparando a massa.");
        }
    }
    export class Molho {
        static preparar() {
            console.log("Preparando o molho.");
        }
    }
}
Ingredientes.Massa.preparar();
Ingredientes.Molho.preparar();


function logar(target: any, chave: string, descriptor: PropertyDescriptor) {
  const metodoOriginal = descriptor.value;
  descriptor.value = function(...args: any[]) {
    console.log(`Chamando "${chave}" com`, args);
    return metodoOriginal.apply(this, args);
  };
  return descriptor;
}
class Calculadora {
  @logar
  somar(a: number, b: number) {
    return a + b;
  }
}


type Construtor<T = {}> = new (...args: any[]) => T;
function ComTimestamp<TBase extends Construtor>(Base: TBase) {
  return class extends Base {
    timestamp = Date.now();
  };
}
class Usuario {}
const UsuarioComTimestamp = ComTimestamp(Usuario);
const usuario = new UsuarioComTimestamp();
console.log(usuario.timestamp); // Mostra o timestamp de quando o objeto foi criado


type SomenteLeitura<T> = { readonly [P in keyof T]: T[P]; };
interface Usuario {
  nome: string;
  idade: number;
}
type UsuarioSomenteLeitura = SomenteLeitura<Usuario>;
let usuario: UsuarioSomenteLeitura = { nome: "John", idade: 30 };
// usuario.nome = "Jane"; // Isso resultaria em um erro, pois 'nome' é somente leitura.


// Antes: usuario.js
function criaUsuario(nome, idade) {
  return { nome: nome, idade: idade };
}
// Depois: usuario.ts
function criaUsuario(nome: string, idade: number): { nome: string; idade: number } {
  return { nome, idade };
}

Carreiras

Área de Interesse

Aulas ao Vivo - Skills & Go

Senioridade

Eventos Alura

Carreiras

Área de Interesse

Aulas ao Vivo - Skills & Go

Senioridade

Eventos Alura

Vinicios Neves

Inscreva-se em nossa Newsletter

Explore por tópico

Tipagem segura

Somar o número 42 com um array, o JavaScript retorna uma string '42'

Criar um objeto chamado herói e definir uma propriedade nome para ele ao tentar chamar uma propriedade identidade o JavaScript retorna undefined

TypeScript vs JavaScript

Como os tipos são vinculados?

Os tipos são convertidos automaticamente?

Quando os tipos são verificados?

Quando os erros são apresentados?

Linha do tempo do TypeScript

Por onde começar? JavaScript ou TypeScript?

Fundamentos do TypeScript

Decisão de aprendizado baseada em objetivos e projetos

TypeScript para iniciantes

1. Node.js

2. TypeScript

3. Editor de código

Tipos em TypeScript

Classes

Objetos

Generics

Enums

Modules e namespaces

Modules

Namespaces

TypeScript Avançado

Decorators

Mixins

Mapeamento de tipos

Como integrar TypeScript em Projetos Existentes

Estratégias para a migração gradual

Como lidar com bibliotecas JavaScript em TypeScript

Melhores práticas TypeScript

Compilador TypeScript

Como funciona o compilador Typescript?

Configurações Personalizadas com tsconfig.json

Frameworks e Suporte a TypeScript

TypeScript e Angular

Por que Angular & TypeScript?

TypeScript e React

Por que React & TypeScript?

Aprenda mais sobre TypeScript gratuitamente

Conclusão

Bibliografia

Leia também

Somar o número 42 com um array, o JavaScript retorna uma string `'42'`

Criar um objeto chamado herói e definir uma propriedade nome para ele ao tentar chamar uma propriedade `identidade` o JavaScript retorna `undefined`