Tdc2010 web
description
Transcript of Tdc2010 web
![Page 1: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/1.jpg)
Globalcode – Open4education
Javascript: A linguagem do futuroRamon Felipe de OliveiraAnalista de Sistema Softplan
SCJA - SCJP - SCWCD
![Page 2: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/2.jpg)
Globalcode – Open4education
Agenda
História Linguagens
Scripting X Não Scripting
Javascript
Patterns
Testes
ECMAScript 5
![Page 3: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/3.jpg)
Globalcode – Open4education
No começo... assembly
Baixo Nível
1 linha código = 1 instrução de máquina
Detalhes de máquina
![Page 4: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/4.jpg)
Globalcode – Open4education
Depois...
Linguagens de maior nível
Abstraem detalhes de máquina
Forte tipagem
Fortan, Algol e depois C, C++, java
![Page 5: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/5.jpg)
Globalcode – Open4education
Depois...
Um pouco menos eficientes
1 linha código = 5 instrução de máquina
1000 X 5000
![Page 6: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/6.jpg)
Globalcode – Open4education
Um pouco depois...
Scripting
Fraca tipagem
Interpretada
1 linha código = 20 instrução de máquina
![Page 7: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/7.jpg)
Globalcode – Open4education
Forte tipagem é bom?
Tipos ajudam a gerenciar complexidade
Permite otimização pela dimuição de verificação runtime
Importante com estruturas e algoritmos complexos
![Page 8: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/8.jpg)
Globalcode – Open4education
Scripting
Maior flexibilidade
Maior velocidade de desenvolvimento
Um pouco mais lentas
![Page 9: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/9.jpg)
Globalcode – Open4education
Cada macaco no seu ganho
SPLCriacão de componentes
Scripting União de componentes
![Page 10: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/10.jpg)
Globalcode – Open4education
Scriptings em ascensão?
Aumento da importância de GUI
Aumento da aplicabilidade
Internet
Linguagens scripting melhores
![Page 11: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/11.jpg)
Globalcode – Open4education
Caixa de Skinner
Skinner
“O problema com falsos padrões”
![Page 12: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/12.jpg)
Globalcode – Open4education
Comparativo desenvolvimento
![Page 13: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/13.jpg)
Globalcode – Open4education
![Page 14: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/14.jpg)
Globalcode – Open4education
Origens
Javascript surgiu em 1995 e quando lançado se chamava LiveScript
Brendan Eich
Brendan Eich
![Page 15: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/15.jpg)
Globalcode – Open4education
Características
Pequena
Interpretada (compilada)
Sofisticada
Linguagem cliente
Baixa tipagem
Objetos são “containers”
Herança por protótipos
![Page 16: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/16.jpg)
Globalcode – Open4education
Objeto em JS
![Page 17: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/17.jpg)
Globalcode – Open4education
Sintaxe Literal
var obj = {
nome: “Fusca",
detalhes: {
cor: “vermelho",
ano: 1988
}
}
![Page 18: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/18.jpg)
Globalcode – Open4education
Functions
![Page 19: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/19.jpg)
Globalcode – Open4education
Functions
![Page 20: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/20.jpg)
Globalcode – Open4education
Função add
function add(x, y) {
var total = x + y;
return total;
}
![Page 21: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/21.jpg)
Globalcode – Open4education
Função add
var add = function(x, y) {
var total = x + y;
return total;
}
![Page 22: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/22.jpg)
Globalcode – Open4education
![Page 23: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/23.jpg)
Globalcode – Open4education
function add() { var soma = 0;
for (var i = 0, j = arguments.length; i < j; i++) {
soma += arguments[i];
}
return soma;
}
![Page 24: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/24.jpg)
Globalcode – Open4education
Herança por Protótipo
![Page 25: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/25.jpg)
Globalcode – Open4education
Herança por Protótipo
![Page 26: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/26.jpg)
Globalcode – Open4education
Problema
![Page 27: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/27.jpg)
Globalcode – Open4education
function criarPessoa(nome, sobrenome) { return { nome: nome, sobrenome: sobrenome }}function nomeCompleto(pessoa) {
return pessoa.nome + ‘ ‘ + pessoa.sobrenome;
} function nomeCompletoInvertido(pessoa) {
return pessoa.sobrenome + ', ' + pessoa.nome;
}
Solução 1
![Page 28: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/28.jpg)
Globalcode – Open4education
> p = criarPessoa(“João", “Silva"); > nomeCompleto(p) João Silva> nomeCompletoInvertido(p) Silva, João
Apesar de funcionar, não é uma solução interessante.
Provavelmente, logo existirá dezenas de funções no global namespace.
![Page 29: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/29.jpg)
Globalcode – Open4education
function criarPessoa(nome, sobrenome) { return { nome: nome,
sobrenome : sobrenome, nomeCompleto: function() {
return this.nome + ‘ ‘ + this.sobrenome; }, nomeCompletoInvertido: function() { return this.sobrenome + ', ' + this.nome; } }}
Solução 2
![Page 30: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/30.jpg)
Globalcode – Open4education
> s = criarPessoa(“João", “Silva")> s. nomeCompleto() João Silva > s. nomeCompletoInvertido() Silva, João
![Page 31: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/31.jpg)
Globalcode – Open4education
Solução 3function Pessoa(nome, sobrenome) { this.nome = nome; this.sobrenome = sobrenome;}Pessoa.prototype.nomeCompleto = function() { return this.nome+ ' ' + this.sobrenome;}Pessoa.prototype.nomeCompletoInverso =
function() { return this.sobrenome + ', ' + this.nome;}
![Page 32: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/32.jpg)
Globalcode – Open4education
Prototype
![Page 33: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/33.jpg)
Globalcode – Open4education
Closures
function realizaSoma(a) {
return function(b) {
return a + b;
}
}
x = realizaSoma(5);
y = realizaSoma(20);
x(6) ? y(7) ?
![Page 34: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/34.jpg)
Globalcode – Open4education
Patterns
Old school
Revealing Pattern
Custom Objects
Module Pattern
Lazy Function Definition
![Page 35: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/35.jpg)
Globalcode – Open4education
Revealing Pattern
Ver Exemplo
![Page 36: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/36.jpg)
Globalcode – Open4education
TDD e javascript
JsUnit, um framework para teste de unidade JsUnit é um open source framework, inspirado no jUnit e escrito inteiramente em javascript
JsMock, um Mock Object Library para JavaScriptJSMock é um Mock Object library para JavaScript que fornece ferramentas necessárias para efetivos testes interativos.
![Page 37: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/37.jpg)
Globalcode – Open4education
ECMAScript 5
Strict Mode
Extensibilidade de objetos configuráveis
Suporte JSON
Principais browsers vão dar suporte integral
![Page 38: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/38.jpg)
Globalcode – Open4education
Perguntas?
![Page 39: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/39.jpg)
Globalcode – Open4education
` Obrigado!
![Page 40: Tdc2010 web](https://reader035.fdocumentos.com/reader035/viewer/2022062706/5573206bd8b42aae7b8b4c88/html5/thumbnails/40.jpg)
Globalcode – Open4education
Referências
http://docs.jquery.com
http://www.json.org/
http://developer.yahoo.com/yui/theater/
https://developer.mozilla.org/en/javascript
http://javascript.crockford.com/High Performance Web Sites :: Browser Performance Wishlist
Best Practices for Speeding Up Your Web Site
http://blog.dynatrace.com/2009/11/09/101-on-jquery-selector-performance/
http://www.artzstudio.com/2009/04/jquery-performance-rules/
http://www.tcl.tk/doc/scripting.html