Funções-JavaScript

Prévia do material em texto

Funções!
Lógica de programação para Web.
Lógica!
Agenda
O que vamos aprender?
• Funções 
• Funções JavaScript
• Exemplos
• Atividades
• Dicas!
• Referências
Lógica!
Funções
 
É um programa que auxilia o programa principal através da realização de uma 
determinada subtarefa.
As funções são chamadas dentro do corpo do programa principal como se fossem 
comandos.
Também costuma receber os nomes de sub-rotina, subalgoritmo ou método.
Lógica!
Funções
Após seu término, a execução 
continua a partir do ponto onde foi 
chamado. 
É importante compreender que a 
chamada de uma função simplesmente 
gera um desvio provisório no fluxo de 
execução.
Lógica!
Funções
É conveniente utilizá-los quando uma 
determinada tarefa é efetuada em 
diversos lugares no mesmo código.
Ao invés de escrever-se um trecho 
diversas vezes, escreve-se uma função e 
a chama diversas vezes.
Quando
utilizar tal recurso?
Lógica!
Funções
Elas reduzem o tamanho do algoritmo.
Funções --> Podem ou não retornar algum valor
Facilitam a compreensão e visualização do algoritmo.
 
Normalmente, são declarados no início do algoritmo e podem ser 
chamados em qualquer ponto após sua declaração.
 
Funções
Entendendo as funções e suas formas de uso!
Lógica!
Funções
Como definir uma função?
• Functions declaration (Função de declaração)
• Functions expression (Função de expressão)
• Arrow Functions (Função de flecha)
• Functions constructor (Função construtora)
• Generator Functions (Função geradora)
 
Lógica!
Funções
As definições mais comuns são 
declaração e expressão. 
Essas duas definições são bem 
similares. 
As funções podem retornar 
alguma informação, usando o 
comando Return. 
Lógica!
Funções
Função de declaração: 
Toda função de declaração começa com a palavra reservada e 
obrigatória function.
Seguida pelo nome da função (também obrigatório);
Pode conter uma lista de parâmetros (opcionais) separados por vírgula e 
encapsulados em parênteses (obrigatórios);
E o último passo é definir as chaves (obrigatórias) que será o corpo da 
função. 
Lógica!
Funções
Lógica!
Funções
Função de expressão: 
As funções de expressão e declaração são muito parecidas. 
Uma das sutis diferenças é que ela está sendo atribuída para uma variável, 
onde não definimos o nome da função e sim o nome da variável que irá 
referenciar a mesma.
Atribuir uma função à uma variável pode ser muito útil, tornando o código mais 
simples de entender.
Lógica!
Funções
Exemplos
Motivação para o uso de funções!
Lógica!
Funções
Exemplo 1:
Suponha uma programa 
que imprima a idade de 
algumas pessoas. 
Inicialmente é aplicado 
uma tag de quebra 
de linha. 
E se for decidido alterar 
a quebra de linhas ? 
 
Lógica!
Funções
Exemplo 1:
Veja que para alterar a 
quebra de linha, foi 
acrescentado apenas a tag 
. 
E se essa alteração se 
tornar um pedido 
recorrente no projeto. 
Lógica!
Funções
Exemplo 1:
E mais uma vez para 
alterar a quebra de linha, 
basta modificar a 
quantidade da tag 
. 
Será essa solução prática 
e funcional?
Lógica!
Funções
Exemplo 1:
Definitivamente, essa não 
é a melhor solução!!
Criar sua própria 
funcionalidade é muito 
mais eficiente.
Funções é uma boa 
solução.
Lógica!
Funções
Exemplo 1:
Ainda que seja solicitado a 
mudança de linhas, a 
mudança será realizada 
apenas na Função.
Reduz o trabalho de 
buscar todo o código pra 
fazer as mudanças.
Lógica!
Funções
Exemplo 2:
Faça um programa que leia dois 
números e faça as seguintes 
operações com esses números:
a) Soma
b) Subtração
c) Multiplicação
d) Divisão
Imprima o resultado!!
Lógica!
Funções
Exemplo 2:
Mantém a função 
saltoLinha.
Crie 4 novas funções 
para as devidas 
operações.
Lógica!
Funções
Exemplo 3:
Encontrar a solução de uma raiz quadrada é 
encontrar os possíveis valores de x. O valor 
de delta influencia totalmente no resultado final. 
delta 0 : possui duas raízes
Faça um programa que encontre as raízes. Faça 
delta como uma função.
Lógica!
Funções
Lógica!
Funções
Do ponto de vista 
conceitual, o que significa 
Math e sqrt?
Math.sqrt(delta)
Math → Objeto
sqrt() → Método
Portanto, sqrt() é uma 
função interna do 
JavaScript.
Funções JavaScript
Funções padronizadas do JavaScript!
Lógica!
Funções
JavaScript, é uma linguagem orientada 
a objeto.
Para cada página HTML que é 
carregada no navegador, é criado um 
objeto document. 
Através desse objeto, é possível acessar 
todos os elementos HTML (tags) 
definidos na página com o uso de 
JavaScript. 
Lógica!
Funções
Nos próximos slides 
serão apresentados 
métodos que podem ser 
acessados através de 
certos objetos e que 
tem o poder enriquecer 
a programação.
clear() - limpa a tela da janela atual. 
Ex: document.clear( ) 
open() - Abre um documento e envia 
(mas não exibe) a saída dos métodos 
write/writeln. Os dados enviados são 
exibidos, quando é encontrado o método 
close. 
Ex: document.open( )
Lógica!
Funções
close() - Termina uma seqüência iniciada com o método open, exibindo o que 
tinha sido apenas enviado. 
Ex: document.close( ) 
write() - Imprime informações na página HTML. 
Ex: document.write("Qualquer coisa" [,variável] [,..., expressão]) 
writeln() - Imprime informações na página HTML e passa para a próxima linha. 
Em meus testes, esse método não apresentou diferença com relação ao 
método write.
Ex: document.writeln("Qualquer coisa" [,variável] [,..., expressão])
Lógica!
Funções
Date é um objeto muito útil que 
retorna a data e hora do sistema no 
seguinte formato: Dia da semana, 
Nome do mês, Dia do mês, 
Hora:Minuto:Segundo e Ano.
 
Como todo objeto, podem ser 
criadas novas instâncias para este 
objeto, essa prática possibilita a 
utilização de quantos objetos data 
você precisar.
Forma geral: 
NovoObjeto = NEW date( ) 
Onde, NovoObjeto = Objeto 
definido pelo usuário, para 
manipular datas.
getMonth() - Obtém o número do 
mês. Retornando um valor entre 0 e 
11. ( janeiro=0).
Ex: Mês = NovoObjeto.getMonth( )
Lógica!
Funções
getDay() - Obtém o número do dia, considerando-se a semana. Retornando 
um valor numérico entre 0..6. Lembre-se de que a semana começa no 
domingo, logo 0, corresponde ao domingo. 
Ex: DiaDaSemana = NovoObjeto.getDay( )
getYear() - Obtém um valor numérico correspondente ao ano. 
Ex: Ano = NovoObjeto.getYear( ) 
setYear() - Estabelece um novo valor ao ano. O valor deve ser maior ou igual a 
1900. 
Ex: NovoObjeto.setYear(1997) 
Lógica!
Funções
Math é um objeto que acompanha o JavaScript. Ele é utilizado para realizar 
operações matemáticas.
Math.abs(x)
Retorna o valor absoluto (sem sinal) do número passado.
Math.abs('-1'); // 1
Math.abs(-2); // 2
Math.sin(x)
Retorna o seno de um número (sinx).
Math.sin(0); // 0
Math.sin(1); // 0.8414709848078965
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Math/abs
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Math/sin
Lógica!
Funções
Math.pow(x,y)
Retorna a base x elevada à potência y do expoente.
Math.pow(7, 2); // 49
Math.pow(7, 3); // 343
Math.random()
Retorna um número pseudo-aleatório entre 0 e 1.
Math.random(); //0.8854927964642019
Math.random(); //0.24677687802268955
Math.random(); //0.1632699093589356
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Math/pow
https://developer.mozilla.org/pt-BR/docs/Web/JavaScript/Reference/Global_Objects/Math/random
Lógica!
Conclusão
Funções são utilizados com muita frequência 
em desenvolvimento de softwares.
Evita duplicação de código quando é 
necessário executar a mesma operação 
várias vezes.
Deixa o entendimento do algoritmo 
mais intuitivo, poisé retirado a parte 
complexa do código do fluxo principal do 
algoritmo, etc.
Atividades
Funções!
Lógica!
Atividade 1
Crie um algoritmo para 
verificar se um valor é par ou 
ímpar usando rotinas internas 
ou funções.
Lógica!
Escreva o algoritmo, usando função, que calcule o 
fatorial de um número.
A definição de fatorial é:
F(n) = 1, se n = 0 ou n = 1
F(n) = n.F(n-1), se n>1
onde n é um número inteiro positivo. Uma propriedade 
(facilmente verificável) dos fatoriais é que: n! = n . (n-1)! 
Esta propriedade é chamada de propriedade recursiva: 
o fatorial de um número pode ser calculado através do 
fatorial de seu antecessor.
Atividade 2
Lógica!
Faça um algoritmo para exibir os 
10 primeiros elementos de uma 
série de Fibonacci usando 
função com passagem de 
parâmetros.
Atividade 3
Lógica!
Escreva um programa que leia um 
valor inteiro (maior ou igual a 1 e 
menor ou igual a 10) e exibe a 
tabuada (até 10) de multiplicação do 
número lido.
Funcao 
Tabuada(n1,n2:inteiro):inteiro;
Atividade 4
Lógica!
Atividade 5
Faça um programa que leia 3 
números e em seguida imprima o 
resultado em ordem decrescente.
Use o conceito de Função para 
desenvolver o código.
Dicas!
Funções!
Lógica!
Dicas!
https://medium.com/reactbrasil/como-o-javascript-
funciona-entendendo-as-fun%C3%A7%C3%B5es-e-
suas-formas-de-uso-eb387c7fa138
Para saber um pouco mais 
sobre Funções, explore o texto 
indicado no link abaixo. 
Boa Leitura!!
https://medium.com/reactbrasil/como-o-javascript-funciona-entendendo-as-fun%C3%A7%C3%B5es-e-suas-formas-de-uso-eb387c7fa138
https://medium.com/reactbrasil/como-o-javascript-funciona-entendendo-as-fun%C3%A7%C3%B5es-e-suas-formas-de-uso-eb387c7fa138
https://medium.com/reactbrasil/como-o-javascript-funciona-entendendo-as-fun%C3%A7%C3%B5es-e-suas-formas-de-uso-eb387c7fa138
Referências!
Lógica!
[1] P. Balduino; Dominando JavaScript com jQuery. 2012. Ed. Casa do Código.
[2] Tutorial JavaScript W3Schools. Learn to code. https://www.w3schools.com/js/default.asp. Acessado 
em Julho/2023. 
[3] Douglas Crockford. Javascript: The world’s most misunderstood programming language, 2001. 
https://www.crockford.com/javascript/. Curso acessado em Julho/2023. 
[4] A. Goldman, F. Kon, Paulo J. S. Silva; Introdução à Ciência da Computação com Java e Orientação a 
Objetos (USP). 2006. Ed. USP.
[5] Algoritmo e lógica de programação. Acessado julho/2023: https://visualg3.com.br/
[6] G. Silveira; Algoritmos em Java; Ed. Casa do Código.
[7] M. T. Goodrich, R. Tamassia; Estrutura de dados e algoritmos em Java. Ed Bookman. 2007.
[8] Algoritmo e lógica de programação. Acessado julho/2023: https://www.cursoemvideo.com/
[9] P. Silveira, R. Turini; Java 8 Pratico: lambdas, streams e os novos recursos da linguagem. Ed. Casa do 
Código.
[10] Linguagem Java: Curso acessado em Julho/2023: https://www.udemy.com/
[11] Linguagem JavaScript: Curso acessado em Julho/2023: https://www.cursoemvideo.com/
Referências
https://www.w3schools.com/js/default.asp
https://www.crockford.com/javascript/
Até a próxima!
	Slide 1: Funções!
	Slide 2: Agenda
	Slide 3
	Slide 4
	Slide 5
	Slide 6
	Slide 7: Funções
	Slide 8
	Slide 9
	Slide 10
	Slide 11
	Slide 12
	Slide 13
	Slide 14: Exemplos
	Slide 15
	Slide 16
	Slide 17
	Slide 18
	Slide 19
	Slide 20
	Slide 21
	Slide 22: Funções
	Slide 23: Funções
	Slide 24: Funções
	Slide 25: Funções JavaScript
	Slide 26: Funções
	Slide 27: Funções
	Slide 28: Funções
	Slide 29: Funções
	Slide 30: Funções
	Slide 31: Funções
	Slide 32: Funções
	Slide 33: Conclusão 
	Slide 34: Atividades
	Slide 35: Atividade 1 
	Slide 36: Atividade 2
	Slide 37: Atividade 3 
	Slide 38: Atividade 4 
	Slide 39: Atividade 5 
	Slide 40: Dicas!
	Slide 41: Dicas!
	Slide 42: Referências!
	Slide 43: Referências
	Slide 44: Até a próxima!