O que é TypeScript e por que devo usá-lo no lugar do JavaScript?[fechado]

Question

Fechado.Essa questão precisa ser mais focado.No momento não está aceitando respostas.

---

Quer melhorar esta questão? Atualize a pergunta para que ela se concentre em apenas um problema, editando esta postagem.

Fechado 2 anos atrás.

Você pode descrever o que é a linguagem TypeScript?

O que ele pode fazer que o JavaScript ou as bibliotecas disponíveis não podem fazer, que me daria motivos para considerá-lo?

Answer 1

Originalmente, escrevi essa resposta quando o TypeScript ainda estava quente com as prensas.Cinco anos depois, esta é uma visão geral do OK, mas olhe para Resposta de Lodewijk abaixo para mais profundidade

Vista de 1000 pés...

Texto datilografado é um superconjunto de JavaScript que fornece principalmente tipagem estática, classes e interfaces opcionais.Um dos grandes benefícios é permitir que os IDEs forneçam um ambiente mais rico para detectar erros comuns enquanto você digita o código.

Para ter uma ideia do que quero dizer, assista Vídeo introdutório da Microsoft no idioma.

Para um grande projeto JavaScript, a adoção do TypeScript pode resultar em um software mais robusto, ao mesmo tempo que pode ser implementado onde um aplicativo JavaScript normal seria executado.

É de código aberto, mas você só obtém o inteligente Intellisense enquanto digita se usar um IDE compatível.Inicialmente, este era apenas o Visual Studio da Microsoft (também mencionado na postagem do blog de Miguel de Icaza).Nos dias de hoje, outros IDEs também oferecem suporte a TypeScript.

Existem outras tecnologias semelhantes?

Há CaféScript, mas isso realmente serve a um propósito diferente.IMHO, CoffeeScript fornece legibilidade para humanos, mas TypeScript também fornece legibilidade profunda para ferramentas através de sua digitação estática opcional (veja isto postagem recente no blog para um pouco mais de crítica).Há também Dardo mas isso é um substituto completo para JavaScript (embora pode produzir código JavaScript)

Exemplo

Como exemplo, aqui está um TypeScript (você pode brincar com isso no Parque TypeScript)

class Greeter {
    greeting: string;
    constructor (message: string) {
        this.greeting = message;
    }
    greet() {
        return "Hello, " + this.greeting;
    }
}  

E aqui está o JavaScript que ele produziria

var Greeter = (function () {
    function Greeter(message) {
        this.greeting = message;
    }
    Greeter.prototype.greet = function () {
        return "Hello, " + this.greeting;
    };
    return Greeter;
})();

Observe como o TypeScript define o tipo de variáveis ​​de membro e parâmetros de método de classe.Isso é removido durante a tradução para JavaScript, mas é usado pelo IDE e pelo compilador para detectar erros, como passar um tipo numérico para o construtor.

Também é capaz de inferir tipos que não são explicitamente declarados, por exemplo, determinaria o greet() método retorna uma string.

Depurando TypeScript

Muitos navegadores e IDEs oferecem suporte direto à depuração por meio de mapas de origem.Veja esta pergunta do Stack Overflow para mais detalhes: Depurando código TypeScript com Visual Studio

Quer saber mais?

Eu escrevi esta resposta originalmente quando o TypeScript ainda estava em alta.Confira Resposta de Lodewijk a esta questão para obter alguns detalhes mais atuais.

Answer 2

A relação do TypeScript com JavaScript

O TypeScript é um supereset digitado de JavaScript que compila com JavaScript simples - typescriptlang.org.

JavaScript é uma linguagem de programação desenvolvida por Comitê Técnico da EMCA 39, que é um grupo de pessoas composto por muitas partes interessadas diferentes.TC39 é um comitê organizado por ECMA:uma organização de padrões internos.JavaScript tem muitas implementações diferentes por muitos fornecedores diferentes (por exemplo,Google, Microsoft, Oracle, etc.).O objetivo do JavaScript é ser a língua franca da web.

TypeScript é um superconjunto da linguagem JavaScript que possui um único compilador de código aberto e é desenvolvido principalmente por um único fornecedor:Microsoft.O objetivo do TypeScript é ajudar a detectar erros antecipadamente por meio de um sistema de tipos e tornar o desenvolvimento de JavaScript mais eficiente.

Essencialmente, o TypeScript atinge seus objetivos de três maneiras:

1. Suporte para recursos JavaScript modernos - A linguagem JavaScript (não o tempo de execução) é padronizada através do ECMAScript padrões.Nem todos os navegadores e tempos de execução JavaScript suportam todos os recursos de todos os padrões ECMAScript (veja isto visão geral).O TypeScript permite o uso de muitos dos recursos mais recentes do ECMAScript e os traduz para destinos ECMAScript mais antigos de sua escolha (veja a lista de compilar alvos debaixo de --target opção do compilador).Isso significa que você pode usar novos recursos com segurança, como módulos, funções lambda, classes, o operador de propagação e desestruturação, enquanto permanece compatível com versões anteriores de navegadores mais antigos e tempos de execução de JavaScript.

2. Sistema de tipo avançado - O suporte de tipo não faz parte do padrão ECMAScript e provavelmente nunca será devido à natureza interpretada em vez da natureza compilada do JavaScript.O sistema de tipos do TypeScript é incrivelmente rico e inclui:interfaces, enums, tipos híbridos, genéricos, tipos de união/interseção, modificadores de acesso e muito mais.O website oficial do TypeScript fornece uma visão geral desses recursos.O sistema de tipos do Typescript está no mesmo nível da maioria das outras linguagens digitadas e, em alguns casos, é indiscutivelmente mais poderoso.

3. Suporte de ferramentas para desenvolvedores - O compilador do TypeScript pode ser executado como um processo em segundo plano para oferecer suporte à compilação incremental e à integração IDE, para que você possa navegar mais facilmente, identificar problemas, inspecionar possibilidades e refatorar sua base de código.

A relação do TypeScript com outras linguagens de segmentação JavaScript

TypeScript tem uma filosofia única em comparação com outras linguagens que compilam para JavaScript.O código JavaScript é um código TypeScript válido;TypeScript é um superconjunto de JavaScript.Você quase pode renomear seu .js arquivos para .ts arquivos e comece a usar TypeScript (consulte "Interoperabilidade JavaScript" abaixo).Os arquivos TypeScript são compilados em JavaScript legível, de modo que a migração de volta seja possível e a compreensão do TypeScript compilado não seja nada difícil.O TypeScript baseia-se nos sucessos do JavaScript enquanto melhora seus pontos fracos.

Por um lado, você tem ferramentas preparadas para o futuro que pegam os padrões ECMAScript modernos e os compilam em versões mais antigas do JavaScript, sendo o Babel o mais popular.Por outro lado, você tem linguagens que podem ser totalmente diferentes do JavaScript direcionadas ao JavaScript, como CoffeeScript, Clojure, Dart, Elm, Haxe, Scala.js e muito mais (veja isto lista).Essas linguagens, embora possam ser melhores do que o futuro do JavaScript pode levar, correm um risco maior de não encontrar adoção suficiente para que seu futuro seja garantido.Você também pode ter mais dificuldade em encontrar desenvolvedores experientes para algumas dessas linguagens, embora aqueles que você encontrará possam ser mais entusiasmados.A interoperabilidade com JavaScript também pode ser um pouco mais complicada, já que está mais distante do que o JavaScript realmente é.

O TypeScript fica entre esses dois extremos, equilibrando assim o risco.TypeScript não é uma escolha arriscada por nenhum padrão.É preciso muito pouco esforço para se acostumar se você estiver familiarizado com JavaScript, já que não é uma linguagem completamente diferente, tem excelente suporte de interoperabilidade de JavaScript e tem visto muita adoção recentemente.

Opcionalmente, digitação estática e inferência de tipo

JavaScript é digitado dinamicamente.Isso significa que o JavaScript não sabe que tipo é uma variável até que ela seja realmente instanciada em tempo de execução.Isso também significa que pode ser tarde demais.TypeScript adiciona suporte de tipo ao JavaScript.Bugs causados ​​​​por falsas suposições de que alguma variável é de um determinado tipo podem ser completamente erradicados se você jogar as cartas corretamente (o quão rigoroso você digita seu código ou se você digita seu código depende de você).

TypeScript torna a digitação um pouco mais fácil e menos explícita pelo uso de inferência de tipo.Por exemplo: var x = "hello" em TypeScript é o mesmo que var x : string = "hello".O tipo é simplesmente inferido de seu uso.Mesmo que você não digite explicitamente os tipos, eles ainda estarão lá para evitar que você faça algo que, de outra forma, resultaria em um erro em tempo de execução.

TypeScript é opcionalmente digitado por padrão.Por exemplo function divideByTwo(x) { return x / 2 } é uma função válida em TypeScript que pode ser chamada com qualquer tipo de parâmetro, mesmo que chamá-lo com uma string obviamente resulte em um tempo de execução erro.Assim como você está acostumado em JavaScript.Isso funciona porque quando nenhum tipo foi atribuído explicitamente e o tipo não pôde ser inferido, como no exemplo divideByTwo, o TypeScript atribuirá implicitamente o tipo any.Isso significa que a assinatura de tipo da função divideByTwo se torna automaticamente function divideByTwo(x : any) : any.Existe um sinalizador do compilador para proibir esse comportamento: --noImplicitAny.Ativar esse sinalizador oferece um maior grau de segurança, mas também significa que você terá que digitar mais.

Os tipos têm um custo associado a eles.Em primeiro lugar, há uma curva de aprendizado e, em segundo lugar, é claro, também custará um pouco mais de tempo para configurar uma base de código usando a digitação estrita adequada.Na minha experiência, esses custos valem totalmente a pena em qualquer base de código séria que você compartilhe com outras pessoas. Um estudo em larga escala de linguagens de programação e qualidade de código no Github sugere que "linguagens de tipo estaticamente, em geral, são menos propensas a defeitos do que os tipos dinâmicos, e essa digitação forte é melhor do que a digitação fraca no mesmo aspecto".

É interessante notar que este mesmo artigo conclui que o TypeScript é menos sujeito a erros do que o JavaScript:

Para aqueles com coeficientes positivos, podemos esperar que o idioma esteja associado a Ceteris paribus, um número maior de correções de defeitos.Essas linguagens incluem C, C++, JavaScript, Objective-C, PHP e Python.As linguagens Clojure, Haskell, Ruby, Scala e Texto datilografado, todos têm coeficientes negativos, o que implica que esses idiomas são menos propensos que a média de resultar em compromissos de fixação de defeitos.

Suporte IDE aprimorado

A experiência de desenvolvimento com TypeScript é uma grande melhoria em relação ao JavaScript.O IDE é informado em tempo real pelo compilador TypeScript sobre suas informações de tipo rico.Isso oferece algumas vantagens importantes.Por exemplo, com TypeScript, você pode refatorar com segurança, como renomear toda a sua base de código.Por meio do preenchimento de código, você pode obter ajuda embutida sobre quaisquer funções que uma biblioteca possa oferecer.Não há mais necessidade de lembrá-los ou procurá-los em referências online.Erros de compilação são relatados diretamente no IDE com uma linha vermelha ondulada enquanto você está ocupado codificando.Resumindo, isso permite um ganho significativo de produtividade em comparação ao trabalho com JavaScript.Pode-se gastar mais tempo codificando e menos tempo depurando.

Existe uma grande variedade de IDEs que possuem excelente suporte para TypeScript, como Visual Studio Code, WebStorm, Atom e Sublime.

Verificações nulas estritas

Erros de tempo de execução do formulário cannot read property 'x' of undefined ou undefined is not a function são muito comumente causados ​​por bugs no código JavaScript.O TypeScript pronto para uso já reduz a probabilidade de ocorrência desses tipos de erros, uma vez que não se pode usar uma variável que não seja conhecida pelo compilador TypeScript (com exceção das propriedades de any variáveis ​​digitadas).Ainda é possível utilizar erroneamente uma variável definida como undefined.No entanto, com a versão 2.0 do TypeScript você pode eliminar esses tipos de erros por meio do uso de tipos não anuláveis.Isso funciona da seguinte maneira:

Com verificações nulas estritas ativadas (--strictNullChecks sinalizador do compilador) o compilador TypeScript não permitirá undefined a ser atribuído a uma variável, a menos que você declare explicitamente que ela é do tipo anulável.Por exemplo, let x : number = undefined resultará em um erro de compilação.Isso se encaixa perfeitamente com a teoria dos tipos, uma vez que undefined não é um número.Pode-se definir x ser um tipo de soma de number e undefined para corrigir isso: let x : number | undefined = undefined.

Uma vez que um tipo é conhecido como anulável, o que significa que é de um tipo que também pode ter o valor null ou undefined, o compilador TypeScript pode determinar, por meio da análise de tipo baseada em fluxo de controle, se seu código pode ou não usar uma variável com segurança.Em outras palavras, quando você verifica se uma variável é undefined através, por exemplo, de um if declaração, o compilador TypeScript inferirá que o tipo naquela ramificação do fluxo de controle do seu código não é mais anulável e, portanto, pode ser usado com segurança.Aqui está um exemplo simples:

let x: number | undefined;
if (x !== undefined) x += 1; // this line will compile, because x is checked.
x += 1; // this line will fail compilation, because x might be undefined.

Durante a construção, o co-designer da conferência TypeScript de 2016, Anders Hejlsberg, deu uma explicação detalhada e uma demonstração desse recurso: vídeo (das 44h30 às 56h30).

Compilação

Para usar o TypeScript, você precisa de um processo de construção para compilar o código JavaScript.O processo de construção geralmente leva apenas alguns segundos, dependendo, é claro, do tamanho do seu projeto.O compilador TypeScript suporta compilação incremental (--watch sinalizador do compilador) para que todas as alterações subsequentes possam ser compiladas em maior velocidade.

O compilador TypeScript pode incorporar informações do mapa de origem nos arquivos .js gerados ou criar arquivos .map separados.As informações do mapa de origem podem ser usadas por utilitários de depuração como o Chrome DevTools e outros IDEs para relacionar as linhas no JavaScript com aquelas que as geraram no TypeScript.Isso possibilita definir pontos de interrupção e inspecionar variáveis ​​durante o tempo de execução diretamente em seu código TypeScript.As informações do mapa de origem funcionam muito bem, já existiam muito antes do TypeScript, mas a depuração do TypeScript geralmente não é tão boa quanto ao usar o JavaScript diretamente.Levar a this palavra-chave, por exemplo.Devido à mudança semântica do this palavra-chave sobre fechamentos desde ES2015, this pode realmente existir durante o tempo de execução como uma variável chamada _this (ver esta resposta).Isso pode confundi-lo durante a depuração, mas geralmente não é um problema se você souber disso ou inspecionar o código JavaScript.Deve-se notar que Babel sofre exatamente o mesmo tipo de problema.

Existem alguns outros truques que o compilador TypeScript pode fazer, como gerar código de interceptação com base em decoradores, gerando código de carregamento de módulo para diferentes sistemas de módulo e análise JSX.No entanto, você provavelmente precisará de uma ferramenta de construção além do compilador Typescript.Por exemplo, se quiser compactar seu código, você terá que adicionar outras ferramentas ao seu processo de construção para fazer isso.

Existem plug-ins de compilação TypeScript disponíveis para Webpack, Gole, Grunhido e praticamente qualquer outra ferramenta de construção de JavaScript disponível no mercado.A documentação do TypeScript tem uma seção sobre integração com ferramentas de construção cobrindo todos eles.A linter também está disponível caso você queira ainda mais verificação do tempo de construção.Há também um grande número de projetos iniciais que permitirão que você comece a usar TypeScript em combinação com várias outras tecnologias como Angular 2, React, Ember, SystemJS, Webpack, Gulp, etc.

Interoperabilidade JavaScript

Como o TypeScript está intimamente relacionado ao JavaScript, ele possui grandes recursos de interoperabilidade, mas é necessário algum trabalho extra para trabalhar com bibliotecas JavaScript no TypeScript. Definições de TypeScript são necessários para que o compilador TypeScript entenda que chamadas de função como _.groupBy ou angular.copy ou $.fadeOut não são de fato declarações ilegais.As definições para essas funções são colocadas em .d.ts arquivos.

A forma mais simples que uma definição pode assumir é permitir que um identificador seja usado de qualquer forma.Por exemplo, ao usar Lodash, um arquivo de definição de linha única declare var _ : any permitirá que você chame qualquer função que desejar _, mas é claro que você ainda pode cometer erros: _.foobar() seria uma chamada TypeScript legal, mas é, obviamente, uma chamada ilegal em tempo de execução.Se você deseja suporte de tipo adequado e conclusão de código, seu arquivo de definição precisa ser mais exato (consulte definições de lodash Por exemplo).

Módulos Npm que vêm pré-empacotados com suas próprias definições de tipo são automaticamente compreendidos pelo compilador TypeScript (consulte documentação).Para praticamente qualquer outra biblioteca JavaScript semi-popular que não inclua suas próprias definições, alguém já disponibilizou definições de tipo por meio de outro módulo npm.Esses módulos são prefixados com "@types/" e vêm de um repositório Github chamado Definitivamente digitado.

Há uma ressalva:as definições de tipo devem corresponder à versão da biblioteca que você está usando em tempo de execução.Caso contrário, o TypeScript pode impedir que você chame uma função ou desreferencia uma variável que existe ou permitir que você chame uma função ou desreferencia uma variável que não existe, simplesmente porque os tipos não correspondem ao tempo de execução em tempo de compilação .Portanto, certifique-se de carregar a versão correta das definições de tipo para a versão correta da biblioteca que você está usando.

Para ser honesto, há um pequeno incômodo nisso e pode ser um dos motivos pelos quais você não escolhe o TypeScript, mas sim algo como Babel, que não sofre com a necessidade de obter definições de tipo.Por outro lado, se você souber o que está fazendo, poderá facilmente superar qualquer tipo de problema causado por arquivos de definição incorretos ou ausentes.

Convertendo de JavaScript para TypeScript

Qualquer .js arquivo pode ser renomeado para um .ts arquivo e executei o compilador TypeScript para obter sintaticamente o mesmo código JavaScript como saída (se ele estivesse sintaticamente correto em primeiro lugar).Mesmo quando o compilador TypeScript obtiver erros de compilação, ele ainda produzirá um .js arquivo.Pode até aceitar .js arquivos como entrada com o --allowJs bandeira.Isso permite que você comece com TypeScript imediatamente.Infelizmente, é provável que ocorram erros de compilação no início.É preciso lembrar que esses não são erros que interrompem o show, como você pode estar acostumado com outros compiladores.

Os erros de compilação que ocorrem no início ao converter um projeto JavaScript em um projeto TypeScript são inevitáveis ​​pela natureza do TypeScript.Verificações de TypeScript todos código para validade e, portanto, precisa saber sobre todas as funções e variáveis ​​​​que são usadas.Portanto, as definições de tipo precisam estar em vigor para todos eles, caso contrário, erros de compilação poderão ocorrer.Como mencionado no capítulo acima, para praticamente qualquer framework JavaScript existem .d.ts arquivos que podem ser facilmente adquiridos com a instalação do Pacotes DefinitelyTyped.No entanto, pode ser que você tenha usado alguma biblioteca obscura para a qual nenhuma definição TypeScript esteja disponível ou que você tenha preenchido algumas primitivas JavaScript.Nesse caso, você deve fornecer definições de tipo para esses bits para que os erros de compilação desapareçam.Basta criar um .d.ts arquivo e incluí-lo no arquivo tsconfig.json files array, para que seja sempre considerado pelo compilador TypeScript.Nele, declare aqueles bits que o TypeScript não conhece como tipo any.Depois de eliminar todos os erros, você poderá introduzir gradualmente a digitação nessas partes de acordo com suas necessidades.

Também será necessário algum trabalho na (re)configuração do pipeline de construção para colocar o TypeScript no pipeline de construção.Conforme mencionado no capítulo sobre compilação, existem muitos recursos bons por aí e eu o encorajo a procurar projetos iniciais que usem a combinação de ferramentas com as quais você deseja trabalhar.

O maior obstáculo é a curva de aprendizado.Eu encorajo você a brincar com um pequeno projeto primeiro.Veja como funciona, como constrói, quais arquivos utiliza, como está configurado, como funciona no seu IDE, como está estruturado, quais ferramentas utiliza, etc.A conversão de uma grande base de código JavaScript em TypeScript é possível quando você sabe o que está fazendo.Leia este blog, por exemplo, em convertendo 600 mil linhas em texto digitado em 72 horas).Apenas certifique-se de ter um bom domínio do idioma antes de pular.

Adoção

TypeScript é de código aberto (licenciado pelo Apache 2, consulte GitHub) e apoiado pela Microsoft. Anders Hejlsberg, o arquiteto-chefe do C# está liderando o projeto.É um projeto muito ativo;a equipe do TypeScript tem lançado muitos recursos novos nos últimos anos e muitos recursos excelentes ainda estão planejados para vir (veja o roteiro).

Alguns fatos sobre adoção e popularidade:

• No Pesquisa de desenvolvedores StackOverflow 2017 TypeScript foi o transpilador JavaScript mais popular (9º lugar geral) e conquistou o terceiro lugar na categoria de linguagem de programação mais amada.
• No Pesquisa sobre o estado de js 2018 TypeScript foi declarado um dos dois grandes vencedores na categoria de sabores de JavaScript (com ES6 sendo o outro).
• No Pesquisa de deverloper StackOverlow 2019 TypeScript subiu para o 9º lugar entre as linguagens mais populares entre os desenvolvedores profissionais, ultrapassando C e C++.Mais uma vez ficou em terceiro lugar entre as línguas mais apreciadas.

Answer 3

Typycript faz algo semelhante ao que menos ou sass faz para CSS.Eles são super sets disso, o que significa que cada código JS que você escreve é válido código typycript.Além disso, você pode usar as outras guloseimas que adiciona ao idioma e o código transpilado será válido JS.Você pode até definir a versão JS que deseja que seu código resultante.

Atualmente, o Typy Typycript é um super conjunto de ES2015, portanto, pode ser uma boa opção para começar a aprender os novos recursos do JS e transpile para o padrão necessário para o seu projeto.

Answer 4

" Fundamentos Typycript " - um curso de vídeo pluralsight por Dan Wahlin e John PapA é muito bom, atualmente (25 de março de 2016) atualizado para refletir o Typycript 1.8, introdução ao dicotante.

para mim as características realmente boas, ao lado das agradáveis possibilidades de intellisense, são as classes , interfaces , módulos , a facilidade de implementaçãoAMD e a possibilidade de usar o depurador do Visual Studio Typstript quando invocado com o IE.

Para resumir : Se usado como pretendido, o texto digital pode fazer a programação do JavaScript mais confiável e mais fácil.Pode aumentar a produtividade do programador JavaScript significativamente ao longo do SDLC completo.

Answer 5

ecma script 5 (ES5) que todo o suporte do navegador e pré-compilado.ES6 / ES2015 e ES / 2016 veio este ano com muitas mudanças, portanto, para aparecer essas mudanças, há algo entre o qual deve levar se preocupações sobre typyscript.

• Typycript é Tipos -> significa que temos que definir o tipo de dados de cada propriedade e métodos.Se você sabe que o typycript é fácil de entender.

• Grande vantagem do Typycript é que são questões relacionadas com o tipo de identidade antes de ir para a produção.Isso permite que os testes unitários falhem se houver alguma incompatibilidade de tipo.