Função é um bloco de código que executa determinada ação quando for chamada.
Preciso calcular a soma de 2 números, ou buscar um valor dento de uma array, ou fazer outras coisas, crio uma função para executar esta tarefa específica.
Por exemplo:
<!DOCTYPE html>
<html>
<head>
<title> Funções JavaScript</title>
<script type="text/javascript">
function mostraMsg () {
document.getElementById("msg").innerHTML="Você chamou a função";
}
function limpaMsg () {
document.getElementById("msg").innerHTML="";
}
</script>
</head>
<body>
<button onClick="mostraMsg();">Mostra Msg</button>
<button onClick="limpaMsg();">Limpa Msg</button>
<div id="msg"></div>
</body>
</html>
A função acima precisou ser chamada por um evento de click, falarei de eventos mais para frente, mas temos também em javaScript funções que não precisam ser chamadas, estas são denominadas funções auto-executáveis
Adicionaremos uma função auto-executavel no código acima:
<!DOCTYPE html>
<html>
<head>
<title> Funções JavaScript</title>
<script type="text/javascript">
function mostraMsg () {
document.getElementById("msg").innerHTML="Você chamou a função";
}
function limpaMsg () {
document.getElementById("msg").innerHTML="";
}
function chamaAlert(){
alert("Fui chamado por uma função");
}
chamaAlert();
</script>
</head>
<body>
<button onClick="mostraMsg();">Mostra Msg</button>
<button onClick="limpaMsg();">Limpa Msg</button>
<div id="msg"></div>
</body>
</html>
Sem você clicar em nada esta função chamará um mostrará uma mensagem na tela.
Declarando funções.
As funções podem ser declaradas de duas formas, anonimamente ou não.
Voltarei no código e mudarei a forma que as funções foram declaradas para dar um exemplo.
<!DOCTYPE html>
<html>
<head>
<title> Funções JavaScript</title>
<script type="text/javascript">
//Esta não é uma função anônima, ela já foi declarada com um nome
function mostraMsg () {
document.getElementById("msg").innerHTML="Você chamou a função";
}
//Esta é uma função declarada de forma anônima
var limpaMsg = function () {
document.getElementById("msg").innerHTML="";
}
</script>
</head>
<body>
<button onClick="mostraMsg();">Mostra Msg</button>
<button onClick="limpaMsg();">Limpa Msg</button>
<div id="msg"></div>
</body>
</html>
Funções são ainda mais complexas, pois em javaScript elas são objetos, posso chamar uma função dentro de outra função ou uma cascata de funções, mostrarei isso em outro post.
Publicidade
Configurações de privacidade
Curtir isso:
Curtir Carregando...
Relacionado
Bognar Junior 
