javascript - introdução€¦ · javascript - introdução variedades –método alert método...
TRANSCRIPT
![Page 1: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/1.jpg)
JavaScript - Introdução
Professor Vicente Paulo de Camargo
![Page 2: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/2.jpg)
JavaScript - Introdução
• É uma das bases do desenvolvimento Web
• Uma das linguagens exigidas para vagas emdesenvolvimento de software
• Permite desenvolver para desktop, web e mobile
• Atualmente pode ser utilizada em front-end e back-end(node.js)
![Page 3: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/3.jpg)
JavaScript - Introdução• Conteúdo interessante para melhorar o seu conhecimento:
• https://developer.mozilla.org/pt-BR/
• https://developer.mozilla.org/pt-BR/docs/Web/JavaScript
• https://www.caelum.com.br/apostila-html-css-javascript/javascript-e-interatividade-na-web/#dom-sua-pgina-no-mundo-javascript
• http://www.w3bai.com/pt/ (*)
• https://www.gocache.com.br/jquery/aprendendo-a-usar-jquery-exemplos/
• http://terminalroot.com.br/2011/11/alguns-codigos-simples-de-javascript.html
• http://terminalroot.com.br/2016/12/alguns-codigos-simples-de-javascript-2.html
![Page 4: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/4.jpg)
JavaScript - Introdução
• Suporte ao desenvolvimento com CSS, HTML eJavaScript:
• https://jsfiddle.net/
![Page 5: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/5.jpg)
JavaScript - Introdução
Declaração de variáveisFormato geral:var identificador-da-variável [=conteúdo];Exemplo: var nome=“javascript”;
As variáveis não são tipadasMas, para saber o tipo da variável basta utilizaro comando typeof nome-da-variável
![Page 6: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/6.jpg)
JavaScript - IntroduçãoVariáveis - complementos
As variáveis definidas fora de uma função sempre estão disponíveis para todas asfunções dentro do script que estão na mesma página
Estas variáveis são referenciadas como variáveis globais
As variáveis que são definidas dentro de função se tornam globais, desde quenão seja utilizada a instrução var em sua declaração
Caso o usuário declare uma variável dentro de uma função atravésda instrução var, esta variável passa a ser apenas local, ou seja, são usadasapenas para aquela função onde foi declarada.
É bom saber que, as variáveis globais ficam na memória mesmo após a execuçãodo script, estas variáveis somente são liberadas da memória quando odocumento é descarregado.
As variáveis podem ser declaradas também separadas por vírgula, da seguinte maneira: var nome, endereço, telefone; ouvar nome;var endereço;var telefone;
![Page 7: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/7.jpg)
JavaScript - IntroduçãoVariáveis – complementos
lembre-se que estas instruções deverão estar entre as tag’s HTML <SCRIPT>e </SCRIPT>.
![Page 8: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/8.jpg)
JavaScript - IntroduçãoVariedades
As variáveis booleanas podem receber os valores:
TRUE ou 1FALSE ou 0
Os operadores aritméticos e lógicos são semelhantes aos da linguagem Java.
Em relação aos operadores relacionais, a maioria é semelhante aos operadores relacionais de Java, exceto o === que possui a descrição “igual e do mesmo tipo”.
A concatenação de Strings é efetuada com o operador +.
O operador new permite a criação de objetos com a seguinte sintaxe:nomeObjeto = new tipo(parâmetros)
A palavra chave this é utilizada para referenciar o objeto corrente, como this.propriedade.
Os comentários, comandos de seleção e de repetição são idênticos aos correspondentes da linguagem Java.
![Page 9: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/9.jpg)
JavaScript - IntroduçãoVariedades - Utilização de scripts na página
Utiliza-se a tag <script> de duas maneiras:
Ou
![Page 10: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/10.jpg)
JavaScript - Introdução
Utiliza-se arquivos externos para importar códigos JavaScript, no seguinte formato:
A extensão do arquivo deve ser .js
Variedades - Utilização de scripts na página
![Page 11: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/11.jpg)
JavaScript - IntroduçãoVariedades – Método document.write
![Page 12: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/12.jpg)
JavaScript - IntroduçãoVariedades – Método alert
Método Alert()A finalidade deste método é emitir uma caixa de diálogo do Windows com um botão OK. Estemétodo pertence ao objeto window do JavaScript, porém seu uso com a sintaxe de ponto éopcional, assim sendo observe a sintaxe de seu funcionamento e o exemplo da próxima figura:
![Page 13: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/13.jpg)
JavaScript - IntroduçãoVariedades – Método confirm
![Page 14: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/14.jpg)
JavaScript - IntroduçãoVariedades II
Uso de alert, prompt, whilee function, sendo que este último referencia bloco de código
![Page 15: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/15.jpg)
JavaScript - IntroduçãoVariedades – Instrução for...in
![Page 16: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/16.jpg)
JavaScript - IntroduçãoVariedades – For...in (Continuação)
No exemplo a seguir, o uso do laço for...in estabelece a determinação das propriedades do objeto document. Ao listar todas as propriedades do objeto, o laço automaticamente se encerrará:
![Page 17: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/17.jpg)
JavaScript - IntroduçãoVariedades – exemplo (alert com form)
![Page 18: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/18.jpg)
JavaScript - IntroduçãoVariedades IIO script anterior com uso de else:
![Page 19: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/19.jpg)
JavaScript - IntroduçãoVariedades – Instrução With
![Page 20: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/20.jpg)
JavaScript - IntroduçãoVariedades – Instrução with – cont.
![Page 21: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/21.jpg)
JavaScript - IntroduçãoVariedades - Funções
![Page 22: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/22.jpg)
JavaScript - IntroduçãoVariedades – Funções – cont.
![Page 23: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/23.jpg)
JavaScript - Introdução
Declaração de arraysFormato:var identificador-do-array = [e1,e2,..., en];
Para acessar um elemento:Identificador-do-array[índice]Onde índice deve iniciar com 0 (zero)Exemplo:var x = [10,20,30];console.log(x[1]);(visualizará 20)
![Page 24: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/24.jpg)
JavaScript - Introdução
Declaração de objetos Formato:var identificador-do-objeto = {
atributo1 : valor1, atributo2 : valor2,.......atributon : valorn
}
Exemplo:
![Page 25: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/25.jpg)
JavaScript - Introdução
Declaração de objetos Outro exemplo:
array como atributo
![Page 26: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/26.jpg)
JavaScript - Introdução
Declaração de objetos Outro exemplo:Agora usando um array de objetos como atributo
Array de objetos como atributo
![Page 27: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/27.jpg)
JavaScript na prática
Usando evalavalia um código JavaScript representado por uma String.Formato
eval(string)
eval é uma propriedade do objeto global windowO argumento da função eval() é uma string. Se a string representa uma expressão,
eval()avalia a expressão. Se o argumento representa uma ou mais declarações de
JavaScript, eval() avalia as declarações.
Não chame o eval() para avaliar uma expressão aritmética; JavaScript avalia
expressões aritméticas automaticamente. Se você construir uma expressão aritmética
como uma string, você pode usar eval() para calcular o resultado depois.
Por exemplo, suponha que você tenha uma variável x.
Você pode adiar a avaliação de uma expressão envolvendo x atribuindo o valor de
string da expressão, dizer "3 * x + 2“ a uma variável, e, em seguida,
chamando eval() em um ponto posterior no seu script.
![Page 28: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/28.jpg)
JavaScript na práticaUsando eval (cont.)
var a = 3;var b = 35;var c = “43”;eval(“a + b + 5”);// expressão 1eval(c); // expressão 2
As duas linhas (expressões 1 e 2) de eval apresentam o mesmo resultado (43)
![Page 29: JavaScript - Introdução€¦ · JavaScript - Introdução Variedades –Método alert Método Alert() A finalidade deste método é emitir uma caixa de diálogo do Windows com um](https://reader034.vdocuments.site/reader034/viewer/2022051511/6026e529319f0a003b5a02ed/html5/thumbnails/29.jpg)
FIM
JavaScript - Introdução