Apostila
ApostilaApostila
Apostila
Prof.a Elisabete da Silva Santos
D
DD
D
epartamento de
T
TT
T
ecnologia da
I
II
I
nformação
FATEC
FATECFATEC
FATEC-
--
-SP
SPSP
SP
Apostila
ApostilaApostila
Apostila
Prof.a Elisabete da Silva Santos
Prepare-se para as provas
Estude fácil! Tem muito documento disponível na Docsity
Ganhe pontos para baixar
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Guias e Dicas
Prepare-se para as provas
Estude fácil! Tem muito documento disponível na Docsity
Encontrar documentos
Prepare-se para as provas com trabalhos de outros alunos como você, aqui na Docsity
Encontra documentos específicos para os exames da tua universidade
Encontra documentos específicos para os exames da tua universidade
Videoaulas
Prepare-se com as videoaulas e exercícios resolvidos criados a partir da grade da sua Universidade
Quiz
Responda perguntas de provas passadas e avalie sua preparação.
Ganhe pontos para baixar
Ganhe pontos ajudando outros esrudantes ou compre um plano Premium
Apostilas, Notas de estudo de Análise de Sistemas de Engenharia
Programação
Tipologia: Notas de estudo
2014
1 / 73
Esta página não é visível na pré-visualização
Não perca as partes importantes!
Documentos relacionados
Pré-visualização parcial do texto
Baixe Apostilas e outras Notas de estudo em PDF para Análise de Sistemas de Engenharia, somente na Docsity!
ApostilaApostilaApostilaApostila
Prof.a Elisabete da Silva Santos
DDDDepartamento de TTTTecnologia da IIIInformação
FATECFATECFATECFATEC----SPSPSPSP
ApostilaApostilaApostilaApostila
Prof.a Elisabete da Silva Santos
Javascript
Faculdade de Tecnologia de São de Paulo
JavaScript
Javascript
Faculdade de Tecnologia de São de Paulo
1. Introdução
1.1. Histórico
JavaScript foi desenvolvido por Brendan Eich, da Netscape Communications Corporation. Originalmente chamado LiveScript e foi introduzido no Netscape Navigator 2.0 em 1995. Mais tarde, foi batizado como JavaScript para indicar seu relacionamento com Java, termo da Web muito atraente no momento. JavaScript foi a primeira linguagem de script da Web e é de longe a mais popular. Quando a Microsoft percebeu o quanto podia ser útil uma linguagem de script para a Web, lançou sua própria variante chamada JScript 1.0 com o navegador Internet Explorer 3.0.
O JScript 1.0 era compatível com o JavaScript 1.0 do Netscape, o que significava que um JavaScript escrito para um dos navegadores tinha uma boa chance de funcionar como esperado em um outro navegador. Após alguns upgrades de versões tanto da Netscape quanto, principalmente, da Microsoft, gerou-se o início de incompatibilidades de navegadores.
Foi criado então um padrão chamado de linguagem ECMAScript em 1997, chamado também ECMA-262, criado pelo grupo suíço European Computer Manufacturing Association. A partir daí, grande parte do caos ocorrido foi dando lugar a uma melhor concordância entre ambas as linguagens e os padrões. O JavaScript1.5 e JScript 5.5 atualmente estão sendo 100% concordantes com o ECMAScript Edição 3, pelo menos na teoria, se todas as pessoas estiverem usando a última versão do navegador...
1.2. O quê é JavaScript?
JavaScript é uma linguagem de script que lhe possibilita adicionar um novo nível de interatividade e função às páginas Web. Um script é uma seqüência de instruções (ou, até mesmo um programa) que são interpretados ou executados por um outro programa e não pelo processador do computador. Eles são mais fáceis e mais rápidos de se escrever do que os programas e necessitam no mínimo de um editor de texto simples, que pode ser gratuito! Diferentemente de HTML, se houver erros nos scripts o programa interromperá a execução e poderá até travar o computador. Normalmente você poderá visualizar a mensagem de erro gerado em seu navegador.
1.3. Java, C++ e JavaScript são a mesma coisa?
JavaScript é uma linguagem de terceira geração, o que significa que ela é prima do C, Pascal e BASIC. Existem semelhanças, mas existem também diferenças fundamentais: JavaScript é independente de formatação. JavaScript é uma linguagem interpretada. JavaScript é altamente portátil e independente de hardware. JavaScript se encaixa facilmente em outro software, como os navegadores.
Se você tiver alguma experiência em C, C++, Pascal, BASIC, Java, FORTRAN ou Perl, você pode achar familiares alguns dos aspectos do JavaScript. Mas não se iluda, para escrever JavaScript, você precisa usar Java Script!
Javascript
Faculdade de Tecnologia de São de Paulo
1.4. O quê posso fazer com JavaScript?
Você pode adicionar mensagens que rolam na tela ou alterar as mensagens da linha de status do navegador. Validar conteúdo de um formulário.
Fazer cálculos;
Trabalhar com datas, horas e fuso horário;
Exibir mensagens para o usuário tanto como parte de uma página da Web como em caixas de alertas;
Fazer animações de imagens ou imagens que mudam quando você move o cursor sobre elas;
Detectar o navegador em utilização e exibir conteúdo diferente para navegadores diferentes;
Detectar plug-ins instalados e notificar o usuário se um plug-in foi exigido; E muito mais, é só usar a criatividade!
1.5. O quê preciso para programar em JavaScript?
Um editor de texto (não utilize formatação) ou um bloco de notas.
Um navegador. (Netscape, Internet Explorer, Opera...)
Conhecimentos básicos em HTML, onde o script será incluído.
Curiosidade: Java é uma ilha densamente povoada na Indonésia, produtora de café. Seu nome foi utilizado para batizar a linguagem Java quando seus desenvolvedores estavam tomando um cafezinho... Já pensou se o cafezinho fosse brasileiro?
2. JavaScript em uma Página HTML
Para incluir Java Script em uma página HTML utilizamos as tags . Podemos também indicar a linguagem de script a ser utilizada e a versão:
// JavaScript é a linguagem padrão do navegador.
// 1.3 é a versão JavaScript utilizada.
Atenção:
O script é sensível a letras maiúsculas e minúsculas ( sensitive case), portanto, digite em minúsculo o que estiver em minúsculo e em maiúsculo o que estiver em maiúsculo!
Não utilize caracteres especiais (acentos, asteriscos, pontos...), exceto como conteúdo de variáveis!
Podemos incluir as tags de Javascript em vários lugares do código HTML:
Em um Arquivo Externo
No Cabeçalho do Documento
Dentro de Tags, utilizando Tratadores de Eventos
No Corpo do Documento
Javascript
Faculdade de Tecnologia de São de Paulo
2.2. Ocultando JavaScript de Navegadores mais Antigos
Navegadores mais antigos, ou que tenham o JavaScript desabilitado, não reconhecem a tag
Utilize o comentário do JavaScript (//) para comentar o final do comentário de Html!
2.1. Escrevendo em uma Página – document.write( )
Você deve ter percebido que utilizamos várias vezes nos exemplos o comando document.write( ). Em JavaScritp nós o chamamos de Método, porque ele executa uma função (ação), ou seja, com ele você pode escrever no documento, que é o corpo da página em HTML.
Exemplo:
O conteúdo dos parênteses deve vir entre aspas ou apóstrofes, a menos que seja uma variável. Todos os comandos em JavaScript terminam com ponto e vírgula (;).
3. Caixas Pop-up
As caixas Pop-up também são métodos em JavaScript. Com elas podemos interagir com o usuário exibindo mensagens, recebendo dados através da caixa de diálogo e confirmações ou não de informações.
3.1. Método alert( )
Exibe uma caixa de mensagem e aguarda um clique do usuário no botão para fechá-la.
Exemplo:
Javascript
Faculdade de Tecnologia de São de Paulo
3.2. Método prompt( )
Abre uma caixa de diálogo para que o usuário possa entrar com dados.
Neste exemplo, o texto entre parênteses será exibido na parte superior da caixa pop-up e o campo de resposta aparecerá com a palavra “undefined” selecionado.
Neste outro exemplo, o texto após a vírgula e dentro dos parênteses, será exibido no campo de resposta como resposta padrão, se preferir deixar a resposta em branco, não inclua conteúdo nem espaços entre as aspas. A resposta poderá ser armazenada em uma variável para ser tratada posteriormente pelo programa.
3.3. Método confirm( )
Exibe uma caixa de confirmação contendo dois botões: (sim) e (não).
Exemplo:
A resposta também poderá ser armazenada em uma variável para ser tratada posteriormente pelo programa.
4. Caracteres de Escape
Os caracteres de escape são usados em Strings para:
- Evitar que certos caracteres causem erros dentro do programa;
- Adicionar formatação (como retorno de carro) a Strings.
Caracter Descrição
\b Backspace \t Tabulação Horizontal \f Avanço de Formulário (form feed) \n Nova Linha (line feed) \r Retorno de Carro \” Aspas Duplas \’ Apóstrofe \ Barra invertida
Javascript
Faculdade de Tecnologia de São de Paulo
5.2. Nomes de Variáveis
Nomes de variáveis só podem conter letras maiúsculas e/ou minúsculas, números e sublinhado, portanto, não podem conter espaços, hífens ou outros caracteres especiais;
O primeiro caractere do nome da variável deve ser uma letra ou o sublinhado;
Javascript é “ case sensitive”, portanto, letras maiúsculas são diferentes de minúsculas. Atenção!!!
Não há limite oficial no comprimento de nomes de variáveis, portanto, vale o bom senso.
Utilize sempre nomes mnemônicos, ou seja, que traduzam o conteúdo da variável.
Exemplos de nomes válidos:
Total_geral nome _num i (que é diferente de I)
6. Tipos de Dados em JavaScript
Em JavaScript você não precisa definir uma variável especificando o tipo de dados que ela armazenará (exceto em casos raros), ela se adaptará ao tipo de dados do conteúdo a ela atribuído.
Tipos de Dados do JavaScript:
6.1. Básicos
Number - Números Inteiros ou de Ponto Flutuante.
Ex.: 0; 1; -3; 42; 3,1415926535897932384626433832795 ou 3.76e2.
String - Trata-se de uma cadeia de caracteres (entre aspas).
Ex.: “Meu nome é Guilherme”.
Boolean - Booleanos ou Lógicos; possuem dois valores: Verdadeiro ou Falso. Ex.: true; false.
6.2. Especias
Valores numéricos especiais: Positive infinite – Infinito positivo.
Negative infinite – Infinito negativo.
0 - zero positivo e negativo.
NaN - Not a Number (Não é um Número). Usualmente é gerado como resultado de uma operação matemática que não faz sentido, por exemplo, divisão de qualquer número por zero.
Não há possibilidade de digitar nenhum dos valores acima. Os valores relacionados com infinito resultam quando se ultrapassa o limite de 10^308 ou 10^ -308. Exemplo, multiplicando 1.0e300 por si mesmo. Eles não são muito úteis para nós.
Javascript
Faculdade de Tecnologia de São de Paulo
Tipos especiais:
Null - Valor nulo, quando não há nada de útil disponível.
Undefined - Indefinido. Na maioria das vezes é o mesmo que null. Sua presença indica que algo saiu errado em seu JavaScript.
7. Conversão entre Tipos de Dados
O JavaScript trata conversões entre tipos de dados para você sempre que ele pode. Exemplo:
total= 40; document.write(“O total é ” + total);
A instrução imprimirá a mensagem: “O total é 40”.
A função de document.write() trabalha com Strings, portanto, o interpretador de JavaScript automaticamente converte quaisquer não- strings na expressão em Strings antes de desempenhar a função.
A caixa prompt() também trabalha com Strings, portanto, antes de executarmos quaisquer cálculos com valores fornecidos através do prompt, devemos converter o tipo de String para números.
Às vezes, uma String pode conter um número e precisamos convertê-la em uma variável numérica regular. O JavaScript possui duas funções embutidas para transformar Strings em números:
7.1. Funções parseInt( ) e parseFloat( )
- parseInt( string ) // Converte uma string em um número inteiro.
- ParseFloat( string ) // Converte uma string em um número com ponto flutuante.
A duas funções efetuarão a leitura da string desde o seu início e retornarão uma versão numérica.
Exemplos:
- num_b = parseFloat( prompt(“Digite um número”,“”) ) ; // num_b será do tipo number. alert(num_b + “é do tipo ” + typeof(num_b));
- string_a = “45 anos de experiência!”; num_a = parseInt( string_a ) ; alert(num_a); // A variável num_a armazenará o valor 45, a parte não numérica é ignorada.
O número que será capturado deverá estar no início da String.
- Essas funções são utilizadas para converte conteúdo das caixas de texto.
7.2. Outros métodos de conversão de tipos de dados - Number(), String(), Boolean()
- String Converte o tipo de uma variável em String.
- Number Converte o tipo de uma variável em numérico.
- Boolean Converte o tipo de uma variável em booleano.
Javascript
Faculdade de Tecnologia de São de Paulo
- Módulo ou Resto da Divisão(%) a = 5 , b = 2; c = a % b; document.write(“”+c); // o valor de “c” será 1
8.2. Relacionais
Os operadores relacionais são usados em comparações (binários):
- Menor que (<) a = 5 , b = 6; alert(a < b);
- Menor ou igual a (<=) a = 3 , b = 5; alert(a <= b);
- Maior que (>) a = 4 , b = 6; alert(b > a);
- Maior ou igual a (>=) a = 5 , b = 7; alert(b >= a);
- Igual a (==) a = 3 , b = 3; alert(a = = b);
- Não igual a (!=) a = 3 , b = 4; alert(a != b);
8.3. Lógicos
Eles são utilizados em instruções condicionais. (&& e || são binários e! unário)
- E (&&) a = 6 , b = 3, c = 1; alert((a > b) && (b > c)); // (a é maior que b) e (b maior que c)
- Ou (||) a = 6 , b = 3, c = 1; alert((a > b) || (b == c)); // (a é maior que b) ou (b é igual a c)
- Negação (!) a = 6 , b = 3, c = 1; alert(a! = b); // ( a não é igual a b)
Javascript
Faculdade de Tecnologia de São de Paulo
8.4. Unários Diversos
- Incremento de prefixo e sufixo (++)
- a = 5; alert( ++ a + 2); // Adiciona 1 à variável “a” antes de executar a expressão. alert(“a = ” + a); // O resultado do alert será 8
- a = 5; alert(c ++ + 2); // Adiciona 1 à variável “a” após a execução da expressão. alert(“c = ” + c); // O resultado do alert será 7
- Decremento de prefixo e sufixo (--)
- a = 5 b = -- a + 2; // Subtrai 1 da variável “a” antes da execução da expressão, “b” receberá 6.
- a = 5 b = a -- + 2; //Subtrai 1 da variável “a” após a execução da expressão, “b” receberá 7.
- Unário (-)
- a = 2; b = - a; //Muda o sinal de positivo para negativo, portanto “b” receberá -2.
- c = -3; d = - c; //Muda o sinal de negativo para positivo, “d” receberá 3.
- Unário (+) +a //Muda o operando para o tipo número (por exemplo, era uma string).
8.5. Operadores de Atribuição
- Atribuição Plena (=) a = 3; // A Variável “a” recebe o valor 3. a = b = c = 5; // As variáveis “a”, “b” e “c” recebem o valor 5.
- Compostos: x =+ 3; // É o mesmo que x = x + 3; x =- 3; // É o mesmo que x = x - 3; x =* 3; // É o mesmo que x = x * 3; x =/ 3; // É o mesmo que x = x / 3;
8.6. Operadores Diversos
- Condicional - Ternário (? :)
- x = 1, y = 2; ( x > y )? alert(“Sim, x é Maior que y”) : alert(“Não, x é Menor que y”);
Se a expressão condicional (x > y) for verdadeira, executará a sentença após a interrogação (?), caso contrário, executará a sentença após os dois pontos (:).
- resp = ( x > y )? “Sim” : “Não”; //A variável resp receberá “Não”.
A variável “resp” é opcional; podemos criá-las se precisarmos salvar dados.
Javascript
Faculdade de Tecnologia de São de Paulo
9.2. Função sem Parâmetros
A função é executada sem receber parâmetros e/ou retornar valores.
Exemplo:
Chamando a função:
Javascript
Faculdade de Tecnologia de São de Paulo
9.4. Função retornando Valores
As funções podem retornar valores para o ponto de sua chamada.
Exemplo:
Javascript
Faculdade de Tecnologia de São de Paulo
10.5. Obtendo um Único Caractere - charAt( )
O método charAt( ) obtém um único caractere de uma string:
palavra = “Crepúsculo”; document.write(palavra .charAt( 3 ) ; // Imprime a letra “p”.
- 0 (zero) é o índice inicial da String.
- O método charAt() obtém o caractere correspondente ao índice indicado entre parênteses.
10.6. Localizando uma Substring - indexOf( )
Uma boa utilização de subtrings é localizar uma string dentro de outra String. Podemos fazer isto através do método indexOf ( ). Exemplo:
frase3 = “Brasil, meu Brasil brasileiro...”; ind = frase3 .indexOf( “Brasil” ) ; document.write(ind); // Imprime o índice inicial da substing: 0.
- Entre os parênteses indicamos a substring que queremos localizar no texto.
- Atenção com as letras maiúsculas, minúsculas e acentos!!
- O método retornará o índice inicial da substring pertencente ao texto.
- Se a substring não for localizada, retornará o valor negativo –1.
Você pode especificar um segundo parâmetro (opcional) para indicar o índice inicial da procura, a partir do qual começará a pesquisa. Exemplo:
frase3 = “Brasil, meu Brasil brasileiro...”; document.write(frase3 .indexOf( “Brasil”,1 ) ); // Imprime índice:12.
10.7. Localizando a Última Ocorrência de uma Substring – lastIndexOf( )
O método lastIndexOf() pesquisa uma substring iniciando a busca a partir do último caractere da string:
frase3 = “Brasil, meu Brasil brasileiro...”; document.write(frase3 .lastIndexOf( “Brasil” ) ); // Imprime índice:12.
Neste caso, também podemos especificar um segundo parâmetro (opcional) para indicar o índice inicial da próxima procura. Exemplo:
frase3 = “Brasil, meu Brasil brasileiro...”; document.write(frase3 .lastIndexOf( “Brasil”,11 ) ); // Imprime índice:0.
Podemos salvar os índices em variáveis para utilizarmos como parâmetros na localização das próximas ocorrências da substring, adicionando 1(um) para avançar na varredura da string ou subtraindo 1(um) para retroceder.
Javascript
Faculdade de Tecnologia de São de Paulo
11. Teste e Comparação de Valores
Agora você poderá utilizar melhor as variáveis comparando, testando e avaliando seus valores com as ferramentas fornecidas pelo JavaScript.
11.1. Instrução if/else
O if é a instrução condicional principal do JavaScript. Esta instrução tem o mesmo significado da palavra em inglês: “se”.
Exemplo:
a = 5; if ( a > 2 ) alert(“a é maior que 2”); // Exibe a mensagem “a é maior que 2”.
Esta instrução inclui uma condição entre os parênteses (a > 2). Se a condição for verdadeira, a sentença que se segue: alert(“a é maior que 2”)será executada ; caso contrário, não faz nada e o JavaScript pula para o próximo comando após o ponto e vírgula. Múltiplas instruções também podem ser escritas se incluídas entre chaves ({ }).
if (a > 2) { alert(“a é maior que 2”); b=a; }
O else (senão) trata o caso contrário, ou seja, se condição for falsa:
if (a > 2) { alert(“a é maior que 2”); a = 0; } else alert(“a é menor ou igual a 2”); // Será executada se “a” não for maior que 2.
No caso de várias ações no else, inclua as sentenças entre chaves:
if (a > 2) { alert(“a é maior que 2”); a = 0; } else { alert(“a é menor ou igual a 2”); a=5; }
Outros operadores podem ser utilizados em comparações, como os lógicos && (e) e o || (ou):
- x = 2, y = 3; if (x == 2 && y == 3) z = x + y; // O valor da variável z será 5.
Executará a sentença se as duas condições forem verdadeiras.