Mini Curso de TypeScript

Olá pessoal, nesse mini curso nós vamos aprender o básico da linguagem TypeScript. Vamos aprender um tutorial básico, como é que começa no TypeScript, se você já sabe JavaScript. Então o que é o TypeScript? Vamos começar? Então o TypeScript é essa linguagem que é chamada SuperSet, um super conjunto do JavaScript, que foi desenhada pelo mesmo designer que fez a linguagem C-Sharp, que é ser com o jogo da velha. Então TypeScript, se você ler o nome Type, que significa tipo, nada mais nada menos em termos simples, ele adiciona, é uma linguagem que adiciona tipos, a linguagem JavaScript. Se você vem do JavaScript, você já sabe que a gente pode declarar e definir variáveis de fuzões, valores de retorno e assim por diante, que são arbitrários no sentido de que não precisa a gente falar que tipo de dados a gente está lidando. Será que é um número? Será que é um one string? Um objeto? E assim por diante. Então TypeScript quer fazer adicionar os tipos no JavaScript para poder lidar com problemas de escala. Então ele diz que JavaScript é a scale, porque em aplicativos para poder, você tenha aquela escalabilidade, normalmente se não tivesse cheque dos tipos na hora de compilar, o JavaScript não tenha aquele passo de compilar, mas o TypeScript tem. Então o TypeScript é a linguagem que vai compilar do código escrito da maneira do TypeScript, aí compila para um código JavaScript. Então na verdade o JavaScript é um TypeScript, então se você pegar o código JavaScript vai funcionar no TypeScript. Ele faz nada menos, nada mais nada menos que uma transpilação de código, se tu é ele pega o TypeScript que é o JavaScript com algumas coisas a mais e ele pega quando você escreve, você compila e o compilador vai checar pelos tipos e ver se não tem nenhum problema. E esse é o benefício, que ele checa se não tiver nenhum problema antes de rodar o script. Porque normalmente no JavaScript a gente só vai entender às vezes só chegar a encontrar o problema na hora de rodar no runtime, mas com o TypeScript a gente pode identificar problemas mais cedo na hora de compilação. Ele vai fazer e pegar o código TypeScript, vai fazer a compilação que na verdade é uma transpilação de código TypeScript para JavaScript. E no final você vai obter o código de JavaScript de maneira, não tem nada demais assim. Então acho que já está bom a gente falar do TypeScript, é hora da gente partir para como é que vem e como é que isso funciona. Então aqui é o site do TypeScript, se você quiser como referência www.typescriptlang, L, A, N, G, ponto, org. Tem várias coisas aqui, você pode dar uma olhada, isso que é no inglês e documentação e isso em por diante, só para você saber. Então a versão que eu estou usando aqui nesse tutorial é versão 3.4, tá certo? Então vamos lá começar. Então primeiro de tudo você vai precisar do que? Do node e do NPM, é essencial para todo o desenvolvimento de JavaScript. Então vamos aqui no terminal, vamos instalar o TypeScript. Eu vou usar o NPM, mas se você tiver o Yarn também serve, tá? Então eu vou dizer NPM, install, traço G, porque eu quero instalar isso globalmente para poder usar o comando do compilador e eu vou digitar TypeScript, tá? Ele vai instalar o TypeScript aqui. A gente vai instalar o compilador comando TSC que a gente vai usar para compilar o código de JavaScript, de TypeScript para JavaScript. Pronto, então instalou o TypeScript versão compilado, versão 3.4.5, tá? Note que o TypeScript é um linguagem que já vem evoluindo, faz tempo, então as versões, as coisas ficam mudando um pouco mais rápido que outras linguagens, então tome cuidado quando você ver as coisas assim de documentação que pode ser antiga, que pode já ter mudado nessas novas versões de TypeScript. Então fique ligado nessas coisas. Então instalamos o TypeScript, tá? Então o que a gente vai fazer agora? Eu vou criar aqui um arquivo, tá? Bem simples, vou chamar exemplo.ts, tá? Então a extensão do arquivo de TypeScript, vamos usar não Js, mas ponto ts, tá? Ponto ts. Então vou criar esse arquivo, exemplo, ponto ts, vou abrir no meu editor de texto, não tem nada ainda nesse arquivo, tá aqui exemplo, ponto ts, tá? Vamos digitar o seguinte, tá? Então vamos dizer let, tá? Vou criar um variável aqui, tá certo? Js é igual a olá mundo, então não tem nada demais aqui, né? Só uma mensagem com a string olá mundo, e eu usei o let para definir o variável, né? Então, isso aqui é Javascript, né? Não tem nada de TypeScript, coisa de TypeScript ainda, mas vamos ver aqui no terminal, como é que compila esse cara para Javascript. Então vamos aprender como é que compila. Então você vai falar tsc, o comando, e o nome do arquivo, nesse caso exemplo, ponto ts, olha o que vai acontecer. Então tsc vai compilar, né? O arquivo, e vai gerar um arquivo Js correspondente. Note que aqui, olha no meu editor de texto, apareceu o arquivo exemplo, ponto Js, vamos dar uma olhada. Se você ver, por exemplo, ponto Js, aí quase a mesma coisa só muda a varki, tá? Então na verdade é a mesma coisa, né? Quase a mesma coisa. Ele muda o favor porque ele usa, ele transpira tudo para s5, tá? Porque os navegadores atuais, todos suportam s5, e a gente tá em quase na transição completa para s6, mas ainda não, então a gente precisa compilar, transpilar para s5. Isso que aparece a varki, tá? Certo? Legal, a gente aprendeu que o TypeScript, ele vai pegar o arquivo ponto ts e vai ser escrito em, na verdade, JavaScript com coisas a mais, e isso forma o TypeScript, tá? Você pode adicionar coisas a mais. E no final ele vai transpilar para um arquivo ponto Js que é JavaScript, nesse caso s5, não tem nada de mais, né? Então vamos, nós aprendemos essa aula, tivemos uma introdução ao TypeScript, um super conjunto da linguagem JavaScript, nada mais nada menos que o JavaScript, com algumas coisas a mais para nos permitir lidar com problemas de escala, quando a gente escrever nossos aplicativos em JavaScript. A gente pode checar por erros na hora da compilação, cedo, sem ter que esperar até a hora de rodar o aplicativo, isso é muito bom. Você pode checar os tipos, variáveis, retornos de função, parâmetros de função, o que é que tá, onde é que os dados estão fluindo, essas coisas, qual é o tipo, certo? Por exemplo, tem muito esse erro de você passar como argumento, por exemplo, você tá lidando com números, aí um dos números estava dentro de one string, e por causa disso causou um bug tremendo, e você não sabia o número tá dentro de one string, embora que dentro da string tem um número, não é realmente um tipo número, né? Então você precisava converter para número. As coisas, esse tipo de bugs vai ser identificados cedo com o compilador do TypeScript, que é o TSC, tá aprendendo? O TSC e o arquivo, ele pega o arquivo do ponto TS e gera um ponto JS correspondente. Então vamos dar uma pausa por aqui, e na próxima aula a gente continua para aprender a primeira coisa de TypeScript, como definir o tipo, tá? Então até mais.