TDC2016SP - TypeScript em aplicações modernas
•Transferir como PPTX, PDF•
0 gostou•275 visualizações
TypeScript em aplicações modernas
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (7)
Destaque
Destaque (20)
Semelhante a TDC2016SP - TypeScript em aplicações modernas
Semelhante a TDC2016SP - TypeScript em aplicações modernas (20)
Mais de tdc-globalcode
Mais de tdc-globalcode (20)
Último
Último (20)
TDC2016SP - TypeScript em aplicações modernas
- 2. Papel do TypeScript em aplicações modernas
- 3. • MTAC • Web Developer desde 2010 • http://ntakashi.net/ • nicolas.tcs@hotmail.com • @ntakashics Nicolas Takashi
- 4. Agenda • História do JavaScript • Características do JavaScript • ES6 Funcionalidades • Como usar ES6 hoje? • JS prós e contras • História do TypeScript • Características do Typescript • Typescript Funcionalidades • TypeScript prós e contras • Demo
- 6. História do JavaScript • Desenvolvido pela Brendan Eich em 1995 • Nomes anteriores Mocha, LiveScript • Suportado pelo Netscape em 1996 • Microsoft criou JScript em 1996 • Novembro de 1996 surgiu o ECMAScript • Atualmente temos 6 versões do ECMAScript
- 8. Características do JavaScript • Paradigma Imperativo e Estruturado • Suporte a sintaxe de programação estruturada da linguagem C • Dinâmica • Tipagem dinâmica • Baseados em objetos • Avaliação em tempo de execução
- 9. Características do JavaScript • Funcional • Funções de primeira classe • Funções aninhadas • Baseada em protótipos • Protótipos: JS usa protótipos ao invés de classes para herança • Funções e métodos: Não existe distinção entre funções e métodos no JavaScript
- 11. ES6 Funcionalidades Constants Scoping Arrow Functions Extend Parameter Handling Template Literals Enhanced Regular Expression Enhanced Object Properties Destructuring Assignment Modules Classes Symbol Type Iterators Generators Map/Set & WeakMap/WeakSet Typed Arrays Promises Meta Programing Internationalization & Localization
- 12. Como usar ES6 hoje?
- 13. Como usar ES6 hoje? • Shim • Se desejamos usar apenas apenas novos objetos do ES6 tais como Promises, novas funções de string ou math, podemos utilizar Shim. • Basta adicionar o script ES6-Shim antes de seus scripts • Transpilers • Quando desejamos usar novas keywords, funções e objetos precisamos seguir o caminho dos transpilers: • Traceur • Babel • ShiftJS • TypeScript
- 14. JS prós e contras
- 15. JS prós e contras • Prós • Está presente em todos os lugares • Existe um numero incontável de bibliotecas • Flexível • Comunidade ativa e forte • Muito conteúdo de aprendizagem
- 16. JS prós e contras • Contras • Checagem em tempo de execução • Alto custo de manutenabilidade • Escopos só podem ser criados por funções • Conversão implícita • Prototypes – (Apenas confuso)
- 18. Hitória do TypeScript • Criada por Anders Hejlsber – Criador do C#, Delphi e Turbo Pascal • Primeira vez visto em outubro de 2012 • 2 anos depois foi elogiada pelo Miguel de Icaza • A partir de 2013 teve suporte em outras IDE’s e editores de texto • Eclipse • Emacs • VIM • Sublime
- 19. Hitória do TypeScript • 2013 teve a versão 0.9 com suporte a genéricos • 2014 sai a versão 1.0 junto com Visual Studio 2013 Update 2 • Utilizado em aplicações de larga escala
- 21. Características do TypeScript • Paradigmas • OOP • Estruturado • Imperativo • Funcional • Open source
- 23. TypeScript Funcionalidades Type annotations Compile time type checking Type inference Type erasure Interfaces Enumeraded Type Mixin Generic Namespaces Tuple Async / Await Classes Module Arrow function Optional Parameters Default Parameters
- 24. TypeScript prós e contras
- 25. TypeScript prós e contras • Prós • Checagem de tipo • Auxilio da IDE para refatoração • Baixo custo de manutenção • Fácil aprendizado para profissionais de linguagens estáticas
- 26. TypeScript prós e contras • Contras • Adição de mais um processo no desenvolvimento • Risco do desenvolvedor não estudar JavaScript • Typings
- 27. DEMO
- 28. Obrigado! E-mail: contato@lab1024.com.br Site: http://lab1024.com.br/ Twitter: http://twitter.com/lab1024 Facebook: http://fb.com/lab-1024
Notas do Editor
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w
- mkdir angular2-quickstart cd angular2-quickstart package.json tsconfig.json typings.json systemjs.config.json npm install npm start npm run tsc npm run tsc:w