Javascript Objetos. Leandro Cordeiro David ETEC Raposo Tavares Novembro de 2011

(1)

Javascript

Objetos

Leandro Cordeiro David

ETEC Raposo Tavares

(2)

Objetos

• Um objeto é uma estrutura que contém atributos e

métodos

• Atributos são propriedades que caracterizam um

objeto

• Métodos são comportamentos e habilidades

atribuídos ao objeto

(3)

Exemplos de Objetos

●

Objeto Carro:

●

Possíveis Atributos:

–

Marca

–

Modelo

–

Cor

–

Ano de fabricação

–

Placa

–

No. do Chassi

●

Possíveis Métodos:

–

Acelerar

–

Freiar

–

Virar para a direita

–

Virar para a Esquerda

–

Trocar a marcha

(4)

Exemplos de Objetos

●

Objeto Cachorro:

●

Possíveis Atributos:

–

Raça

–

Idade

–

Cor do Pelo

–

Pedigree

–

Sexo

–

Peso

●

Possíveis Métodos:

–

Latir

–

Comer

–

Correr

–

Deitar

–

Rolar

(5)

Objetos em Javascript

●

Para se criar um objeto em Javascript pode-se usar:

var nomeDoObjeto = new Object();

Exemplos:

var carro = new Object();

var cachorro = new Object(); var livro = new Object();

Com isso criam-se os objetos identificados por carro, cachorro e livro

****Mas os 3 são objetos identicos e vazios, diferenciados apenas pelo nome e não possuem ainda nenhum atributo que os caracterize

- A função Object() é chamada de construtor

- Um construtor é uma função que cria (constrói) um objeto - O construtor Object() cria um objeto vazio

(6)

Objetos em Javascript

●

Para se adicionar um atributo a um objeto em Javascript

pode-se usar:

●

nomeDoObjeto.nomeDoAtributo = ConteúdoDoAtributo;

Exemplos:

carro.marca = “Volkswagem”;

carro.modelo= “Gol”;

carro.anoFabricacao= “2011”; var cachorro = new Object();

cachorro.raca = “Labrador”;

cachorro.corDoPelo = “Preto”;

cachorro.sexo = “Masculino”; var livro = new Object();

livro.autor = “João Guimarães Rosa”;

livro.titulo = “Sagarana”;

(7)

Objetos em Javascript

●

Para se adicionar um método a um objeto em Javascript pode-se

usar:

nomeDoObjeto.nomeDoMetodo =function(){ //Conteúdo do método

} Exemplos:

carro.velocidade = 0; carro.marcha=0; carro.acelerar = function() { carro.velocidade=carro.velocidade+1; alert(carro.velocidade); } carro.trocarMarcha=function(novaMarcha){ carro.marcha=novaMarcha; } carro.trocarMarcha(1); carro.acelerar(); carro.trocarMarcha(2);

Com isso cria-se o objeto carro com atributos velocidade e marcha e métodos acelerar e trocarMarcha.

(8)

Construtores de Objetos

●

O construtor Object() cria sempre um objeto vazio

●

É possível definir novos construtores para que seja possível criar

vários objetos de um mesmo tipo (que possua os mesmos atributos e

métodos)

●

Um construtor é uma função que cria um novo objeto

●

Para definir um construtor usa-se:

function NomeDoConstrutor(parametro1,parametro2,...){ this.nomeDoAtributo1=parametro1;

this.nomeDoAtributo2=parametro2;

this.nomeDoMétodo1=function() {//conteudoDoMetodo}; }

(9)

Construtores de Objetos

● Exemplo de Construtor de Cachorro

function Cachorro(nomeCao,racaCao,idadeCao,sexoCao,corCao){ this.nome=nomeCao; this.raca=racaCao; this.idade=idadeCao; this.sexo=sexoCao; this.cor=corCao;

this.latir=function() {alert(“Au Au!!”}; }

var marley= new Cachorro(“Marley”,”Labrador”,6,”MASC”,”Branco”); var lassie= new Cachorro(“Lassie”,”Rough Collie”,20,”FEM”,”Marrom”); var bidu= new Cachorro(“Bidú”,”Schnauzer”,52,”MASC”,”Azul”);

(10)

Exercício

21 – Crie código Javascript que contenha

● Uma função criaCarro que cria um objeto carro com os atributos e métodos listados

abaixo. Os valores dos atributos devem ser informados pelo usuário com janelas de prompt. O carro deve ser definido como uma variável Global (sem uso da palavra chave var)

● Atributos:Marca, Modelo,Cor,Velocidade,Marcha

– Velocidade e Marcha são inicializados sempre com o valor 0

● Métodos:Acelerar,Freiar,TrocarMarcha,ExibirEstado

– Acelerar e Freiar aumenta e diminui a velocidade em 1

– TrocarMarcha atualiza a marcha para ao valor recebido como parametro – ExibirEstado apresenta o valor de todos os atributos em um alert

● Funções acelerarCarro, freiarCarro,trocarMarcha e exibirEstado que executam os

respectivos métodos do objeto carro criado pela funçao criaCarro.

● Crie uma página HTML com botões para executar as funções criaCarro,

(11)

Categorias de Objetos

Objetos nativos: aqueles próprios da linguagem

Objetos do ambiente de hospedagem:Aqueles próprios do dispositivo que

interpreta a linguagem (um navegador, um celular, uma TV, por exemplo)

Objetos customizados:Aqueles criados pelo desenvolvedor (p.ex. os objetos carro,

cachorro e livro criados nos exemplos deste material)

Objetos Nativos de JavaScript:

●Object – Objeto vazio

●String – Uma sequencia de caracteres

●Number – Um número

●Boolean – Objeto que assume valores true ou false apenas

●Date – Uma data

●Function - Uma função

●Array – Uma coleção de outros objetos

●Math – Operações e constantes matemáticas (ex. raiz quadrada,PI)

●RegExp – Expressão Regular, usada para validações de texto