Java Script

Dúvidas?
Qualquer coisa:
Pergunte. Agora! formador.ruicosta@gmail.com
JS
0158 - Javascript
Dúvidas? Qualquer coisa:

Pergunte. Agora! formador.ruicosta@gmail.com 2
O QUE É O JAVASCRIPT
Antes de mais é JAVASCRIPT e não JAVA. Java é uma batalha diferente!
Javascript é uma linguagem de programação utilizada para conferir

funcionalidades a páginas de um site.
O seu modus operandi é, na sua essência, deixar que o DOM carregue

e depois actuar sobre os elementos.
São usadas bibliotecas de funções (ex: jQuery e/ou MooTools) para

extender e acrescentar potencialidades.

Pergunte. Agora! formador.ruicosta@gmail.com 3
COMO UTILIZAR JAVASCRIPT
Para testes rápidos podemos por código Javascript no próprio HTML

dentro de tags <script> inseridas no <head> mas recomenda-se a sua
colocação antes do </body>.
<script>
aJS
window.onload = function () {
alert(’’Isto é uma mensagem de aviso’’);
console.log(’’Registo na consola’’);
}
</script>
Exemplo em: http://cesae.afonsogomes.com/javascripts1.html

Pergunte. Agora! formador.ruicosta@gmail.c 4
COMO UTILIZAR JAVASCRIPT
Idealmente temos todo o código javascript dentro de ficheiros com extensão

.js e todos eles, chamados antes do </body>.
.
Também, idealmente, dentro de um só ficheiro para diminuir os

HTTP Requests que uma página provoca.
....
a JS
<script src=’’js/jquery-1.10.2-min.js’’></script>
<script src=’’js/os-meus-scripts.js’’></script>
<script src=’’js/googleanalytics.js’’></script>
....
</body>

O primeiro programa em Javascript
Introduzam o seguinte código num novo documento HTML.

JS
<script>
a
function helloWorld() {
alert('Hello World!');
}
helloWorld();
</script>

Variáveis e tipos de dados
Variáveis é um espaço onde se armazena informação enquanto o

código é executado
Usadas para armazenar informação e mais tarde ir busca-la
As variáveis podem ser de difernetes tipos: numeros, strings, datas,

vectores, objectos, etc.
Javascript é uma linguagem implícita e por isso não precisamos de

declarar de que tipo são as nossas variáveis

Declarar variáveis
Para declarar uma variável usamos a palavra ‘var’ antes.

JS
var NomedaVariavel;
a
Podemos declarar multiplas variáveis numa só declaração:

JS
var nome, endereco;

a
E podemos também atribuir valores iniciais:

JS
var largura = 100, mensagem = ‘’Olá’’;

a

Âmbito das variáveis
O âmbito da variável define onde ela pode ser usada (aonde está confinada)
<script>
JS
var x= 10;
a
</script>
A variável y só é conhecida dentro da função ‘fazAlgo’:
<script>
aJS
function fazAlgo() {
var y= 99;
}
alert(y); // Uncaught Reference Error: y is not defined
</script>

Tipos de variáveis
JS
var nome = ‘Felismino’; /* string */

a
var pi = 3.14; /* float */

var ano = 2013; /* inteiro */
var dizOla = function () { /* booleano */

alert(‘Olá Mundo’);
}
var numeros = [1, 2, 3, 4]; /* vector */

var animais = new Array(‘Cão’, ‘Gato’, ‘Piriquito’); /* vector */
var pessoa = {
nome = ‘Felismino’,
idade = ‘31’,
titulo = ’O Maior’,
} /* objecto*/
Quanto aos vectores
Um vector é usado para armazenar multiplos vatores numa só variável.

A um vector podemos adicionar e remover valores consoante a nossa
necessidade. Um vector pode também alojar diferentes tipos de valores
Exemplos de declaração de vectores e a sua inicialização:
var vector1 = new Array(1, 2, 3);

JS
var vector2 = new Array();

a
var vector3 = [ ];
var vector4 = [1, 2, 3, 4];
var vector5 = new Array(‘Cão’, ‘Gato’, ‘Piriquito’, ‘Girafa’);

Vectores
Um vector pode ser acedido através de um index onde o primeiro elemento

é o index zero.
var animais = new Array(‘Cão’, ‘Gato’, ‘Piriquito’, ‘Girafa’);

JS
var primeiroelemento = animais[0];

a
alert(primeiroelemento);
Também podemos adicionar elementos ao vector, neste exemplo vamos

adicionar o valor Zebra como 5º elemento (index 4)
animais[4] = ‘Zebra’;
aJS
alert(animais.join(’ | ’));

Vectores
Para sabermos o tamanho do vector usamos a propriedade lenght. E

também podemos adicionar elementos com o push.
var animais = new Array(‘Cão’, ‘Gato’, ‘Piriquito’, ‘Girafa’);
JS
var contaanimais = animais.length;

a
alert(contaanimais);
animais.push(‘Falcão’);
alert(animais.length);
Podemos, também, usar um ciclo para vermos todos os animais do vector.

for( var i = 0; i < animais.length; i++) {
JS
alert(animais[i]);
a

Operadores
Do PHP para o Javascript a coisa pouco muda :)
<script>
JS
var x= 10, y= 20;

a
var adicao = x + y;
var subtracao = x - y;
var multiplicacao = x * y;
var divisao = x / y;
var resto = x % y;
</script>

Operadores e comparações booleanas
EXEMPLO NOME RESULTADO

a == b Igual Verdade se a igual a b
a != b Diferente Verdade se a diferente de b
a<b Menor Verdade se a menor que b

a>b Maior Verdade se a mairo que b
a <= b Menor/Igual Verdade se a menor ou igual a b
a >= b Maior/Igual Verdade se a maior ou igual a b
a && b E Verdade se a verdade e b verdade
a || b Ou Verdade se a verdade ou b verdade
!a Negação Verdade se a é falso

Estruturas de controlo: IF
<script>
aJS
if (condição){
// Código
}
if (condição){
// Código
} else {
// Código
}
</script>

Estruturas de controlo: IF (exemplo 1)
var num1 = 10;

aJS
var num2 = 20;

var num3 = prompt("Introduza um número: ");
if (num3 > num2){

alert(’num1 é maior’);
}
if (num1 != num2){
alert(’num1 diferente de num2’);
}
O prompt gera uma caixa tipo a de alert, mas pede o input do utilizador.
É bonita para ensinar javascript, mas raramente vista em websites!

var horaactual = 8;
aJS
if (horaactual > 6 && horaactual <= 7){

alert(’Acorda!’);
} else if (horaactual > 13 && horaactual <= 14){
alert(’Hora do almoço!’);
} else {
alert(’Tempo livre!’);
}

var cao = ’Johnny’, idade = 2;

aJS
if (cao == ’Johnny’ && idade == 2){

alert(’O ’ + cao + ’ tem ’ + idade + ’ anos!’);
}
if (idade == 0 || idade == 1){

alert(cao + ’ ainda é um cachorro!’);
}
var velho = idade > 10;
if (!velho){ alert(cao + ’ ainda é um cachorro!!!!’); }

Estruturas de controlo: SWITCH
var a = prompt(’’Escolha um número de 1 a 5’’);

aJS
switch(a) {
case ‘1’:
alert(’Caso 1’);
break;
case ‘2’:
alert(’Caso 2’);
break;
default:
alert(’Caso por defeito.’);
break;
};

A libraria de funções (classe) Math
A classe Math contém muitos métodos frequentemente úteis:
Math.abs(x) devolve o valor absoluto de um número decimal
Math.max(x1, x2) devolve o número com o maior valor
Math.min(x1, x2) devolve o número com o menor valor
Math.pow(x, y) devolve a potência y de um número x
Math.sqrt(x) devolve a raiz quadrada de x
Math.floor(x) arredonda por defeito (para baixo)
Math.random() gera um número aleatório entre 0 e 1

O ciclo FOR
Um ciclo FOR executa um bloco de código um numero determinado de vezes.
for (<inicial>; <condição>; <update>) {
SINTAXE
JS
// Código a executar durante o for aqui

a
E um exemplo:
for (var i = 0; i < 10; i++) {
EXEMPLO
JS
document.write(’Esta é a iteração: ‘ + i + ’<br>’);

a

O ciclo WHILE
Um ciclo WHILE executa um bloco de código enquanto uma determinada

condição for verdade
while (condição) {
SINTAXE
JS
// Código a executar
a
EXEMPLO
var conta = 0;
aJS
while (conta < 10) {

document.write(’Valor conta: ‘ + conta + ’<br>’);
conta++;
}

Funções
Uma função é um bloco de código que será executado quando for chamado.
Ambos os exemplos seguintes são exactamente os mesmos.
function clicaAqui() {
aJS
alert(’Clicou!’);
}
var clicaAqui = function () {

alert(’Clicou!’);
}
clicaAqui();

Funções
Funções podem ter parâmetros de entrada e retornar valores com a

palavra chave return.
JS
function multiplica(x, y) {
a
return x * y;
}
var seis = multiplica(2, 3);

alert(seis);
alert(multiplica(5, multiplica(5, 5)));

Manipulação do DOM
Vimos a estrutura básica do DOM nas sessões em que demos CSS.

No javascript também podemos atingir determinados elementos do DOM.
Assim como criar novos elementos!!
var botao = document.createElement("BUTTON");

aJS
var texto = document.createTextNode("Clica aqui!");

botao.appendChild(texto);
document.body.appendChild(botao);

Manipulação do DOM
Também podemos atingir um determinado elemento, ou um elemento

com umo determinado ID ou uma determinada class !!
Com jQuery estas tarefas de manipulação de DOM são mais fáceis, por isso
deixamos isto para mais tarde.

Caixa CONFIRM
Vimos anteriormente como gerar um ALERT e um PROMPT. O CONFIRM

fornece uma opção ao utilizador do site.
var a = confirm("Deseja ir para o Google ?")

aJS
if (a == true){
alert("Disse que sim. A envia-lo para o Google");
window.open("http://google.pt", "_parent");
} else {
alert("Escolheu cancelar!");
}

O que é e porquê usar o jQuery ?
- Biblioteca de funções de javascript

- Simples e conciso de usar
- Simplica as interações entre HTML e Javascript
- Levezinho: +/- 19KB de tamanho (Minificado e zipado)

- Usa regras válidas (compliant) CSS 1-3
- Cross Browser (IE 6+, FF 2+, Safari 3+, Opera 9+ e Chrome)
- Open Source, comunidade de utilizadores muito activa, imensos plugins

(grátis ou pagos), montes de tutoriais e livros na internet

Exemplo de manipulação de AJAX e DOM
•if (!document.ELEMENT_NODE) { document.ELEMENT_NODE = 1; document.ATTRIBUTE_NODE = 2;
document.TEXT_NODE = 3; document.CDATA_SECTION_NODE = 4; document.ENTITY_REFERENCE_NODE
= 5; document.ENTITY_NODE = 6; document.PROCESSING_INSTRUCTION_NODE = 7;
document.COMMENT_NODE = 8; document.DOCUMENT_NODE = 9; document.DOCUMENT_TYPE_NODE
= 10; document.DOCUMENT_FRAGMENT_NODE = 11; document.NOTATION_NODE =
12; } document._importNode = function(node, allChildren) { switch (node.nodeType) { case
document.ELEMENT_NODE: var newNode = document.createElement(node » .nodeName); if
(node.attributes && node.attributes » .length > 0) for (var i = 0; il = node.attributes.length; » i < il)
newNode.setAttribute(node.attributes » .nodeName, node.getAttribute(node.attributes[i++] »
.nodeName)); if (allChildren && node.childNodes && » node.childNodes.length > 0) for (var i = 0; il =
node.childNodes.length; » i<il) newNode.appendChild(document._importNode »
(node.childNodes[i++], allChildren)); return newNode; break; case document.TEXT_NODE: case
document.CDATA_SECTION_NODE: case document.COMMENT_NODE: return
document.createTextNode(node.nodeValue); break; } };
Fonte: http://alistapart.com/article/crossbrowserscripting
Em jQuery:
É apenas uma linha de código!

$(’’#conteudo’’).load(’’page.html #conteudo’’);

Quem usa jQuery:

Comparação jQuery com outras librarias de javascript
http://www.google.com/trends/explore#q=jQuery,prototype,yui,dojo,mootools
Como usar o jQuery
Podemos fazer o download (http://jquery.com/download/) e servir uma

versão armazenada no nosso site:
a HTML
<script src=’’js/jquery-x.x.js’’></script>
Ou então podemos usar um CDN (Google, jQuery.com ou outro)
<script
a HTML
src=’’http//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js’’>
</script>

Como usar o jQuery
Depois de termos embebido o jQuery na nossa página, podemos começar

a escrever código usando a nomenclatura jQuery.
a JS
<script src=’’js/jquery-1.10.2.js’’></script>
<script>
$(document).ready( function () {
// O nosso código aqui!
});
</script>

A filosofia do jQuery
Procurar um elemento qualquer e fazer-lhe qualquer coisa!
<script src=’’js/jquery-1.10.2.js’’></script>
a JS
<script>
$(“div”).addClass(“xyz”);
});
</script>
Procurar um elemento qualquer e fazer-lhe qualquer coisa!

Exemplo básico
Vamos ver um exemplo:
<body>
a JS
<div>
<p>Um parágrafo</p>
<p class=’’especial’’>Outro parágrafo</p>
</div>
<p>Ainda outro parágrafo</p>
</body>

Exemplo básico
Adicionar uma class com o nome teste a todos os parágrafos de uma página
<body>
a JS
<div>
<p class=’’teste’’>Um parágrafo</p>
<p class=’’especial teste’’>Outro parágrafo</p>
</div>
<p class=’’teste’’>Ainda outro parágrafo</p>
</body>
Código jQuery usado:

$(’’p’’).addClass(’’teste’’);

Usando selectores em jQuery
Podemos usar qualquer tipo de selectores ... tal e qual no CSS !!!
a CSS
Seleccionar o elemento:
a JS
h1 {
color: blue; $(’’h1’’)
}
Seleccionar um ID:
#elementocomid { $(’’#elementocomid’’)
color: blue;
} Seleccionar uma classe:
$(’’.laranja’’)
.laranja {
color: orange; E até fazer combinações:
} $(’’footer ul.menu li’’)

Exemplo básico de selectores em jQuery
Para já vamos só ver como seleccionar as coisas sem executar nenhuma

acção sobre elas...
a HTML
<header>
<div id=“logo”>O Logo</div>
<ul class=“menu”>
<li>Opção 1</li>
<li>Opção 2</li>
</ul>
</header>

$(’’header’’)
a HTML
<header>
<li>Opção 1</li>
<li>Opção 2</li>
</ul>
</header>

$(’’#logo’’)
a HTML
<header>
<li>Opção 1</li>
<li>Opção 2</li>
</ul>
</header>

$(’’ul.menu’’)
a HTML
<header>
<li>Opção 1</li>
<li>Opção 2</li>
</ul>
</header>

$(’’ul.menu li’’)
a HTML
<header>
<li>Opção 1</li>
<li>Opção 2</li>
</ul>
</header>

Usar filtros para seleção
O jQuery possúi também filtros que, muitas vezes, revelam-se úteis.

.
Filtros básicos:
:first , :last , :even , :odd , entre outros ...
Filtros de conteúdos:
:empty , :contains(texto) , :has(selector) , ...
Filtros de atributos:
[atributo], [atributo=valor], [atributo!=valor], ...
Filtros de forms:
:input, :text, :submit, :password , :enabled , :checked , ...

Exemplos de filtros
Imaginemos esta tabela com o id #estudantes
Nome Turma Idade Observação

Felismino C 21 Bom
Felizardo A 22 Bom
Felisberto B 21
Fulano B 20
Fulaninho D 19 Satisfaz

Exemplos de filtros
Para dar cores de fundo a esta tabela em tipo zebra:

$(’’#estudantes tr:even’’).css(’’background-color’’, ‘’#DDDDEE’’);

Felismino C 21 Bom
Felizardo A 22 Bom
Felisberto B 21
Fulano B 20

Exemplos de filtros

$(’’#estudantes td.observacao:empty’’).text(’’Sem comentário’’);

Felismino C 21 Bom
Felizardo A 22 Bom
Felisberto B 21 Sem comentario
Fulano B 20 Sem comentario

Exemplos de filtros

$(’’#estudantes td.observacao:empty’’).text(’’Sem comentário’’);
$(’’#estudantes td[align=’center’]’’).addClass(’’textovermelho’’);

Felismino C 21 Bom
Felizardo A 22 Bom
Felisberto B 21 Sem comentario
Fulano B 20 Sem comentario

Exemplos de selectores de forms
$(’’:submit).click(function(event){ ... });
$(’’input:disabled’’).val(’’Não pode mudar-me!’’);
$(’’#formcontacto input:checked’’).addClass(’’selecionado’’);

Métodos jQuery (acções)
Agora que sabemos seleccionar elementos vamos fazer alguma coisa!

Manipulação do DOM:
before() , after() , append() , appendTo() , ...
Atributos:
css() , addClass() , removeClass() , attr() , html() , val () , ...
Eventos:
click() , bind() , unbind() , live() , ...
Efeitos:
hide() , show() , fadeOut() , toggle() , animate() , ...
AJAX:
load() , get() , post() , ajax() , ...

Métodos jQuery
Nesta explicação usaremos, outra vez, este pequeno bloco de HTML

O código necessário aqui: http://cesae.afonsogomes.com/jquery.html
a HTML
<header>
<h1>O cabeçalho</h1>
<p>Outro parágrafo</p>
<div id=’’conteudos’’></div>
<p>E outro parágrafo</p>
</header>

Métodos jQuery
Para mover todos os parágrafos para dentro da div com id conteudos

Seleccionar todos os parágrafos: $(’’p’’)
a HTML
<header>
<div id=’’conteudos’’></div>
</header>

Métodos jQuery
Mover todos os parágrafos para dentro da div com id conteudos

$(’’p’’).appendTo(’’#conteudos’’);
a HTML
<header>
<div id=’’conteudos’’>
</div>
</header>

Métodos jQuery
Acrescentar coisas ao cabeçalho h1:

$(’’h1’’).append(’’ magnífico!’’);
a HTML
<header>
<h1>O cabeçalho magnífico!</h1>
</div>
</header>

Métodos jQuery
A este ponto, devem ter algo parecido com isto no vosso ficheiro:
a JS
<script>
$(’’p’’).appendTo(’’#conteudos’’);
$(’’h1’’).append(’’ magnífico!’’);
});
</script>
Vamos continuar ...

Métodos jQuery
Pôr o último parágrafo com a cor vermelha

$(’’#conteudos p:last’’).css(’’color’’, ‘’red’’);
a HTML
<header>
<p style=’’color:red’’>E outro parágrafo</p>
</div>
</header>

Métodos jQuery
Acrescentar uma class ao <header>

$(’’header’’).addClass(’’headertopo’’);
a HTML
<header class=’’headertopo’’>
<p style=’’color:red’’>E outro parágrafo</p>
</div>
</header>

Métodos jQuery ... ainda mais exemplos
Para definição:
$(’’img.logo’’).attr(’’width’’, ‘’200px’’);
$(’’p.copyright’’).html(’’<span>&copy 2013 Felisberto</span>’’);
$(’’input#nome’’).val(’’Felismino’’);
Para leitura:
var larguralogo = $(’’img.logo’’).attr(’’width’’);
var copyright = $(’’p.copyright’’).html();
var nomeuser = $(’’input#nome’’).val();

Encadear métodos (chaining)
Uma particularidade (boa) do jQuery é que podemos encadear

acções. Isto é, aplicar várias acções ao mesmo selector.
$(“#deleted”).addClass(“red”).fadeOut(“slow”);
.
$(“:button”).val(’’Clica aqui’’).addClass(“foco”).removeClass(“desligado”);
Caso eu tenha esquecido: Dúvidas com jQuery o melhor sítio para

aprender é http://learn.jquery.com e http://api.jquery.com

Exemplo de eventos em jQuery
Agora vamos ver exemplos de EVENTOS...

a JS
$(o-selector).nomedoEvento(function(){
....
});
});
Vamos continuar a trabalhar no ficheiro que estão a editar de momento
http://cesae.afonsogomes.com/jquery.html

Vamos acrescentar isto ao nosso document ready:

a JS
$(’’#mensagem’’).click(function(){
$(this).css(’color’,’blue’);
});
});
a HTML
<span id=’’mensagem’’>Lorem ipsum dolor sit amet</span>

Também podemos disparar o evento manualmente!

a JS
$(’’#mensagem’’).click(function(){
$(this).css(’color’,’blue’);
});
$(’’#mensagem’’).click();
});
a HTML
<span id=’’mensagem’’>Lorem ipsum dolor sit amet</span>

Quando .mostracap for clicado o #cap1 desliza para cima ou baixo.
a JS
$(’’a.mostracap1’’).click(function(){
$(’’#cap1’’).slideToggle(’’slow’’);
});
});
a HTML
<p><a class="mostracap1">Ler capítulo 1</a></p>

<div id="cap1"> ... </div>

Também podemos fazer as animações ao nosso gosto ...

a JS
$(’’.clicaaqui’’).click(function(){
$(’’#adiv’’).animate({
width: ‘’960px’’, opacity: 0.7,
fontSize: ‘’2em’’
}, 2000 );
});
});
a HTML
<p><a class="clicaaqui">Clica aqui para um animação!</a></p>

<div id="adiv"><p>Olá!</p></div>

Outro exemplo de eventos em jQuery
Um código que se vê frequentemente em websites e muito procurado

é o de Smooth Scroll.
Aqui está um exemplo de código que poderão gostar:
http://cesae.afonsogomes.com/jquery2.html

Exemplo de AJAX
Já vimos antes que temos algumas funções de jQuery para AJAX

( $.load , $.ajax , $.get , $.post , etc...)
Para carregar conteúdos de uma página para uma determinada div:

a JS
$(“#coms”).load(“comentarios.php”);
Podemos também passar dados com o pedido que fazemos:

a JS
$(“#coms”).load(“comentarios.php”, {max: 5} );

Exemplo de AJAX com o $.post
Uma das grandes vantagens do AJAX é com os formulários. Podemos

enviar um POST ao nosso ficheiro processador (de 1 formulário por ex),
receber a resposta e mostra-la na página... isto sem precisar de
sair da página onde estamos para outra.
Vamos ao site do amigo Felismino Felisberto para analisar o código!
http://cesae.afonsogomes.com/agomes/

HASTA LA VISTA BABY
Nunca esquecer:
- Vocês não sabem? O Google conhece muita gente que sabe!
- O W3Schools é uma boa fonte de info mas ás vezes ...
- Informações de confiança? Procurar nos sites de quem faz a coisa:
HTML > W3.org PHP > PHP.net
mySQL > mysql.com jQuery > jquery.com
- Tenham amigos na mesma área, discutam e conversem sobre as
vossas lutas, problemas, dúvidas, desejos, etc!
- Pesquisam muito e mantenham-se sempre actuais!

www.youtube.com/watch?v=ufL85FJAgZQ
Até um dia!

Java Script

Hochgeladen von

Dokumentinformationen

Originaltitel

Copyright

Verfügbare Formate

Dieses Dokument teilen

Dokument teilen oder einbetten

Freigabeoptionen

Stufen Sie dieses Dokument als nützlich ein?

Sind diese Inhalte unangemessen?

Copyright:

Verfügbare Formate

Java Script

Hochgeladen von

Copyright:

Verfügbare Formate

Dúvidas?

Dúvidas? Qualquer coisa:

Antes de mais é JAVASCRIPT e não JAVA. Java é uma batalha diferente!

Javascript é uma linguagem de programação utilizada para conferir

O seu modus operandi é, na sua essência, deixar que o DOM carregue

São usadas bibliotecas de funções (ex: jQuery e/ou MooTools) para

Dúvidas? Qualquer coisa:

Para testes rápidos podemos por código Javascript no próprio HTML

Exemplo em: http://cesae.afonsogomes.com/javascripts1.html

Dúvidas? Qualquer coisa:

Idealmente temos todo o código javascript dentro de ficheiros com extensão

Também, idealmente, dentro de um só ficheiro para diminuir os

Dúvidas? Qualquer coisa:

Introduzam o seguinte código num novo documento HTML.

Dúvidas? Qualquer coisa:

Variáveis é um espaço onde se armazena informação enquanto o

Usadas para armazenar informação e mais tarde ir busca-la

As variáveis podem ser de difernetes tipos: numeros, strings, datas,

Javascript é uma linguagem implícita e por isso não precisamos de

Dúvidas? Qualquer coisa:

Para declarar uma variável usamos a palavra ‘var’ antes.

Podemos declarar multiplas variáveis numa só declaração:

var nome, endereco;

E podemos também atribuir valores iniciais:

var largura = 100, mensagem = ‘’Olá’’;

Dúvidas? Qualquer coisa:

A variável y só é conhecida dentro da função ‘fazAlgo’:

Dúvidas? Qualquer coisa:

var nome = ‘Felismino’; /* string */

var pi = 3.14; /* float */

var dizOla = function () { /* booleano */

var numeros = [1, 2, 3, 4]; /* vector */

Um vector é usado para armazenar multiplos vatores numa só variável.

Exemplos de declaração de vectores e a sua inicialização:

var vector1 = new Array(1, 2, 3);

var vector2 = new Array();

Dúvidas? Qualquer coisa:

Um vector pode ser acedido através de um index onde o primeiro elemento

var animais = new Array(‘Cão’, ‘Gato’, ‘Piriquito’, ‘Girafa’);

var primeiroelemento = animais[0];

Também podemos adicionar elementos ao vector, neste exemplo vamos

Dúvidas? Qualquer coisa:

Para sabermos o tamanho do vector usamos a propriedade lenght. E

var contaanimais = animais.length;

Podemos, também, usar um ciclo para vermos todos os animais do vector.

Exemplo em: http://cesae.afonsogomes.com/javascripts2.html

Do PHP para o Javascript a coisa pouco muda :)

var x= 10, y= 20;

Dúvidas? Qualquer coisa:

EXEMPLO NOME RESULTADO

a != b Diferente Verdade se a diferente de b

a<b Menor Verdade se a menor que b

a || b Ou Verdade se a verdade ou b verdade

!a Negação Verdade se a é falso

Dúvidas? Qualquer coisa:

Dúvidas? Qualquer coisa:

var num1 = 10;

var num2 = 20;

if (num3 > num2){

Dúvidas? Qualquer coisa:

if (horaactual > 6 && horaactual <= 7){

Dúvidas? Qualquer coisa:

var cao = ’Johnny’, idade = 2;