SlideShare una empresa de Scribd logo
1 de 34
Império JavaScript
Romualdo André da Costa
Analista de TI - UFRB
Sumário
Um pouco de história
Características
Como isso funciona?
Declarando uma variável
Expressões
Template strings
Laços
Decisões
Arrays
Sumário
Destructuring assignment
Funções
Usando JavaScript
DOM
Interação entre JavaScript e DOM
Um pouco de história
No início as páginas eram estáticas
Um pouco de história
Brendan Eich
Um pouco de história
Mocha → LiveScript → JavaScript
Netscape 2.0: 1995
Baseado em ECMAScript
Características
Imperativa e Estruturada
Tipagem Dinâmica
Baseada em objetos
Funcional: funções são objetos de primeira classe.
Vários ambientes: web, desktop, servidor, IoT
Como funciona?
Declarando uma variável
Comece o nome com uma letra, _ ou $
Depois use qualquer letra, número, _, $
Evite as palavras reservadas
Escolha nomes significativos
CamelCase
Use $ e _ apenas com bom motivo: convenção utilizada em
algumas bibliotecas
Declarando uma variável
episodes=7;
floatNumber=3.14;
name=”Skywalker”;
isPunkDead=false;
var starFighter;
Declarando uma variável
const: significa que a variável não pode ser alterada.
let: variável pode ser alterada no algoritmo.
var: é a forma mais “fraca” de definir uma variável em
JavaScript.
Hoisting
foo = 2
var foo;
// é implicitamente entendido como:
var foo;
foo = 2;
hoisted(); // logs "foo"
function hoisted() {
console.log("foo");
}
Expressões
var scoop+=1;
var x=Math.random()*10;
var selic=10.15;
var isGood=selic>10;
var greeting=”Hello ”+name;
Template Strings
Antigamente
a=15;
b=19;
console.log(“Quinze é ”+(a+b));
Agora
console.log(`Quinze é ${a+b}`);
Laços
var enemys=10;
while(enemys>0){
console.log(`Restam ${enemys} inimigos do Império.`)
enemys=enemys-1;
}
Laços
for(let cups=1;cups<3;cups++){
console.log(‘Bebi ${cups} de cerveja.’);
}
alert(‘Não dirija’);
Decisões
var hour=8;
if(hour < 9){
alert('Chegou cedo!');
}
else if(hour == 9){
alert('na hora!');
}
else{
alert('Atrasado!');
}
Array
var sabores=new Array();
sabores[0]='chocolate';
sabores[1]='creme';
sabores[3]='limão';
var androids=[16,17,18,19,20,30,40,44,50,60,70,71];
var mix=['a',true,4.67];
Array
let iterable=[10,20,30];
for(let value of iterable){
console.log(value);
}
iterable.forEach(function (item,index,array){
console.log(item,index);
});
Arrays
var hunters=["Boba Fett","Jango Fett"];
var newLength=hunters.push("Bossk");
var last=hunters.pop();
var first=hunters.shift();
var newLength=hunters.unshift("Cad Bane");
var pos=hunters.indexOf("Cad Bane");
var removedHunter=hunters.splice(pos,1);
var shallowCopy=hunters.slice();
Destructuring assignment
var a,b,rest;
[a,b]=[1,2];
console.log(a,b);
[a,b,...rest]=[1,2,3,4,5];
console.log(a);
console.log(b);
console.log(rest);
Funções
function soma(a,b){
return a+b;
}
console.log(soma(3,4));
var pula=function (){
console.log('pulei!');
}
pula();
Funções
function compara(comparador){
var c=4,d=5;
console.log(comparador(c,d));
}
//função anônima
compara(function(a,b){return a<b});
Funções
//função anônima
compara(function (a, b) {
return a < b
});
compara((a, b) => a < b);
Funções
function fun1(...args){
console.log(args.length);
}
function fun2(a,b,..args){
console.log(args.length);
}
Funções
function funDefault(a=1,b=2){
console.log(a+b);
}
Objeto
var deathStar={
energy: 100,
model: 'DS-1 Orbital Battle Station',
shoot(){
console.log(" ,_~"""~-,n*---====*)------`,n |===========|n
`,---------,'n ~-.___.-~ ");
}
}
Usando JavaScript
O script pode ficar dentro do <head>
Referenciar um arquivo separado dentro do <head>
Colocar o script ou a referencia ao arquivo dentro do <body>
Exemplo nos arquivos hello.html e hello.js
DOM
Interação entre JavaScript e DOM
Ver arquivos hello.html e hello.js
Referências
Head First: HTML5 Programming
JavaScript: a bíblia
World Wide Web: Como programar
Site: www.codecademy.com
Site: https://developer.mozilla.org/pt-BR/docs/Web/JavaScript
Use o código JSDAY e ganhe 25% desconto em
todo o site da Novatec até dia 07/08/17.
www.programadorfeirense.com.br/blog
Império JavaScript

Más contenido relacionado

La actualidad más candente

Aprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCDAprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCD
Afonso Gomes
 

La actualidad más candente (20)

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
 
Switchcase
SwitchcaseSwitchcase
Switchcase
 
Introdução ao JavaScript
Introdução ao JavaScriptIntrodução ao JavaScript
Introdução ao JavaScript
 
Aprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCDAprender Javascript e jQuery (UFCD
Aprender Javascript e jQuery (UFCD
 
Vim
VimVim
Vim
 
Curso de OO com C# - Parte 05 - Coleções genéricas e não-genéricas
Curso de OO com C# - Parte 05 - Coleções genéricas e não-genéricasCurso de OO com C# - Parte 05 - Coleções genéricas e não-genéricas
Curso de OO com C# - Parte 05 - Coleções genéricas e não-genéricas
 
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
 
Introdução a JavaScript
Introdução a JavaScriptIntrodução a JavaScript
Introdução a JavaScript
 
PowerShell
PowerShellPowerShell
PowerShell
 
Algoritmos e Estrutura de Dados - Aula 04
Algoritmos e Estrutura de Dados - Aula 04Algoritmos e Estrutura de Dados - Aula 04
Algoritmos e Estrutura de Dados - Aula 04
 
Ruby - Criando código para máquinas e humanos
Ruby - Criando código para máquinas e humanosRuby - Criando código para máquinas e humanos
Ruby - Criando código para máquinas e humanos
 
JavaScript
JavaScriptJavaScript
JavaScript
 
Python Introdução
Python IntroduçãoPython Introdução
Python Introdução
 
Javascript
JavascriptJavascript
Javascript
 
Tópicos avançados em JSF
Tópicos avançados em JSFTópicos avançados em JSF
Tópicos avançados em JSF
 
Revista programar php -iniciação
Revista programar php -iniciaçãoRevista programar php -iniciação
Revista programar php -iniciação
 
Curso de Shell Script 10/11
Curso de Shell Script 10/11Curso de Shell Script 10/11
Curso de Shell Script 10/11
 
Estrutura de Dados - Aula 08
Estrutura de Dados - Aula 08Estrutura de Dados - Aula 08
Estrutura de Dados - Aula 08
 
Java hidden features
Java hidden featuresJava hidden features
Java hidden features
 
DOJO - TDD com C++
DOJO - TDD com C++DOJO - TDD com C++
DOJO - TDD com C++
 

Similar a Império JavaScript

Introdução ao JS1.pptx
Introdução ao JS1.pptxIntrodução ao JS1.pptx
Introdução ao JS1.pptx
LuanDev1
 
Curso de introdução ao ruby
Curso de introdução ao rubyCurso de introdução ao ruby
Curso de introdução ao ruby
Francis Wagner
 
Javascript para CSharpers 1 - Comparando
Javascript para CSharpers   1 - ComparandoJavascript para CSharpers   1 - Comparando
Javascript para CSharpers 1 - Comparando
Wesley Lemos
 
Introdução a Linguagem C
Introdução a Linguagem CIntrodução a Linguagem C
Introdução a Linguagem C
apolllorj
 

Similar a Império JavaScript (20)

Introdução ao JavaScript e DOM
Introdução ao JavaScript e DOMIntrodução ao JavaScript e DOM
Introdução ao JavaScript e DOM
 
Introdução ao JS1.pptx
Introdução ao JS1.pptxIntrodução ao JS1.pptx
Introdução ao JS1.pptx
 
Curso de introdução ao ruby
Curso de introdução ao rubyCurso de introdução ao ruby
Curso de introdução ao ruby
 
Object Oriented Programming
Object Oriented ProgrammingObject Oriented Programming
Object Oriented Programming
 
Introdução à MEAN Stack
Introdução à MEAN StackIntrodução à MEAN Stack
Introdução à MEAN Stack
 
PHP
PHPPHP
PHP
 
Gems para colocar seus testes no trilho
Gems para colocar seus testes no trilho Gems para colocar seus testes no trilho
Gems para colocar seus testes no trilho
 
Javascript para CSharpers 1 - Comparando
Javascript para CSharpers   1 - ComparandoJavascript para CSharpers   1 - Comparando
Javascript para CSharpers 1 - Comparando
 
Linguagem R
Linguagem RLinguagem R
Linguagem R
 
iOS 8 com swift
iOS 8 com swiftiOS 8 com swift
iOS 8 com swift
 
Javascript - boas práticas
Javascript - boas práticasJavascript - boas práticas
Javascript - boas práticas
 
Introdução a Linguagem C
Introdução a Linguagem CIntrodução a Linguagem C
Introdução a Linguagem C
 
Comandos e expressões
Comandos e expressõesComandos e expressões
Comandos e expressões
 
Curso de Shell Script 09/11
Curso de Shell Script 09/11Curso de Shell Script 09/11
Curso de Shell Script 09/11
 
Curso de PostgreSQL: Um pouco Além dos Comandos
Curso de PostgreSQL: Um pouco Além dos ComandosCurso de PostgreSQL: Um pouco Além dos Comandos
Curso de PostgreSQL: Um pouco Além dos Comandos
 
Introdução ao Desenvolvimento WEB com Ruby on Rails
Introdução ao Desenvolvimento WEB com Ruby on RailsIntrodução ao Desenvolvimento WEB com Ruby on Rails
Introdução ao Desenvolvimento WEB com Ruby on Rails
 
Javase next
Javase nextJavase next
Javase next
 
Precisamos falar sobre MERN stack
Precisamos falar sobre MERN stackPrecisamos falar sobre MERN stack
Precisamos falar sobre MERN stack
 
Algop - aula 04 pascal 1
Algop - aula 04 pascal 1Algop - aula 04 pascal 1
Algop - aula 04 pascal 1
 
Conexão Java 2012 - Orientação a Objetos das Galáxias
Conexão Java 2012 - Orientação a Objetos das GaláxiasConexão Java 2012 - Orientação a Objetos das Galáxias
Conexão Java 2012 - Orientação a Objetos das Galáxias
 

Más de Romualdo Andre

Más de Romualdo Andre (18)

Web, híbrido, cross compiled ou nativo: qual escolher?
Web, híbrido, cross compiled ou nativo: qual escolher?Web, híbrido, cross compiled ou nativo: qual escolher?
Web, híbrido, cross compiled ou nativo: qual escolher?
 
Python Class
Python ClassPython Class
Python Class
 
Dúvidas e respostas sobre carreira de TI: serviço público
Dúvidas e respostas sobre carreira de TI: serviço públicoDúvidas e respostas sobre carreira de TI: serviço público
Dúvidas e respostas sobre carreira de TI: serviço público
 
Tendências 2018
Tendências 2018Tendências 2018
Tendências 2018
 
Codelab HTML e CSS
Codelab HTML e CSSCodelab HTML e CSS
Codelab HTML e CSS
 
Angular 2 Básico
Angular 2 BásicoAngular 2 Básico
Angular 2 Básico
 
Codelab: TypeScript
Codelab: TypeScriptCodelab: TypeScript
Codelab: TypeScript
 
Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016Introdução JavaScript e DOM 2016
Introdução JavaScript e DOM 2016
 
Facilite a vida com guava
Facilite a vida com guavaFacilite a vida com guava
Facilite a vida com guava
 
Web, híbrido, cross compiled ou nativo: qual escolher?
Web, híbrido, cross compiled ou nativo: qual escolher?Web, híbrido, cross compiled ou nativo: qual escolher?
Web, híbrido, cross compiled ou nativo: qual escolher?
 
Android Studio: Primeiros Passos
Android Studio: Primeiros PassosAndroid Studio: Primeiros Passos
Android Studio: Primeiros Passos
 
Introdução JavaScript e DOM
Introdução JavaScript e DOMIntrodução JavaScript e DOM
Introdução JavaScript e DOM
 
Corrigindo o vestibular com Python e OpenCV
Corrigindo o vestibular com Python e OpenCVCorrigindo o vestibular com Python e OpenCV
Corrigindo o vestibular com Python e OpenCV
 
O programador e o super carro
O programador e o super carroO programador e o super carro
O programador e o super carro
 
Identificação de grupos de estudantes no Prosel usando Mapas de Kohonen
Identificação de grupos de estudantes no Prosel usando Mapas de KohonenIdentificação de grupos de estudantes no Prosel usando Mapas de Kohonen
Identificação de grupos de estudantes no Prosel usando Mapas de Kohonen
 
Exercício 2: Aplicações de Algoritmos Evolutivos
Exercício 2: Aplicações de Algoritmos EvolutivosExercício 2: Aplicações de Algoritmos Evolutivos
Exercício 2: Aplicações de Algoritmos Evolutivos
 
Uso de redes neurais na classificação de frutas
Uso de redes neurais na classificação de frutasUso de redes neurais na classificação de frutas
Uso de redes neurais na classificação de frutas
 
Introdução ao XML
Introdução ao XMLIntrodução ao XML
Introdução ao XML
 

Império JavaScript