SlideShare uma empresa Scribd logo
1 de 20
Javascript
Revolução na Web
História
Desenvolvido por Brendan Eich da Netscape sob o nome de Mocha.
Desenvolvida em pouco tempo, aproveitando características de outras linguagens
Nome mudou por uma estratégia de marketing da Netscape para aproveitar a
popularidade do recém-lançado Java. (Malditos)
Adquiriu ampla aceitação pelos navegadores como linguagem client-side
Microsoft usa JScript para evitar problemas de marca registrada
Hoje é mantida pela Mozilla Foundation
Padronização
Características
Tipificação fraca
Objetos
Funções
Escopo de variáveis
Closures
Herança prototípica
Tipificação Fraca
Objetos
 Simplesmente uma coleção de chaves e valores
 Tudo em Javascript são objetos: funções, arrays, expressões regulares etc
var cliente = new Object;
cliente.nome = "João";
cliente.sobrenome = "Silva";
console.log(cliente.nome + ' ' + cliente.sobrenome);
Objetos Literais
var cliente = {
nome: 'João',
telefones: {
residencial: '45323324',
celular: '948298388'
}
};
console.log(cliente["nome"]);
console.log(cliente.telefones.celular);
Funções
 Funções são objetos de primeira classe
 Podem ser armazenadas em varáveis:
var show = function (mensagem) {
console.log(mensagem);
};
show("Ola");
Funções
 Podem ser passadas por parâmetro:
function executarFuncao(funcao, texto) {
funcao(texto);
}
executarFuncao(alert, "Ola mundo");
Funções
 Podem ser retornadas por outras funções:
function alertar(mensagem) {
return function () { alert(mensagem); };
}
var showAlerta = alertar("ola mundo");
showAlerta();
Escopo de Variáveis
 Escopo global, escopo de função exterior e escopo local
 Todos objeto criado é colocado em um escopo global (péssimo)
var nome = 'João';//Escopo global (mesmo)
function ComporNome() {
var sobrenome = 'Silva'; //Escopo local
console.log(nome + ' ' + sobrenome);
}
Escopo de Variáveis
 Minimizando problema de variáveis globais
var app = {};
app.hotpoint = {
pessoa: {
nome: 'Joao'
}
};
console.log(app.hotpoint.pessoa.nome);
Closures
 Blocos de código que tem a capacidade de guardar o contexto no qual eles foram
criados, mesmo quando a função que criou esse bloco já saiu de escopo.
function geraSomador(numero) {
return function (x) { return x + numero; };
}
var soma5 = geraSomador(5);
console.log(soma5(5)); //10
Herança Prototípica
 Javascript não possui classes, todo objeto é ligado a um protótipo de outro objeto no
qual pode herdar propriedades.
 Todos objetos criado de literais são associados a Object.prototype
String.prototype.log = function () {
console.log(this.toString());
};
'ola mundo'.log();
Partes Ruins
==
'' == ‘0 false
0 == '' true
0 == ‘0' true
false == ‘false' false
false == ‘0' true
false == undefined false
false == null false
null == undefined true
‘ trb ‘ == 0 true
 Quando operadores de tipos
diferentes, tenta fazer a coversão
de tipo
 Usar sempre operador ternário:
=== !==
JSLint
 Ferramenta de qualidade de código.
 Ajuda a identificar problemas e retorna aonde estão os pontos problemáticos no
código
 Fundamental para garantir a qualidade do desenvolvimento
 Pode-se desligar algumas opções de análise
 http://www.jslint.com/
Conclusões
 Pode-se cumprir uma tarefa sem ter que conhecer muito a linguagem
 Conhecer a natureza da linguagem é fundamental para o desenvolvimento de
aplicações mais complexas
 Tipificação fraca induz ao erro, porém com prática e disciplina por parte do
programador torna-se libertadora
 Existem alguns erros de projeto na linguagem que podem ser contornados
 Ganhando mercado com novas tecnologias
Referências
 O Melhor do Javascript – Duglas Cockford
 Functional Javascript – Michael Fogus
 http://vimeo.com/30569658
 http://loopinfinito.com.br/
 http://javascriptbrasil.com/

Mais conteúdo relacionado

Mais procurados

Aprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCDAprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCDAfonso Gomes
 
Desvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptDesvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptRodrigo Branas
 
JavaScript: agora é sério
JavaScript: agora é sérioJavaScript: agora é sério
JavaScript: agora é sérioLuciano Ramalho
 
Desenvolvimento ágil de software com Ruby on Rails
Desenvolvimento ágil de software com Ruby on RailsDesenvolvimento ágil de software com Ruby on Rails
Desenvolvimento ágil de software com Ruby on RailsLucas Caton
 
Desenvolvimento em .Net - Programaçao Orientada a Objectos
Desenvolvimento em .Net - Programaçao Orientada a ObjectosDesenvolvimento em .Net - Programaçao Orientada a Objectos
Desenvolvimento em .Net - Programaçao Orientada a ObjectosVitor Silva
 
Curso de OO com C# - Parte 06 - ADO.NET
Curso de OO com C# - Parte 06 - ADO.NETCurso de OO com C# - Parte 06 - ADO.NET
Curso de OO com C# - Parte 06 - ADO.NETLeonardo Melo Santos
 
T04_LM3: Javascript (2013-2014)
T04_LM3: Javascript (2013-2014)T04_LM3: Javascript (2013-2014)
T04_LM3: Javascript (2013-2014)Carlos Santos
 
Node.JS - Campus Party Brasil 2011
Node.JS - Campus Party Brasil 2011Node.JS - Campus Party Brasil 2011
Node.JS - Campus Party Brasil 2011Emerson Macedo
 
JavaScript for Beginners
JavaScript for BeginnersJavaScript for Beginners
JavaScript for BeginnersSAPO Sessions
 
Curso Java Básico - Aula 01
Curso Java Básico - Aula 01Curso Java Básico - Aula 01
Curso Java Básico - Aula 01Natanael Fonseca
 
Curso de OO com C# - Parte 04 - Estruturas de controle e Strings
Curso de OO com C# - Parte 04 - Estruturas de controle e StringsCurso de OO com C# - Parte 04 - Estruturas de controle e Strings
Curso de OO com C# - Parte 04 - Estruturas de controle e StringsLeonardo Melo Santos
 
JavaScript - Expressões Regulares
JavaScript - Expressões RegularesJavaScript - Expressões Regulares
JavaScript - Expressões RegularesRodrigo Branas
 
Removendo o cheiro ruim do seu código - PHPSC Conf 2011
Removendo o cheiro ruim do seu código - PHPSC Conf 2011Removendo o cheiro ruim do seu código - PHPSC Conf 2011
Removendo o cheiro ruim do seu código - PHPSC Conf 2011Luís Cobucci
 

Mais procurados (20)

Curso javascript básico
Curso javascript básicoCurso javascript básico
Curso javascript básico
 
Aprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCDAprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCD
 
Desvendando a linguagem JavaScript
Desvendando a linguagem JavaScriptDesvendando a linguagem JavaScript
Desvendando a linguagem JavaScript
 
Java script
Java scriptJava script
Java script
 
JavaScript: agora é sério
JavaScript: agora é sérioJavaScript: agora é sério
JavaScript: agora é sério
 
Desenvolvimento ágil de software com Ruby on Rails
Desenvolvimento ágil de software com Ruby on RailsDesenvolvimento ágil de software com Ruby on Rails
Desenvolvimento ágil de software com Ruby on Rails
 
Desenvolvimento em .Net - Programaçao Orientada a Objectos
Desenvolvimento em .Net - Programaçao Orientada a ObjectosDesenvolvimento em .Net - Programaçao Orientada a Objectos
Desenvolvimento em .Net - Programaçao Orientada a Objectos
 
Curso de OO com C# - Parte 06 - ADO.NET
Curso de OO com C# - Parte 06 - ADO.NETCurso de OO com C# - Parte 06 - ADO.NET
Curso de OO com C# - Parte 06 - ADO.NET
 
Javascript OO
Javascript OOJavascript OO
Javascript OO
 
T04_LM3: Javascript (2013-2014)
T04_LM3: Javascript (2013-2014)T04_LM3: Javascript (2013-2014)
T04_LM3: Javascript (2013-2014)
 
Introdução ao JavaScript
Introdução ao JavaScriptIntrodução ao JavaScript
Introdução ao JavaScript
 
Ajax em java
Ajax em javaAjax em java
Ajax em java
 
Node.JS - Campus Party Brasil 2011
Node.JS - Campus Party Brasil 2011Node.JS - Campus Party Brasil 2011
Node.JS - Campus Party Brasil 2011
 
JavaScript for Beginners
JavaScript for BeginnersJavaScript for Beginners
JavaScript for Beginners
 
Curso Java Básico - Aula 01
Curso Java Básico - Aula 01Curso Java Básico - Aula 01
Curso Java Básico - Aula 01
 
Curso de OO com C# - Parte 04 - Estruturas de controle e Strings
Curso de OO com C# - Parte 04 - Estruturas de controle e StringsCurso de OO com C# - Parte 04 - Estruturas de controle e Strings
Curso de OO com C# - Parte 04 - Estruturas de controle e Strings
 
Código Limpo
Código LimpoCódigo Limpo
Código Limpo
 
JavaScript - Expressões Regulares
JavaScript - Expressões RegularesJavaScript - Expressões Regulares
JavaScript - Expressões Regulares
 
Removendo o cheiro ruim do seu código - PHPSC Conf 2011
Removendo o cheiro ruim do seu código - PHPSC Conf 2011Removendo o cheiro ruim do seu código - PHPSC Conf 2011
Removendo o cheiro ruim do seu código - PHPSC Conf 2011
 
Aula5
Aula5Aula5
Aula5
 

Semelhante a Javascript

Javascript para CSharpers 3 - Conceitos
Javascript para CSharpers 3 - ConceitosJavascript para CSharpers 3 - Conceitos
Javascript para CSharpers 3 - ConceitosWesley Lemos
 
Javascript para CSharpers 4 - POO
Javascript para CSharpers 4 - POOJavascript para CSharpers 4 - POO
Javascript para CSharpers 4 - POOWesley Lemos
 
Evolução e futuro do uso de paradigmas no JavaScript
Evolução e futuro do uso de paradigmas no JavaScriptEvolução e futuro do uso de paradigmas no JavaScript
Evolução e futuro do uso de paradigmas no JavaScriptJean Carlo Emer
 
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScript
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScriptTDC 2011 Goiânia: Evolução da linguagem de programação JavaScript
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScriptRogério Moraes de Carvalho
 
Javascript por debaixo dos panos
Javascript por debaixo dos panosJavascript por debaixo dos panos
Javascript por debaixo dos panosLaís Lima
 
(A11) LabMM3 - JavaScript - Subalgoritmos e scope
(A11) LabMM3 - JavaScript - Subalgoritmos e scope(A11) LabMM3 - JavaScript - Subalgoritmos e scope
(A11) LabMM3 - JavaScript - Subalgoritmos e scopeCarlos Santos
 
Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Romualdo Andre
 
Java - Introdução a banco de dados
Java - Introdução a banco de dadosJava - Introdução a banco de dados
Java - Introdução a banco de dadosSérgio Souza Costa
 
Javascript para CSharpers 2 - Functions
Javascript para CSharpers   2 - FunctionsJavascript para CSharpers   2 - Functions
Javascript para CSharpers 2 - FunctionsWesley Lemos
 
Desenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine OrmDesenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine OrmGuilherme Blanco
 
Minicurso javascript
Minicurso javascriptMinicurso javascript
Minicurso javascriptLucas Aquiles
 
Javascript para CSharpers 1 - Comparando
Javascript para CSharpers   1 - ComparandoJavascript para CSharpers   1 - Comparando
Javascript para CSharpers 1 - ComparandoWesley Lemos
 
Java - Visão geral e Exercícios
Java - Visão geral e ExercíciosJava - Visão geral e Exercícios
Java - Visão geral e ExercíciosArthur Emanuel
 
Linguagens Poo
Linguagens PooLinguagens Poo
Linguagens PooInfogenius
 

Semelhante a Javascript (20)

Javascript para CSharpers 3 - Conceitos
Javascript para CSharpers 3 - ConceitosJavascript para CSharpers 3 - Conceitos
Javascript para CSharpers 3 - Conceitos
 
Javascript para CSharpers 4 - POO
Javascript para CSharpers 4 - POOJavascript para CSharpers 4 - POO
Javascript para CSharpers 4 - POO
 
Javascript
JavascriptJavascript
Javascript
 
Evolução e futuro do uso de paradigmas no JavaScript
Evolução e futuro do uso de paradigmas no JavaScriptEvolução e futuro do uso de paradigmas no JavaScript
Evolução e futuro do uso de paradigmas no JavaScript
 
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScript
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScriptTDC 2011 Goiânia: Evolução da linguagem de programação JavaScript
TDC 2011 Goiânia: Evolução da linguagem de programação JavaScript
 
Javascript por debaixo dos panos
Javascript por debaixo dos panosJavascript por debaixo dos panos
Javascript por debaixo dos panos
 
JADE+JENA
JADE+JENAJADE+JENA
JADE+JENA
 
Desenvolvimento iOS
Desenvolvimento iOSDesenvolvimento iOS
Desenvolvimento iOS
 
(A11) LabMM3 - JavaScript - Subalgoritmos e scope
(A11) LabMM3 - JavaScript - Subalgoritmos e scope(A11) LabMM3 - JavaScript - Subalgoritmos e scope
(A11) LabMM3 - JavaScript - Subalgoritmos e scope
 
Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016
 
Java - Introdução a banco de dados
Java - Introdução a banco de dadosJava - Introdução a banco de dados
Java - Introdução a banco de dados
 
Javascript para CSharpers 2 - Functions
Javascript para CSharpers   2 - FunctionsJavascript para CSharpers   2 - Functions
Javascript para CSharpers 2 - Functions
 
Desenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine OrmDesenvolvimento Agil Com Doctrine Orm
Desenvolvimento Agil Com Doctrine Orm
 
Minicurso javascript
Minicurso javascriptMinicurso javascript
Minicurso javascript
 
Floggy-JustJava-2008-09-10
Floggy-JustJava-2008-09-10Floggy-JustJava-2008-09-10
Floggy-JustJava-2008-09-10
 
Javascript para CSharpers 1 - Comparando
Javascript para CSharpers   1 - ComparandoJavascript para CSharpers   1 - Comparando
Javascript para CSharpers 1 - Comparando
 
Java - Visão geral e Exercícios
Java - Visão geral e ExercíciosJava - Visão geral e Exercícios
Java - Visão geral e Exercícios
 
Java e orientação a objetos
Java e orientação a objetosJava e orientação a objetos
Java e orientação a objetos
 
Linguagens Poo
Linguagens PooLinguagens Poo
Linguagens Poo
 
Realtime com node.js e socket.io
Realtime com node.js e socket.ioRealtime com node.js e socket.io
Realtime com node.js e socket.io
 

Javascript

  • 3. História Desenvolvido por Brendan Eich da Netscape sob o nome de Mocha. Desenvolvida em pouco tempo, aproveitando características de outras linguagens Nome mudou por uma estratégia de marketing da Netscape para aproveitar a popularidade do recém-lançado Java. (Malditos) Adquiriu ampla aceitação pelos navegadores como linguagem client-side Microsoft usa JScript para evitar problemas de marca registrada Hoje é mantida pela Mozilla Foundation
  • 7. Objetos  Simplesmente uma coleção de chaves e valores  Tudo em Javascript são objetos: funções, arrays, expressões regulares etc var cliente = new Object; cliente.nome = "João"; cliente.sobrenome = "Silva"; console.log(cliente.nome + ' ' + cliente.sobrenome);
  • 8. Objetos Literais var cliente = { nome: 'João', telefones: { residencial: '45323324', celular: '948298388' } }; console.log(cliente["nome"]); console.log(cliente.telefones.celular);
  • 9. Funções  Funções são objetos de primeira classe  Podem ser armazenadas em varáveis: var show = function (mensagem) { console.log(mensagem); }; show("Ola");
  • 10. Funções  Podem ser passadas por parâmetro: function executarFuncao(funcao, texto) { funcao(texto); } executarFuncao(alert, "Ola mundo");
  • 11. Funções  Podem ser retornadas por outras funções: function alertar(mensagem) { return function () { alert(mensagem); }; } var showAlerta = alertar("ola mundo"); showAlerta();
  • 12. Escopo de Variáveis  Escopo global, escopo de função exterior e escopo local  Todos objeto criado é colocado em um escopo global (péssimo) var nome = 'João';//Escopo global (mesmo) function ComporNome() { var sobrenome = 'Silva'; //Escopo local console.log(nome + ' ' + sobrenome); }
  • 13. Escopo de Variáveis  Minimizando problema de variáveis globais var app = {}; app.hotpoint = { pessoa: { nome: 'Joao' } }; console.log(app.hotpoint.pessoa.nome);
  • 14. Closures  Blocos de código que tem a capacidade de guardar o contexto no qual eles foram criados, mesmo quando a função que criou esse bloco já saiu de escopo. function geraSomador(numero) { return function (x) { return x + numero; }; } var soma5 = geraSomador(5); console.log(soma5(5)); //10
  • 15. Herança Prototípica  Javascript não possui classes, todo objeto é ligado a um protótipo de outro objeto no qual pode herdar propriedades.  Todos objetos criado de literais são associados a Object.prototype String.prototype.log = function () { console.log(this.toString()); }; 'ola mundo'.log();
  • 17. == '' == ‘0 false 0 == '' true 0 == ‘0' true false == ‘false' false false == ‘0' true false == undefined false false == null false null == undefined true ‘ trb ‘ == 0 true  Quando operadores de tipos diferentes, tenta fazer a coversão de tipo  Usar sempre operador ternário: === !==
  • 18. JSLint  Ferramenta de qualidade de código.  Ajuda a identificar problemas e retorna aonde estão os pontos problemáticos no código  Fundamental para garantir a qualidade do desenvolvimento  Pode-se desligar algumas opções de análise  http://www.jslint.com/
  • 19. Conclusões  Pode-se cumprir uma tarefa sem ter que conhecer muito a linguagem  Conhecer a natureza da linguagem é fundamental para o desenvolvimento de aplicações mais complexas  Tipificação fraca induz ao erro, porém com prática e disciplina por parte do programador torna-se libertadora  Existem alguns erros de projeto na linguagem que podem ser contornados  Ganhando mercado com novas tecnologias
  • 20. Referências  O Melhor do Javascript – Duglas Cockford  Functional Javascript – Michael Fogus  http://vimeo.com/30569658  http://loopinfinito.com.br/  http://javascriptbrasil.com/