NIVELAMENTO PROGRMAÇÃO JAVASCRIPT
PLAYGROUND DIGITAL HOUSE
Anotações e estudos de Bruna Melloni
Maio/2020
Módulo 01: Variáveis
Espaço de armazenamento de dados
Declaração de uma variável:
- Não pode começar com maiúscula;
- Não pode ter espaços;
- Sem acentos ou caracteres especiais;
- Não pode começar com número
- Modelo camelCase
var numero = 1 dado let numero = 1 dado
palavra nome da palavra nome da
reservada variável reservada variável
Pode conter operações matemáticas | var numeroSeguinte = 1+1|
Variáveis de texto = string deve sempre estar entre aspas | var nome = “Bruna”|
Construindo um código com as variáveis:
Operações com variáveis numéricas
var numeroA = 2;
var numeroB = 5;
var resultadoSoma = (numeroA+numeroB)
console.log(resultadoSoma) // retorna 7
Concatenação de strings (soma de strings)
var nome = “Bruna”;
var sobrenome = “Melloni”;
console.log(nome + “ “ + sobrenome) // retorna “Bruna Melloni”
1
String + número
var nome = “Bruna”;
var idade = 18;
console.log(nome + “ “ + “tem” + “ “ + idade + “ “ + “anos”) // retorna “Bruna tem 18
anos”
*Para executar um código, use o comando console.log()
**Atenção para a adição de um “ “ para separar as strings na concatenação
var vs let
Ambas são palavras reservadas usadas para declarar uma variável;
Ambas suportam dados numéricos e strings;
Ambas realizam operações e concatenações; Determinados por {}
Porém, let somente será acessível dentro dos blocos de código em que for declarada. Já a var
só precisa ser declarada uma única vez.
Booleanos
Representa dois valores lógicos: true ou false
No código:
var valorVerdade = 5 > 3;
console.log(valorVerdade) // retorna true
var valorVerdade = 5 < 3;
console.log(valorVerdade) // retorna false
var numeroGrande = 67;
var numeroPequeno = 2;
var eMaior = (numeroGrande > numeroPequeno);
var eMenor = (numeroGrande < numeroPequeno);
console.log(eMaior) // retorna true
consolelog(eMenor) // retorna false
2
Módulo 02: Funções
Bloco de código que pode ser invocado;
Realiza uma tarefa específica e retorna um valor;
Podemos agrupar o código que será utilizado várias vezes.
Declarando uma função:
palavras function dobro(numero) { parâmetros da
reservadas return numero * 2; } função
ação executada pela função
*Os parâmetros devem sempre estar entre parênteses. Se não houver parâmetro, deve ser
escrito “()”;
**O código a ser executado pela função deve sempre vir entre {}.
Declarando e executando uma função (operações numéricas):
function soma(numeroA, numeroB) {
return numeroA + numeroB
}
console.log(soma(2,3)) // retorna 5
function triploDaSoma(numeroC, numeroD) {
var resultadoDaSoma = soma(numeroC, numeroD);
return resultadoDaSoma * 3
}
console.log(triploDaSoma(5,6)) // retorna 33
***A variável na função triploDaSoma chama a função soma declarada anteriormente.
Declarando e executando uma função (concatenação de strings):
3
function nomeCompleto(nome, sobrenome) {
return nome + “ “ + sobrenome
}
console.log(nomeCompleto(“Bruna”, “Melloni”) // retorna “Bruna Melloni”
Recurso .lengt conta o total de caracteres numa string
“biblioteca”.length // retorna 10
function tamanhoNomeCompleto(nome, sobrenome) {
var nome = nomeCompleto(nome, sobrenome);
return nomeCompleto.length
}
console.log(tamanhoNomeCompleto(“Bruna”, “Melloni”)) // retorna 13
****O recurso .length também contabiliza o “ “.
Funções Math
Math.abs ( ) retorna o valor absoluto: Math.abs(-125) // retorna 125
Math.round ( ) arredonda o número para cima: Math.round (3.4) // retorna 4
Math.floor ( ) arredonda o número para baixo: Math.floor (3.4) // retorna 3
Math.max ( ) retorna o maior número entre os parâmetros: Math.max (34, 50) // retorna 50
Math.min ( ) retorna o menor número entre os parâmetros: Math.min (34, 50) // retorna 34
Math.random ( ) retorna um número aleatório decimal entre 0 e 1.
Usando a função Math.random:
function gerarProbabilidade ( ) {
return Math.random * 100
}
console.log(gerarProbabilidade( )) // retorna um número aleatório em porcentagem
4
Módulo 03: Condicionais
Operadores Lógicos: permitem manipular o valor das variáveis, realizar operações e comparar
seus valores.
Existem 3 operadores: e (and); ou (or); negação (not)
AND (&&) OR ( || ) NOT ( ! )
As operações sempre retornarão um valor booleano (true ou false)
(10 > 15) && (10 != 20) // retorna false
false --------- true -------- false && todos os valores devem ser true
(10 < 15) && (10 != 20) // retorna true
true --------- true --------- true
(10 > 15) || (10 != 20) // retorna true || ao menos um valor deve ser true
false --------- true -------- true
!false // retorna true ! nega a condição, retorna o oposto
!(10 > 15) // retorna true
Condicional Simples: Condicional Com else:
if (condição) { if (condição) {
// código a executar se a condição for // código a executar se a condição for
verdadeira verdadeira
} } else {
// código a executar se a condição for
falsa
Condicional Com else if:
if (condição) {
// código a executar se a condição for verdadeira
} else if (outra condição) {
// código a executar se a condição for verdadeira
} else {
// código a executar se a condição for falsa }
5
* O símbolo para diferente é !=
** O símbolo para igual (fora de uma declaração de variável) é ===
Trabalhando com condicionais:
function eMaior(umNumero) { function hojeSeJoga (diaDeSemana) {
if (umNumero > 5) { if (diaDeSemana === “domingo”) {
return true; return “Hoje é dia de futebol !!!” }
} else { else {
return false; return “Hoje não é dia de futebol ☹”
} }
} }
console.log(eMaior(3)) // retorna false console.log(hojeSeJoga(segunda) // retorna
“Hoje não é dia de futebol ☹”
Se prestarmos atenção, este if e else são desnecessários, se as expressões forem booleanas.
Portanto, poderíamos tornar nosso código mais fácil fazendo isso:
Função eNumeroDaSorte:
Considerando como números da sorte os que são: positivos, múltiplos de 2 ou 3 e diferente de
15.
function eNumeroDaSorte(numero) {
return numero > 0 && numero != 15 && numero%3 == 0 || numero%2 == 0
}
console.log(eNumeroDaSorte(7) // retorna false
***A operação numero%3 == 0 significa que numa divisão numero/3, o resto é 0
Assim como nas operações matemáticas, as expressões booleanas podem ser organizadas
com ( ), para dar preferências à ordem. Por exemplo:
Função podeSeAposentar:
6
Considerando que a idade mínima para aposentadoria para mulheres é 60 anos, enquanto para
os homens é 65. Emambos os casos, deve-se ter pelo menos 30 anos de contribuição.
function podeSeAposentar (idade,sexo,anosDeContribuicao) {
return (idade >= 60 && sexo == F) || (idade >= 60 && sexo == M) &&
anosDeContribuicao >= 30
}
console.log(podeSeAposentar (65, F, 31)) // retorna true
É possível usar mais de um if dentro de uma função. Por exemplo:
Função medalhaSegundoOPosto(numero):
Para determinar a medalha de acordo com a colocação, considerando: 1- ouro; 2- prata; 3-
bronze; 4 ou mais: “continue tentando”.
function medalhaSegundoOPosto(numero) {
if (numero == 1) {
return “ouro” }
if (numero == 2) {
return “prata” }
if (numero == 3) {
return “bronze” }
if (numero >3) {
return “continue tentando” }
}
console.log(medalhaSegundoOPosto(2) // retorna “prata”
Módulo 04: Ciclos
Nos permitem repetir instruções de maneira simples, um certo número de vezes, desde que
uma condição seja cumprida.
7
A estrutura do ciclo for é composta por 3 partes, definidas dentro de parênteses, determinando
como as repetições serão realizadas, e definir as instruções que queremos realizar em cada
uma.
for (let i = 0; i < 5; i++)
valor inicial modificador
do contador condição
Início: identificado como uma variável (var ou let), indica a contagem inicial;
Condição: indica a condição para a repetição ser executada;
Modificador: indica a diferença entre cada repetição.
*i++ significa que será somado 1 ao i.
** a variável mais usada é a i, de “início”
Usando o ciclo for numa função:
Função imprimirAzul4( ):
Uma função que imprima a palavra “Azul” 4 vezes.
O contador inicial chamado de var i, e começamos sua contagem no 0. Seguindo a sua
condição i < 4, definimos que a rtepetição só deve ocorrer enquanto o i for menor que 4.
A cada repetição, o nosso i somará 1.
function imprimirAzul4 ( ) {
for (var i = 0; i < 4; i++)
console.log(“Azul”)
}
console.log(imprimirAzul4( )) // retorna “Azul” “Azul” “Azul” “Azul”
O computador fez a seguinte contagem:
i = 0 // retorna “Azul”
i = 1 // retorna “Azul” “Azul”
8
i = 2 // retorna “Azul” “Azul” “Azul”
i = 3 // retorna “Azul” “Azul” “Azul” “Azul”
i = 4 // para a contagem
Outro exemplo:
function passandoPor ( ) {
for (var i = 0; i < 5; i++)
console.log(“aqui eu tenho o valor de” + “ “ + i) } // retorna
“aqui eu tenho o valor de 0”
“aqui eu tenho o valor de 1”
“aqui eu tenho o valor de 2”
“aqui eu tenho o valor de 3”
“aqui eu tenho o valor de 4”
Usando if em um ciclo:
Função passandoPelosPares( ) que retorna um string para cada valor par entre 0 e 6.
function passandoPor ( ) {
for (var i = 0; i < 7; i++)
if (i%2 == 0; i++){
console.log(“aqui eu tenho o valor de” + “ “ + i)}
}
console.log(passandoPor( )) // retorna
“aqui eu tenho o valor de 0”
“aqui eu tenho o valor de 2”
“aqui eu tenho o valor de 4”
“aqui eu tenho o valor de 6”
Criando ciclos com uma quantidade variável de repetições:
Ao indicar a condição das repetições enquanto declaramos o ciclo for, podemos substituir a
condição por uma variável. Podemos então fazer com que essa variável se torne um parâmetro
para a função. Por exemplo:
9
function repetirAlgoXVezes(x) {
for (var i = 0; i < x; i++) {
console.log(“algo”)
}
console.log(repetirAlgoXVezes(3) // retorna
“Algo”
“Algo”
“Algo”
Fazendo operações com os ciclos:
Aplicando o uso dos ciclos para nos ajudar matematicamente, podemos criar uma função que
calcule uma repetição de uma operação, de forma acumulativa. Por exemplo:
Função caloriasDeCoxinhas(quantidadeDeCoxinhas):
Calcula a quantidade de calorias ganhas de acordo com a quantidade de coxinhas consumidas.
Considerando-se que a cada coxinha haja um ganho total de 300 calorias.
function caloriasDeCoxinhas(quantidadeDeCoxinhas) {
var totalCalorias = 0;
for (var i = 0; i < quantidadeDeCoxinhas; i++) {
totalCalorias = totalCalorias + 300;
} return totalCalorias
}
console.log(caloriasDeCoxinhas(3)) // retorna 900
***A função define uma variável (var) que inicia sua contagem em 0, a cada repetição do
ciclo, a função executa o código que soma 300 à variável, de forma acumulativa.
Mais um exemplo:
Função caloriasDeTrote(numeroDeVoltas), que retorna a quantidade de calorias consumida
em cada volta de trote. Considerando que a cada volta, são consumidas mais 5 vezes a
quantidade de voltas dadas.
10
function caloriasDeTrote(numeroDeVoltas) {
var totalCalorias = 0
for (i = 0; i <= numeroDeVoltas;i++) {
totalCalorias += i*5}
return totalCalorias
}
console.log(caloriasDeTrote(2)) // retorna 15 (1*5) + (2*5)
****O símbolo += representa uma soma à uma variável
Módulo 05: Arrays
Coleção de dados ordenados matrizes;
A estrutura consiste em elementos, separados por vírgulas, dentro de colchetes [ ];
Podemos armazenar quantos elementos quisermos, numéricos, strings e/ou booleans;
Cada elemento ocupa uma posição numérica, começando sua contagem pelo 0;
Um array pode ser uma matriz vazia, ou seja, sem elementos. ler arrayVazio = [ ]
let meuArray = [ “Star Wars”, true, 7 ]
nome da
variável array elemento 0 1 2
Ao invocar um array, podemos especificar um elemento a partir de sua posição dentro de
colchetes:
console.log(meuArray[1]) // retorna true
var amoMuito = [“danilo”, “de oliveira”, “henrique”]
console.log(amoMuito[0] // retorna danilo
Podemos também usar o recurso .length para saber quantos elementos um array possui:
var numeros123 = [1, 2, 3]
console.log(numeros123.length) // retorna 3
11
Podemos também adicionar e retirar elementos de um array usando os recursos .push e
.pop:
var umArray = [2, 7, 202] Deve-se indicar o elemento a ser adicionado entre
parênteses
umArray.push(103) O recurso .push adiciona um elemento no final do array
console.log(umArray) // retorna [2, 7, 202, 103]
var umArray = [2, 7, 202, 103] O recurso .pop remove o último elemento de um
umArray.pop array
console.log(umArray) // retorna [2, 7, 202, 103]
Com esses dois recursos, podemos mover elementos entre arrays. Por exemplo:
Função mover(umArray, outroArray)
Retira o último elemento do primeiro array e o adiciona no segundo.
function mover(umArray, outroArray) {
var pegarElemento = umArray.pop
outroArray.push(pegarElemento)
}
console.log(mover([1,2,3], [4,5]) // retorna [1,2], [4,5,3]
Recurso .indexOf
Retorna um valor numérico referente à posição do elemento usado como parâmetro:
var meuArray = [“bruna”, “danilo”]
var maisLindo = meuArray.indeOf(“danilo”) // retorna 2
Se pedirmos por um elemento que não pertence ao array, o código retornará um número
negativo, portanto, podemos usar esse recurso para sabermos quais elementos são
pertencentes ao array:
function contem(array, elemento) {
return array.indexOf(elemento) >=} // retornará true ou false
console.log (contem(maisLindo, “danilo”) // retorna true
Função medalhaDeAcordoComOPosto:
12
Refazendo a função feita anteriormente, podemos usar um array para nos ajudar. Usando
apenas um recurso if.
A medalha será definida de acordo com a posição do participante, sendo 1- ouro, 2- prata, 3-
bronze, 4+- continue tentando.
var posicoes = [“continue tentando”, “ ouro”, “prata”, “bronze”];
function medalhaDeAcordoComOPosto(numero) {
if (numero >= posições.length) {
return “continue tentando”}
return posicoes[numero]
}
console.log(medalhaDeAcordoComOPosto(3)) // retorna “bronze”
*Nessa função, foi criada uma condicional que retorna um elemento do array de acordo com o
número indicado, representando a posição. Foi definido também que se esse valor numérico
for maior ou igual à quantidade de elementos no array (4), será devolvido o string “continue
tentando”. Lembrando que, como o primeiro elemento de um array está na posição 0, o
primeiro elemento do array declarado também é o string “continue tentando”.
Ciclos de array
É possível criarmos um ciclo de array, quando desejarmos realizar uma operação matemática
acumulativa.
var umPeriodo = [20, 56, -50, 500, 0, 1000, 750, -20,]
function lucroTotal(umPeriodo) { Note: o ciclo deve terminar
var soma= 0; enquanto i < umPeriodo.length, já
var mes = 0;
for (var i = 0; i < umPeriodo.length; i++) { que o número de elementos é 1 a
mes = umPeriodo[i]; mais que o número de posições
soma= soma + mes;
} dos elementos (contagem começa
return soma; no 0).
}
console.log(lucroTotal(umPeriodo)) // retorna 2256
**A cada repetição, será somado o valor do elemento na posição indicada pelo i.
Função quantidadeDeMesesComLucro(umPeriodo):
Baseado na função anterior, que contabilizou o lucro total durante um período específico,
vamos agora calcular em quantos meses houve lucro.
function quantidadeDeMesesComLucro(umPeriodo) {
var quantidade = 0;
for (var mes = 0; mês < umPeriodo.length; mês++) [
if (umPeriodo[mês] > 0)
quantidade += 1}
return quantidade
}
13
console.log(quantidadeDeMesesComLucro(umPeriodo)) // retorna 6
Função saldosDeMesesComLucro(umPeriodo)):
Seguindo a mesma linha do exemplo anterior, a função agora deve retornar um array com os
saldos dos meses com lucro.
function saldoDeMesesComLucro (umPeriodo) {
var saldos = 0;
for (var mes = 0; mes < umPeriodo.length; mes++) {
if (umPeriodo[mes] > 0) saldos.push[mes] }
return saldos
}
console.log(saldoDeMesesComLucro (umPeriodo)) // return 2326
Função naipeDeTruco:
Dado um parâmetro, indicando um naipe, retorna uma lista de strings (array), uma por cada
carta desse naipe. Lembrando que num baralho de truco, são usadas todas as cartas numeradas
de 1 a 12, exetuando-se as cartas 8 e 9.
function naipeDeTruco(naipe) {
var cartas = [ ];
for (var = 1; i <= 12; i++) {
if (i != 8 && i!= 9)
cartas.push(i + “ “ + “de” + “ “ + naipe) }
return cartas
}
console.log(naipeDeTruco(copas)) // retorna [“1 de copas”, “2 de copas”, “3 de copas”... “12
de copas”]
Desafios:
1. Professora Furiosa
Uma professora de programação, cansada de que os estudantes cheguem
tarde, decidiu que vai cancelar a aula se há poucos presentes.
Ela representa a entrada dos estudantes como um array de tempos de
chegada tarde, em minutos. Por exemplo, se um estudante chegou 10
minutos atrasado, outro 5 minutos antes da hora, outro com 3 minutos de
atraso, e outro pontual, poderá representar assim:
var alunosDaSegunda = [10, -5, 3, 0];
14
Com essa informação e a quantidade mínima de estudantes para que suceda
o curso, a professora quer saber se a aula acontecerá. Por exemplo, supondo
que a quantidade mínima de estudantes para que a aula aconteça é de 2
alunos, então o curso da segunda-feira se realizará, porque houve um
estudante que foi pontual e um estudante que chegou cedo.
acontece(alunosDaSegunda, 2)
true
Mas se a quantidade mínima fosse 3, a aula não aconteceria:
acontece(alunosDaSegunda, 3)
false
Escreva as seguintes funções: 1. acontece, que diz se a aula sucederá de acordo com o array dos
estudantes que entraram. 2. aberturas, que utiliza um array com os arrays dos estudantes que
entraram nos outros dias, e a quantidade mínima de estudantes, e diga quais os dias em que as
aulas aconteceram e quais não. Por exemplo:
aberturas([alunosDaSegunda, alunosDaTerça, alunosDaQuarta], 2)
[true, false, false]
Resposta:
function acontece (alunosQueChegaram, minimoParaComecar) {
var quantidadeNaHora = 0;
for ( var aluno = 0; aluno < alunosQueChegaram.length; aluno+
+) {
if (alunosQueChegaram[aluno] <= 0)
quantidadeNaHora++} {
if (quantidadeNaHora >= minimoParaComecar) return true}
return false
}
function aberturas (alunosQueChegaram, minimoParaComecar)
{
var resposta = [ ];
for (var i = 0; i < alunosQueChegaram.length; i++) {
resposta.push(acontece(alunosQueChegaram[i],
minimoParaComecar)) }
15
return resposta
}
2. Produto
Necessitamos uma função produto que receba um array de números e
retorne o produto: o resultado de multiplicar todos os elementos entre
si.
Por exemplo, produto([1, 4, 7]) deve retornar 28, que é 1 * 4 * 7.
Escreva a função produto
Resposta:
function produto(arrayNumeros) {
var multiplicacao = 1;
for (var i = 0; i < arrayNumeros.length; i++) {
multiplicacao *= arrayNumeros[i] }
return multiplicacao
}
3. Fatorial
Escreva uma função fatorial, que calcule o fatorial de um número.
Resposta:
function fatorial (numero) {
var fator = 1;
for (var i = 1; i <= numero; i++) {
fator *= i
}
return fator
}
4. Mais Menos
Necessitamos uma função maisMenos que receba um array e retorne outro
com os seguintes três números:
1. na primeira posição, a fração de números que são positivos
2. na segunda posição, a fração de números que são zero
3. na última posição, a fração de números que são negativos
Por exemplo, maisMenos([1, 2, 0, -1]) deveria retornar [0.5, 0.25, 0.25],
devido a que há 50% de positivos, 25% de zeros, e 25% de negativos.
16
Escreva a função maisMenos.
Resposta:
function maisMenos (umArray) {
var outroArray = [ ];
var positivo = 0;
var zero = 0;
var negativo = 0;
for (var i = 0; i <= umArray.length; i++){
if (umArray[i] > 0) positivo++;
if (umArray[i] == 0) zero++;
if (umArray[i] < 0) negativo++}
outroArray.push(positivo/umArray.length);
outroArray.push(zero/umArray.length);
outroArray.push(negativo/umArray.length);
return outroArray
}
5. Escada
6. Queremos representar uma escada com altura variável, utilizando um
array de strings.
7. Por exemplo, uma escada com altura 3, representaremos com o
seguinte array:
8. var escada3 = [
9. " #",
10. " ##",
11. "###"
12. ]
13.E uma escada com altura 5, da seguinte forma:
14. var escada5 = [
15. " #",
16. " ##",
17. " ###",
18. " ####",
19. "#####"
20. ]
21. Escreva uma função escada que utilize uma altura (um número) e retorne um array que
represente a escada correspondente. Não esqueça que o espaço " " faz parte da resposta :)
Resposta:
function escada (altura) {
var array = [ ];
17
for(var i = 1; i <= altura; i++) {
var espaco = altura - i;
array.push(" ".repeat(espaco) + "#".repeat(i))
}
return array
}
22.Árvore Utópica
As árvores utópicas crescem de uma forma particular, em dois ciclos:
cada primavera dobram seu tamanho
cada verão crescem um metro
Se Laura planta uma árvore utópica com um metro, no final do outono, qual
seria sua altura depois de N ciclos?
Alguns exemplos:
si N = 0, sua altura será 1 metro (não cresceu nada)
si N = 1, sua altura será de 2 metros (dobrou a altura na primavera)
si N = 2, sua altura será de 3 metros (cresceu um metro mais no verão)
si N = 3, sua altura será de 6 metros (dobrou a altura na primavera
seguinte)
E assim ...
Escreva a função alturaArvoreUtopica, que utilize uma quantidade de ciclos de crescimento, e
retorne a altura resultante da árvore de Laura.
Resposta:
function alturaArvoreUtopica (ciclos) {
var altura = 1
for (var i = 0; i < ciclos; i++) {
if (i & 1) {altura+=1
} else {
altura*=2};
} return altura
}
18