Entendendo validações e operações aritméticas com Javascript

Nesse tutorial abordo alguns temas da linguagem Javascript, tais como: variáveis, operadores, caixas de diálogo, comando de impressão, funções, eventos e conversão de tipos.

[ Hits: 24.752 ]

Por: jose claudio em 04/08/2010


Funções, eventos e conversão de tipos



Funções

Funções são trechos de códigos que podem ser acionados através de uma chamada ou através de um evento.

Podemos chamar uma função em qualquer ponto da página e se a mesma estiver em um arquivo .js, podemos chamá-la em qualquer página que faz referência ao arquivo Javascript.

As funções geralmente são criadas em um arquivo .js ou no cabeçalho (<head>) do documento html.

Uma função pode ou não retornar uma resposta para o ponto em que foi chamada, caso necessite de um retorno (resposta), utilizamos o comando return.

<script language="javascript">
function nomeDoMetodo(param1, param2, ....)
{
//instruções
return valor; // opcional, usado somente quando necessário
}
</script>

  • Palavra-chave utilizada para criar a função Nome do método
  • Parâmetros necessários para a função ser processada ((param1)(param2)(opcional))
  • Corpo da função, sempre delimitado por chaves {...}
  • Comando return, usado quando precisamos retornar uma resposta da função.

Exemplos básicos de funções:

<script language="javascript">

// Função soma, recebe dois parâmetros (a , b), efetua a soma entre eles e imprime na página, pulando uma linha com o BR.

function soma(a , b)
{
   document.write((a+b)+"<br/>");
}

// Função lerNome, não recebe parâmetros, lê um nome através da janela de prompt e depois retorna esse nome (return) para o ponto em que foi chamada.

function lerNome()
{
   var nome;
   nome = prompt("Digite seu nome","");
   return nome;
}

//chama a primeira função
//chama a função soma duas vezes com valores diferentes para a e b.
soma(2,2);
soma(3,4);

//chama a segunda função
//chama a função lerNome, como a função retorna um valor, devemos atribuir este retorno para uma variável, para que posteriormente possamos manipular essa informação.

var resp;
resp= lerNome();
alert(resp);
</script>

Eventos

Os eventos são ações que o usuário faz em uma página e que são associados geralmente as funções do Javascript ou as funções que nós criamos em nossos códigos.

Com a utilização dos eventos, podemos criar páginas mais dinâmicas.

Principais eventos:

Obs.: Existem outros eventos para mouse e alguns para tratarmos o teclado, neste artigo, citamos somente os principais, porém você poderá encontrar uma referência completa em livros ou em alguns sites da web.

EventoQuando é acionado
onloadSempre que a página é carregada ou recarregada.
onunloadSempre que a página é trocada ou fechada.
onfocusQuando um elemento recebe o foco.
onblurSempre que um campo de formulário perde o foco.
onchangeSempre que um campo tiver seu conteúdo alterado.
onclickSempre que um elemento receber um clique.
onmouseoverQuando o mouse fica sobre o elemento.
onmouseoutQuando o mouse for retirado de cima do elemento.
onselectSempre que um conteúdo de um campo é selecionado.
onsubmitQuando enviamos (botão submit) um formulário.


Exemplo:

<html>
<head>
<script language="javascript">
function lerNome()
{
   var nome;
   nome = prompt("Digite seu nome","");
   alert("Seu nome é: "+ nome);
}
</script>
</head>
<body>
<input type="button" value="Ler o nome" onclick="lerNome()" />
</body>
</html>

Conversão de tipos

Como comentado anteriormente, quando utilizamos a caixa de prompt para entrada de dados do usuário, ou até mesmo através de campos de texto de formulários, os valores lidos são sempre textos.

Caso seja necessário realizar alguma operação matemática com os valores lidos, precisamos inicialmente convertê-los em números, para isso temos duas funções em Javascript que convertem para inteiro ou para float.

Para converter um texto em número inteiro utilizado a função parseInt. Sintaxe:

// Valor a ser convertido.
variável = parseInt(valor [, base]);

// Base da conversão (opcional).

Para converter um texto em número real (float), utilizamos a função parseFloat. Sintaxe:

variável = parseFloat(valor);

Valor a ser convertido.

Exemplo de conversão de tipos:

<script language="javascript">
function soma(a , b)
{
   alert(a + " + " + b + " = " + (a+b));
}

//modo 1
var a;
var aux = prompt("Digite o valor de a","");
a = parseInt(aux);

//modo 2
var b = parseInt(prompt("Digite o valor de b",""));

//chama a função
soma(a,b);
</script>

Pessoal, gostaria de agradecer a todos que já contribuíram com o VOL e que continuem ajudando ao próximo sempre. Estou sempre online no MSN.

MSN: claudio [] linuxtec.com.br
Site: www.linuxtec.com.br

Abraços e bom estudo a todos!

Página anterior    

Páginas do artigo
   1. Entendendo Javascript
   2. Variáveis e operadores
   3. Caixas de diálogo e comando de impressão
   4. Funções, eventos e conversão de tipos
Outros artigos deste autor
Nenhum artigo encontrado.
Leitura recomendada

Automação de tarefas com Gulp

AJAX - Parte 1

Extensões imperdíveis para quem usa o Git (e o GitHub) no Brackets

CSS - Manual de Estilo (parte 2)

Introdução ao Jython

  
Comentários
[1] Comentário enviado por psfdeveloper em 25/08/2010 - 12:44h

Caro José,

eu programo há bastante tempo em Javascript e vi a evolução recente da linguagem, de uma ferramenta para pequenos programas web, para uma linguagem completa de programação utilizada em grandes projetos (Como o navegador Firefox, implementado em javascript e C++ sobre uma API imensa baseada no Gecko e em uma linguagem de interface gráfica chamada XUL (ver https://developer.mozilla.org/en-US/).

O Google levou o Javascript para um novo patamar, ao programar aplicativos como o GMail e o Google Docs em HTML e Javascript. Esses sistemas são longe de serem pequenos ou simples scripts.

O Javascript pode ser utilizado para fazer aplicativos stand-alone (usando o XULRunner, o SpiderMonkey/TraceMonkey ou o Rhino, o Javascript desenvolvido sobre a plataforma Java).

Mas nada disso tira o mérito de sua explicação, principalmente quanto à comparação com a linguagem Java, cuja proposta é completamente diferente.

A única coisa que eu possa, realmente, discordar é que Javascript "simule" programação orientada a Objetos. Uma linguagem Orientada a Objetos não é apenas uma que tenha uma palavra reservada "class", como o Java ou o C++, mas uma que possua ferramentas necessárias para a programação orientada a objetos. Quando você diz que o Javascript não é orientada a objetos, é porque o Javascript é uma linguagem que não força utilização de determinado paradigma de programação.

Javascript é considerada Orientada a Objetos em sentido estrito e suporta totalmente o OOP através do conceito de "protótipos", como pode ser visto no link http://en.wikipedia.org/wiki/Prototype-based . Além disso, Javascript possui poderosas capacidades dinâmicas que podem classificá-la como uma linguagem funcional, par a par com o Lisp.

Infelizmente, os maiores usuários de JavaScript são designers que possuem conhecimento restrito de programação adequado ao trabalho deles, que é fazer design, não programar. Acho que a internet seria muito melhor se mais programadores se aproximassem do JavaScript ou se mais Designers se tornassem programadores efetivamente.

Parabéns pelo seu artigo.


Contribuir com comentário




Patrocínio

Site hospedado pelo provedor RedeHost.
Linux banner

Destaques

Artigos

Dicas

Tópicos

Top 10 do mês

Scripts