Uma das perguntas frequentes que recebo é: qual é a diferença entre JavaScript e Typescript?
Vamos descobrir…
Desde o momento em que você começou a codificar, o JavaScript (JS) fazia parte de todos os seus projetos de front-end. Se você está um pouco familiarizado com JS, pense em TypeScript como JS mais alguns recursos adicionais que tornam seu aplicativo mais organizado e organizado. digitado. O typeScript foi desenvolvido como um projeto de código aberto pela Microsoft para tornar o desenvolvimento JS mais eficiente e detectar erros de compilação desde o início.
Neste artigo, discutiremos alguns recursos importantes do JavaScript e do TypeScript e as diferenças entre ambos. linguagens de script .
O que é JavaScript?
JavaScript é usado para scripts do lado do cliente. Você pode criar um script em uma página HTML ou criar um arquivo com uma extensão .js e incluí-lo em seu arquivo HTML. Um exemplo comum do mundo real em que você pode ver o JavaScript é a validação da página de login, onde é exibido um erro quando seu nome de usuário/senha está incorreto.
Vamos escrever um código JS simples e executá-lo no navegador:
Crie um arquivo example.html e adicione o seguinte código:
<script>
feeling = 'happy';
feeling = 23;
</script>Este código simples declara uma variável e atribui um valor de happy (string) a ela. Podemos atribuir um valor de um tipo diferente (número) à mesma variável. O JavaScript não reclamaria disso e podemos executar o código em qualquer navegador sem problemas. Agora, vamos obter o valor do sentimento do usuário:
Nosso HTML ficará assim:
<input type = "textbox" id = "howyoufeel">e o roteiro será:
feeling = document.getElementById("howyoufeel").value;A menos que coloquemos verificações explícitas no script, o JS aceitará qualquer valor do usuário e o transmitirá. Então, você pode colocar qualquer coisa como 234, @.#$%, etc. na variável de sentimento.
Recursos do JavaScript
Do exposto, podemos observar as seguintes características do JavaScript:
- Linguagem de script fracamente tipada
- Usado para scripts do lado do cliente e do lado do servidor (com node.js)
- Flexível e dinâmico
- Suportado por todos os principais navegadores
- Leve e interpretado
Se você estiver interessado em dominar o JavaScript, confira este curso udemy .
O que é TypeScript?
Um aplicativo do mundo real terá muitas validações e verificações dinâmicas. Para tais aplicativos, o código JavaScript se tornará difícil de testar em algum momento, principalmente porque não há verificação de tipo. Ao obter valores dos usuários, é importante obtê-los logo no início. É aqui que o TypeScript entra em cena.
TypeScript é fortemente digitado e tem um compilador que reclama se você não definir o tipo de uma variável.
Tanto o JavaScript quanto o TypeScript estão em conformidade com as especificações ECMAScript para uma linguagem de script. O Typescript pode executar todo o código JavaScript e suporta todas as suas bibliotecas – é por isso que é chamado de superconjunto do JavaScript.
Instalação do TypeScript
Para executar nosso código anterior em TypeScript, precisamos instalar o compilador TypeScript usando o pacote npm (se você tiver nó js ).
npm install -g typescriptou baixe-o diretamente do site oficial página de downloads da Microsoft . Você também pode usar o playground TS para ver como o código é transcompilado de ts para js.
Uma vez feito isso, você pode definir as configurações do projeto em tsconfig.json e usar qualquer IDE ou editor de texto para escrever código TypeScript e salvá-lo como .ts.
Você ainda pode escapar não definindo o tipo de variável e o TypeScript pode inferir o tipo de dados. No entanto, você obterá um erro de ‘feeling’ se fornecer algo diferente do primeiro tipo usado (no nosso caso, uma String) – durante a própria compilação.
É sempre bom que o código tenha uma anotação de tipo para manutenção e facilidade de uso:
var feeling: string = "happy";Não é isso!
O TypeScript fornece muitos outros recursos para facilitar a vida do desenvolvedor.
Características do TypeScript
O Typescript possui um rico conjunto de recursos e cada versão vem com novos recursos para tornar o desenvolvimento mais fácil do que antes. Por exemplo, com a nova versão (4.0), alguns recursos adicionais são tipos de tupla variáveis, fábricas JSX personalizadas, inferência de propriedade de classe de construtores, etc. Alguns recursos típicos do TypeScript são:
- Oferece suporte a conceitos de programação orientada a objetos, como interface, herança, classe. genéricos
- Detecção precoce de erros
- Suporte IDE com verificação de sintaxe e sugestões
- Mais fácil de depurar conforme é digitado
- Trans-compila em JavaScript
- Usado para aplicativos do lado do servidor e do lado do cliente
- Suporte multiplataforma e multibrowser
- Suporta todos os bibliotecas JS e extensões
Por que precisamos do TypeScript? (Vantagens do TypeScript sobre o JavaScript)
A Microsoft desenvolveu e usou o TypeScript por dois anos para seus projetos internos antes de torná-lo público em 2012. Eles criaram um JavaScript digitado porque era mais fácil testar o código para aplicativos empresariais de nível de produção. Você ainda pode usar os recursos de digitação dinâmica, mas também digitar as variáveis quando for realmente necessário.
Considere o código abaixo:
var mynum = //get from user;
addten(number){
return number + 10;
}Esperamos que o resultado seja sempre um número. Mas, e se um usuário der “ovelha”? A saída será sheep10 – idealmente, precisamos informar ao usuário que esta operação não é possível!
Além disso, quando você tem as informações de tipo disponíveis, os editores de texto e IDEs tornam-se mais fáceis de usar e salvar erros de tempo de execução. Também é mais fácil refatorar o código posteriormente.
Isso significa que não precisamos de JavaScript? (Desvantagens do TypeScript sobre o JavaScript)
Você pode pensar no TypeScript como uma extensão do JavaScript, mas certamente não como um substituto.
Para pedaços menores de código, o TypeScript pode se tornar uma sobrecarga – instalar, compilar, transcompilar será redundante. Com JavaScript, você pode simplesmente digitar seu script em HTML e ele funcionará. Também é mais fácil depurar o código quando você pode simplesmente atualizar o navegador toda vez que mudar alguma coisa.
Comparação frente a frente
Agora que entendemos os recursos e as vantagens do TypeScript e do JavaScript, vamos fazer mais comparações:
| TypeScript | JavaScript |
| Uma linguagem digitada que detecta erros de compilação desde o início | Você pode descobrir erros durante o tempo de execução |
| Adequado para grandes projetos, pois melhora a capacidade de manutenção e legibilidade do código | À medida que mais código é adicionado, torna-se difícil testar e depurar, portanto JS é adequado para pequenos projetos |
| Superconjunto de JS, ou seja, recursos como orientação a objetos, verificação de tipos e muito mais | Uma linguagem de script que oferece suporte à criação dinâmica de conteúdo da Web |
| Requer instalação do compilador e configuração | Não há necessidade de qualquer instalação; O código JS pode ser escrito diretamente em um navegador usando a tag Artigos relacionados |
