Mapa de av… / ...

/ Algoritmos

Algoritmos
cover

Algoritmo é como uma sequência de passos para

resolver um problema. Pense em um jogo aonde
um heroi está a um passo do inimigo e precisa
acerta-lo, para isso é preciso fazer uma
sequência logica:

O problema: Quais ações nosso herói precisa

realizar para passar dessa fase?

O algoritmo é a sequência lógica de ações que

devem ser executadas para resolver um problema
:
:
 Fluxograma

Fluxograma desenvolvido em Aula

:
:
 Mapa de a… / ... / Estrutura de …

Estrutura de um
programa
cover

As features (ou funcionalidades) em um aplicativo

são as diferentes tarefas ou funções que o
aplicativo pode realizar. Por exemplo, se um
aplicativo de câmera tem uma funcionalidade de
zoom, essa é uma feature. As features podem
variar dependendo do aplicativo e do seu
propósito.

JavaScript Playground
Try this online JavaScript Playground with instant live
preview and console. Easy & Fast. Experiment yourself.
http://playcode.io/javascript
:
:
 Mapa de a… / ... / Tipos de dad…

Tipos de dados e
variáveis
cover

O que vamos aprender ?

O que são variáveis

Como utilizar variáveis
Tipos de variáveis

O Problema
:
 Aonde vamos Codar

JavaScript Playground
Try this online JavaScript Playground with instant live
preview and console. Easy & Fast. Experiment yourself.
https://playcode.io/javascript

declarando variáveis
:
 JavaScript

console.log("Digita o nome do seu

jogador") //declara uma variável let
nickname = "Maria mestra do Pikachu"
//concantenando uma mensagem fixa +
uma variável console.log("Bem vinda "
+ nickname) console.log(nickname + "
entrou no servidor")

declarando constantes

JavaScript

const notificacao = "Pokemon Go diz: "

//saida console.log(notificacao + "tem
um novo pokemon na região")
console.log(notificacao + "você foi
derrotado por um líder")

Ajudando a vovó
:
 JavaScript

let poteCafe = "café pilão" let

poteAcucar = "Açucar cristal" let
poteBiscoito = "Biscoito Maizena"
const messagemDaVovo = "Na cozinha da
vovó hoje tem: "
console.log(messagemDaVovo + poteCafe
+ " - " + poteAcucar + " - " +
poteBiscoito ) poteCafe = "Café 3
corações" console.log(messagemDaVovo +
poteCafe + " - " + poteAcucar + " - "
+ poteBiscoito )

Tipos variáveis

string - são variaveis que armazenam texto

number - são variaveis que armazenam
números
boolean - são variaveis lógicas, que armazenam
o valor de ligado ou desligado (true/false)

JavaScript

//pokemon let nomePokemon = "pikachu"

let pokemonSexo = "M" let nivelPokemon
= 20 let pontosDeVidaPokemon = 45 let
selecionavel = false

Outros tipos de variáveis

:
 Tipo de Variável Descrição

Variáveis numéricas São usadas para armazenar valores numéricos.

Inteiro Armazena números inteiros, como 1, 10, -5.

Ponto flutuante ou decimal Armazena números com casas decimais, como 3

Números complexos Armazena números complexos, como 2+3j.

Variáveis de texto Usadas para armazenar sequências de caracter

String Armazena uma sequência de caracteres, como "

Caractere Armazena um único caractere, como 'a', 'X', '@'.

Variáveis lógicas Usadas para armazenar valores de verdadeiro o

Booleano Armazena os valores True ou False.

Variáveis de data e hora Utilizadas para representar datas e horários.

Data Armazena datas, no formato AAAA-MM-DD.

Hora Armazena horários, no formato HH:MM:SS.

:
:
 Mapa de a… / ... / Vetores e m…

Vetores e matrizes
cover

O que vamos aprender ?

O que vetores
Quando utilizar
O que Matrizes
:
 JavaScript

let nomesPokemon = ["Pikachu" ,

"Chamander", "Bulbassaur"] let
timePokemon = [ ["pikachu", "M", 1],
["Chamander", "F", 3] ] console.log("
O pokemon " + timePokemon[1][0] + " é
do sexo " + timePokemon[1][1] + " e
está no nível " + timePokemon[1][2] )
:
 Mapa de a… / ... / Operadores …

Operadores e
expressões
cover

Tags Vazio

Operadores Aritméticos:

Operador Descrição Exemplo

+ Adição let result = 5

+ 3;

- Subtração let result = 8

- 2;

* Multiplicação let result = 4

* 6;

/ Divisão let result =

10 / 2;

% Módulo (resto da let result =

divisão) 10 % 3;

Operadores Relacionais:
:
 Operador Descrição Exemplo

== Igual a let isEqual = (x

== y);

!= Diferente de let isNotEqual =

(x != y);

> Maior que let isGreater =

(x > y);

< Menor que let isLess = (x <

y);

>= Maior ou igual let

a isGreaterOrEqual
= (x >= y);

<= Menor ou igual let isLessOrEqual

a = (x <= y);

Operadores Lógicos:

Operador Descrição Exemplo

&& AND lógico if (condition1 &&

condition2)

|| OR lógico if (condition1 ||
condition2)

! NOT lógico if (!condition)

Operadores de Atribuição:
:
 Operador Descrição Exemplo

= Atribuição let x = 5;

+= Adição e let num = 10;

atribuição num += 2;

-= Subtração e let num = 10;

atribuição num -= 3;

*= Multiplicação e let num = 5;

atribuição num *= 4;

/= Divisão e let num = 10;

atribuição num /= 2;

%= Módulo e let num = 10;

atribuição num %= 3;

Operadores de Incremento e
Decremento:

Operador Descrição Exemplo

++ Incremento let counter = 0;

counter++;

-- Decremento let counter = 5;

counter--;
:
 Mapa de a… / ... / Operadores …

Operadores aritméticos
cover

Tags Vazio

Operadores Aritméticos:
Operador Descrição Exemplo

+ Adição let result = 5

+ 3;

- Subtração let result = 8

- 2;

* Multiplicação let result = 4

* 6;

/ Divisão let result =

10 / 2;

% Módulo (resto da let result =

divisão) 10 % 3;
:
 JavaScript

// sinal de + usado para concatenar

string let idade = 30
console.log("valor da minha variavel "
+ idade) // '+' realizando somas idade
= 30 + 6 console.log("operação de
adição " + idade) // '-' realizando
subtrações let primeiroNumero = 1023
let secundoNumero = 23
console.log(primeiroNumero -
secundoNumero) // '*' realizando
multiplicações let multiplicador = 4
let multiplicando = 12 let produto =
multiplicador * multiplicando
console.log("resultado da
multiplicação é " + produto)
multiplicador = 8 produto =
multiplicador * multiplicando
console.log("resultado da
multiplicação é " + produto) // '/'
realizando divisões let notaDoMercado
= 50 let pessoasParaDividir = 2
console.log("operação de divisão :" +
notaDoMercado / pessoasParaDividir) //
'%' pegando o resto de uma divisão let
calculo = 10 % 3 console.log("operação
de módulo " + calculo)

Operadores de Incremento e
Decremento:
Operador Descrição Exemplo

++ Incremento let counter = 0;

counter++;

-- Decremento let counter = 5;

counter--;
:
 JavaScript

let contador = 1 // '++' incremento

contador++ contador++ // '--'
decremento contador-- contador--
contador-- console.log(contador)

Operadores de Atribuição:
Operador Descrição Exemplo

= Atribuição let x = 5;

+= Adição e let num = 10;

atribuição num += 2;

-= Subtração e let num = 10;

atribuição num -= 3;

*= Multiplicação e let num = 5;

atribuição num *= 4;

/= Divisão e let num = 10;

atribuição num /= 2;

%= Módulo e let num = 10;

atribuição num %= 3;

JavaScript

let preco = 10 preco += 5 // preco =

preco + 5 preco -= 5 // preco = preco
-5 console.log(preco)
:
:
 Mapa de a… / ... / Operadores …

Operadores de
comparação
(Relacionais)
cover

Tags Vazio

Operadores Relacionais:
:
 Operador Descrição Exemplo

== Igual a (compara let isEqual =

valor) (x == y);

=== Igual a (compara

valor e formato)

!== Diferente de let isNotEqual

= (x != y);

> Maior que let isGreater =

(x > y);

< Menor que let isLess = (x

< y);

>= Maior ou igual a let

isGreaterOrEqual
= (x >= y);

<= Menor ou igual a let

isLessOrEqual =
(x <= y);

JavaScript

let marca = "Apple" console.log(marca

!== "Samsung") // = é atribuição // ==
é para comparar o valor // === é para
comparar o valor e o formato do
conteúdo // !== é diferente ?

JavaScript

//guardar o valor em uma variável de

resultado TRUE?FALSE let marca =
"Apple" let resultado = marca ===
"Samsung" console.log(resultado)
:
 JavaScript

//guardar o valor em uma variável de

resultado TRUE?FALSE let cpfBloqueado
= "123.445.222-45" let cpfUsuario =
"222.111.222-09" let ehCPFBloqueado =
cpfUsuario === cpfBloqueado
console.log("O usuario está barrado ?
" + ehCPFBloqueado)

JavaScript

let CPFPermitido = "222.555.333-02"

let CPFDoUsuario = "222.555.333-02"
let ehBloqueado = CPFDoUsuario !==
CPFPermitido console.log("é um usuario
invalido ? " + ehBloqueado)

JavaScript

let idadeMinima = 18 let idadeUsuario

= 18 let idadePermitidaValida =
idadeUsuario >= idadeMinima
console.log(idadePermitidaValida)

JavaScript

let idadeDeCorte = 50 let idadeUsuario

= 50 let resultadoEhTerceiraIdade =
idadeDeCorte <= idadeUsuario
console.log(resultadoEhTerceiraIdade)
:
 Mapa de a… / ... / Operadores l…

Operadores lógicos
cover

Tags Vazio

Operadores Lógicos:

Operador Descrição Exemplo

&& AND lógico if (condition1 &&

condition2)

|| OR lógico if (condition1 ||
condition2)

! NOT lógico if (!condition)

JavaScript

// AND ( && ) let idade = 18 let

vistoVerificado = false let resultado
= (idade >= 18) && (vistoVerificado
=== true) console.log(resultado)

JavaScript

// AND ( && ) - 100 moedas coletadas E

1 item estrela let moedasColetadas =
99 let item = "estrela" let resultado
= (moedasColetadas >= 100) && (item
=== "estrela") console.log(resultado)
:
 JavaScript

// OR ( || ) - nosso boneco só pode

sair se tiver sem chuva OU com guarda
Chuva let tempo = "chuva" let item =
"guarda chuva" let podeSair = (tempo
!== "chuva") || (item === "guarda
chuva") console.log("nosso personagem
pode sair ? " + podeSair)

JavaScript

// NOT ( !) - nega uma afirmação let

tempo = "chuva" let resultado = tempo
=== "chuva" console.log(!!resultado)

JavaScript

// NOT ( !) - nega uma afirmação let

tempo = "chuva" let horario = 8 let
resultado = !((tempo !== "chuva") &&
(horario > 6)) console.log(resultado)
:
:
 Mapa de a… / ... / Estruturas c…

Estruturas condicionais
(if, else if, else)
cover

Era uma vez um herói chamado João que

estava em uma aventura emocionante para
resgatar a princesa perdida em um mundo
mágico. Mas para alcançar o castelo onde a
princesa estava aprisionada, ele precisava
atravessar uma floresta cheia de perigos e
enigmas.
Vamos ajudar João a tomar as decisões certas
usando uma estrutura IF em JavaScript! Essa
estrutura é como um caminho mágico que o
nosso herói seguirá.
:
 JavaScript

// O nosso herói João chegou a uma enc

ruzilhada na floresta misteriosa. // E
le precisa decidir qual caminho seguir
para continuar a sua jornada. if (cami
nhoEsquerdo === 'obstaculo') { // Se o
caminho da esquerda tiver um obstácul
o, João vai tentar o caminho da direit
a. seguirCaminhoDireito(); } else if (
caminhoEsquerdo === 'ponteQuebrada') {
// Se o caminho da esquerda tiver uma
ponte quebrada, João vai procurar outr
o caminho. procurarOutroCaminho(); } e
lse { // Se não tiver obstáculo nem po
nte quebrada no caminho da esquerda, J
oão seguirá por esse caminho. seguirCa
minhoEsquerdo(); }

Imagina que você é o herói João, e está em uma

floresta mágica em busca da princesa. Você
chegou a um lugar onde tem dois caminhos à sua
frente: um pela esquerda e outro pela direita.
Primeiro, você vai olhar o caminho da esquerda, e
vai verificar se tem algum obstáculo no caminho,
como uma pedra enorme que não dá para passar.
Se tiver, você vai dizer "ah, esse caminho está
bloqueado", e vai tentar o caminho da direita.
Se o caminho da esquerda estiver livre, você vai
olhar se tem uma ponte para atravessar. Se a
ponte estiver quebrada, você vai falar "oh não,
essa ponte está quebrada, não posso passar por
aqui", e vai procurar outro caminho.
Mas se o caminho da esquerda estiver livre e a
ponte estiver inteira, você vai ficar feliz e vai
seguir por esse caminho!
Essa é a maneira como o herói João faz as
escolhas na floresta usando o poder mágico do
IF, ELSE IF e ELSE em JavaScript.
:
 Então, o que João vai fazer? Isso depende dos
obstáculos que ele encontrar pelo caminho.
Lembre-se de tomar decisões sábias para ajudar
o nosso herói a salvar a princesa!

JavaScript

let possuiOvos = true let

itensComprados = "" if(possuiOvos){
itensComprados = "Leite" } else{
console.log("passou na sessão de
congelados") itensComprados = "Lasanha
congelada" } console.log("item
comprado: " + itensComprados)

JavaScript

//if,else if ,else let nivelDeFome =

"1" if(nivelDeFome === 1){
console.log("pouca fome") }else
if(nivelDeFome ===2){
console.log("muita fome") }else{
console.log("Você comeria mais que o
pica pau") }
:
 Mapa de a… / ... / Estrutura Sw…

Estrutura Switch Case

cover

Tópico: O Que É Um Switch Case no

JavaScript?
Imagine que você está organizando suas roupas
por cores. Você tem uma pilha de camisetas
vermelhas, azuis, verdes e amarelas. Quando
você quiser usar uma camiseta de uma cor
específica, você vai procurar na pilha até
encontrar a cor certa, certo? O Switch Case no
JavaScript é como isso, mas para o computador
escolher coisas baseadas em diferentes valores!

Tópico: Como Funciona o Switch Case?

O Switch Case é uma maneira legal que o
JavaScript tem de fazer escolhas. É como se o
computador tivesse várias opções e escolhesse
uma com base em um valor que você dá a ele.
Vamos ver como isso funciona:
1. Primeiro, você diz ao computador o valor que
quer verificar.
2. Depois, o computador olha para todas as
opções que você forneceu e escolhe a opção
certa.
:
 Tópico: Exemplos de Switch Case em
JavaScript
Vamos usar um exemplo para entender melhor.
Vamos imaginar que estamos fazendo um
programa sobre dias da semana e queremos
mostrar o que você pode fazer em cada dia.

JavaScript

let dia = "terça"; // Você pode mudar

isso para outros dias switch (dia) { c
ase "segunda": console.log("Dia de com
eçar a semana com energia!"); break; c
ase "terça": console.log("Hora de apre
nder coisas novas!"); break; case "qua
rta": console.log("Metade da semana, c
ontinue firme!"); break; case "quinta"
: console.log("Quase lá, um pouco mais
de esforço!"); break; case "sexta": co
nsole.log("Dia de comemorar, o fim de
semana está chegando!"); break; defaul
t: console.log("Final de semana! Desca
nse e divirta-se!"); }

Neste exemplo, o programa verifica qual é o valor

da variável dia e, com base nisso, decide qual
mensagem mostrar na tela. Se você mudar o
valor de dia , verá mensagens diferentes
aparecendo!
Tópico: Palavras-Chave Importantes do Switch
Case

• switch : É a palavra que diz ao computador

que estamos começando a escolher com
base em um valor.

• case : São as opções que você dá ao

computador para escolher.

• break : Esta é uma palavra que diz ao

computador para parar de verificar opções
depois que encontra a correta.
:
 • default : É a opção que o computador
escolhe se nenhuma das opções anteriores
combina com o valor que você deu.

!
:
 Mapa de a… / ... / Estruturas d…

Estruturas de repetição
(for, while, do-while)
cover

Exemplo de for em JavaScript

O laço for é utilizado para executar um bloco de
código várias vezes, de acordo com uma
condição específica. O exemplo abaixo percorre
um array de números e imprime cada elemento
no console:

JavaScript

const numeros = [1, 2, 3, 4, 5]; for(l

et i = 0; i < numeros.length; i++) { c
onsole.log(numeros[i]); }

Na primeira linha, criamos um array de números.

Dentro do laço for , declaramos uma variável de
controle i e a inicializamos com 0 . A condição
para continuar a execução é i <
numeros.length , ou seja, enquanto i for menor
que o tamanho do array numeros . Na última linha
do loop, incrementamos i em 1 com i++ .

Exemplo de while em JavaScript

:
 O laço while é utilizado quando não sabemos
quantas vezes precisamos executar uma ação. O
exemplo abaixo simula uma moeda sendo jogada
até que saia cara:

JavaScript

let jogadas = 0; let cara = false; whi

le(!cara) { jogadas++; cara = Math.ran
dom() < 0.5; } console.log(`A moeda ca
iu cara após ${jogadas} jogadas!`);

Na primeira linha, inicializamos a variável

jogadas com 0 e a variável cara com false .
Dentro do laço while , incrementamos jogadas
em 1 com jogadas++ e definimos cara como
true caso Math.random() seja menor que
0.5 . O loop continua até que cara seja true .

Exemplo de do-while em JavaScript

O laço do-while é um tipo de laço while que
sempre executa pelo menos uma vez o bloco de
código dentro do loop. O exemplo abaixo solicita
que o usuário digite um número entre 1 e 10:

JavaScript

let numero; do { numero = prompt('Digi

te um número entre 1 e 10:'); } while(
numero < 1 || numero > 10); console.lo
g(`Você digitou o número ${numero}.`);

Na primeira linha, declaramos a variável numero

sem inicializá-la. Dentro do laço do-while ,
solicitamos que o usuário digite um número com
prompt . O loop continua enquanto numero for
menor que 1 ou maior que 10 . Quando o
usuário digita um número válido, o loop é
encerrado e a mensagem é exibida no console.
:
 Brincando com Números e Contando Histórias
usando "for", "while" e "do-while" no
JavaScript!
Oi amiguinho! Hoje vou te mostrar três maneiras
diferentes de fazer coisas legais com números e
histórias usando o "for", o "while" e o "do-while"
no JavaScript. Vamos nessa!

Tópico: O Poder do "for"

Sabe quando você quer fazer algo várias vezes,
como contar até 10 ou imprimir os números de 1 a
5? O "for" é como um ajudante que faz isso
rapidinho!

JavaScript

for (let contador = 1; contador <= 5;

contador++) { console.log(contador); }

Nesse exemplo, o "for" ajuda a contar de 1 até 5.

Ele começa do número 1, continua enquanto o
contador for menor ou igual a 5, e a cada vez
adiciona 1 ao contador. Assim, ele mostra 1,
depois 2, depois 3, e assim por diante!

Tópico: O "while" Aventureiro

Agora, imagine que você quer jogar seu dado até
tirar um número maior que 4. O "while" é um
amigo que te ajuda a fazer isso!
:
 JavaScript

let dado = 0; while (dado <= 4) { dado

= Math.floor(Math.random() * 6) + 1; c
onsole.log("Você tirou um", dado); }

Nesse caso, o "while" rola o dado até você tirar

um número maior que 4. Ele continua repetindo
até o dado mostrar um número 5 ou 6. Aí ele para
e mostra o número que você tirou!

Tópico: Brincadeira com "do-while"

O "do-while" é como um jogo onde você brinca
pelo menos uma vez e depois decide se quer
continuar. Vamos fingir que você está comendo
bolinhos até ficar cheio!

JavaScript

let bolinhosComidos = 0; do { bolinhos

Comidos++; console.log("Você comeu", b
olinhosComidos, "bolinhos!"); } while
(bolinhosComidos < 5);

No caso do "do-while", você come pelo menos

um bolinho (mesmo se estiver cheio), e então
verifica se comeu menos de 5 bolinhos. Se ainda
não estiver cheio, continua comendo e contando.
Quando comer 5 bolinhos, aí para de comer!

Tópico: Concluindo Nossa Aventura

:
 Uau, amiguinho! Agora você sabe como usar o
"for" para contar, o "while" para fazer algo até
uma condição ser verdadeira, e o "do-while" para
brincar pelo menos uma vez! Essas são formas
incríveis de explorar números e criar histórias
divertidas usando o JavaScript. Divirta-se muito
com essas ferramentas mágicas!
:
 Mapa de a… / ... / O que são fu…

O que são funções e

como cria-las
cover

JavaScript

torrar() function torrar(){

console.log("torrando pão")
injetarPao() } function injetarPao(){
console.log("preparando para injetar o
pão") console.log("finalizado") }

O Que São as Mágicas Chamadas "Funções" no

Mundo do JavaScript?
Ei, amiguinho! Imagine que você tem uma caixa
mágica que faz coisas legais sempre que você diz
"Abracadabra!". As funções no JavaScript são um
pouco como essas caixas mágicas. Elas são um
jeito legal de juntar um monte de coisas que você
quer fazer e depois dizer para o computador
executar tudo de uma vez!

Como Criar e Usar Uma Função Mágica

Quer saber como criar uma função? É fácil! Dá
uma olhada:
:
 JavaScript

function fazerMágica() { console.log("

Abracadabra! Coisas mágicas acontecera
m!"); }

Olha só, amiguinho! Nós criamos uma função

chamada "fazerMágica". Agora, sempre que a
gente disser "fazerMágica()" para o computador,
ele vai fazer o que estiver dentro dela. No nosso
exemplo, ele vai mostrar "Abracadabra! Coisas
mágicas aconteceram!".

Dar e Receber Ajuda das Funções

Às vezes, precisamos dar informações para as
funções, como quando você conta a um amigo o
sabor de sorvete que você quer. Vamos ver como
funciona:

JavaScript

function saudar(nome) { console.log("O

lá, " + nome + "! Como você está?"); }
saudar("Pedrinho"); // Vai dizer Olá,
Pedrinho! Como você está? saudar("Mari
ana"); // Vai dizer Olá, Mariana! Como
você está?

Neste exemplo, criamos uma função chamada

"saudar" que aceita um pedaço de informação
chamado "nome". Sempre que chamamos a
função e damos um nome, ela diz olá e pergunta
como a pessoa está!
:
:
 Mapa de a… / ... / Funções co…

Funções com
passagem de
parâmetros
cover

Descobrindo os Segredos das Funções com

Parâmetros no JavaScript!
Oi, amiguinho! Vamos mergulhar em um mundo
mágico onde as funções podem fazer coisas
incríveis com a ajuda de amiguinhos chamados
"parâmetros". Vou te mostrar como funciona essa
aventura!

Conhecendo os Parâmetros das Funções

Sabe quando você dá instruções a um robô para
pegar uma bola vermelha e ele faz exatamente
isso? Os parâmetros são como essas instruções
especiais que você dá para as funções no
JavaScript.

Criando uma Caixa Mágica com Parâmetros

Vamos criar uma caixa mágica que diz olá para
diferentes pessoas, usando parâmetros! Olha só:
:
 JavaScript

function dizerOla(nome) { console.lo

g("Olá, " + nome + "! Como você est
á?"); }

Vi isso, amiguinho? Criamos uma função

chamada "dizerOla" com um amiguinho chamado
"nome" dentro dela. Agora, quando chamamos
essa função e damos um nome, ela diz olá para
essa pessoa!

Conversando com a Caixa Mágica

Agora, você está pronto para conversar com
nossa caixa mágica! Dê uma olhada:

JavaScript

dizerOla("Pedrinho"); // Vai dizer Ol

á, Pedrinho! Como você está? dizerOl
a("Mariana"); // Vai dizer Olá, Marian
a! Como você está?

Quando chamamos a função "dizerOla" e damos

um nome, ela usa esse nome para criar uma
saudação especial. Que divertido, né?

Aventuras com Mais de Um Amiguinho

Às vezes, você quer dar mais de um amiguinho
para sua função. É como dar uma festa com
muitos convidados! Vamos ver isso:
:
 JavaScript

function calcularIdade(nome, anoNascim

ento) { let idade = 2023 - anoNascimen
to; console.log(nome + " tem " + idade
+ " anos!"); } calcularIdade("Pedrinh
o", 2010); // Vai mostrar Pedrinho tem
13 anos! calcularIdade("Mariana", 200
8); // Vai mostrar Mariana tem 15 ano
s!

Aqui, fizemos uma função chamada

"calcularIdade" que usa dois amiguinhos: o nome
e o ano de nascimento. Ela calcula a idade e
conta para a gente!

Magia dos Parâmetros Concluída!

Uau, amiguinho! Você aprendeu como usar os
parâmetros para tornar as funções ainda mais
mágicas. Agora você pode dar instruções
especiais para as funções e vê-las fazerem coisas
incríveis com essas informações. É como ter
superpoderes no mundo da programação!
:
 Mapa de a… / ... / Funções co…

Funções com retorno

de valores
cover

JavaScript

let userName = getFirstName("Carlos-

Almeida-Juanito-Gargalo", "-")
console.log("Seja bem vindo " +
userName) userName =
getFirstName("Felipe Silva Han Solo",
" ") console.log("Seja bem vindo " +
userName) function getFirstName(name,
splitChar){ let firstName =
name.split(splitChar)[0] return
firstName }

Funções Também Podem Devolver Presentes

Algumas funções são legais e te dão um presente
de volta, como quando você dá um desenho
bonito para um amigo e ele te dá um sorriso de
volta. Olha só como isso funciona com o
JavaScript:
:
 JavaScript

function somar(numero1, numero2) { ret

urn numero1 + numero2; } let resultado
= somar(5, 3); // A função vai dar de
presente 5 + 3 = 8 console.log("A soma
é: " + resultado); // Vai mostrar A so
ma é: 8

Aqui, fizemos uma função "somar" que pega dois

números, soma eles e devolve o resultado.
Quando chamamos a função com 5 e 3, ela nos
dá o presente do número 8, e aí mostramos isso
na tela.
:
 Mapa de a… / ... / Estruturas d…

Estruturas de dados
JSON
cover

JavaScript

//JSON - JavaScript Object Notation //

chave e valor com o objetivo de
transferir dados let invoice = { name:
"felipe", age: 28, products: { 0:
["mouse 2xwm", 29.90], 1: ["Teclado
mecânico", 129.99], 2: ["Monitor",
"899.99"], 3: ["TV 100 polegadas",
"10000.90"] }, taxes: "98.90" }
generateInvoice(invoice) function
generateInvoice(invoice){
console.log(`O comprador é
${invoice.name}`) console.log(`A idade
é ${invoice.age}`) console.log("------
------") for(let index in
invoice.products){ let [productName,
productPrice] =
invoice.products[index] console.log(`-
${productName}: R$ ${productPrice}`) }
}

Descobrindo o Mundo dos Dados Mágicos com

JSON e JavaScript!
:
 Oi amiguinho curioso! Vou te mostrar um jeito
legal de guardar e trocar informações mágicas
usando algo chamado JSON com JavaScript.
Vamos lá explorar esse mundo mágico dos
dados!

O Que É Esse Tal de JSON?

Sabe quando você tem uma mochila mágica onde
guarda todos os seus brinquedos favoritos?
JSON é um jeito de guardar informações
especiais em um formato que o computador
entende, tipo uma mochila mágica para dados!

Criando Dados Mágicos em JSON

Pensa assim: você quer guardar informações
sobre seus bichinhos de estimação, como nome,
cor e tipo. Com JSON, é fácil!

JavaScript

let bichinhos = [ { "nome": "Bolinha",

"cor": "amarelo", "tipo": "pato" }, {
"nome": "Fofinho", "cor": "marrom", "t
ipo": "coelho" } ];

Nesse exemplo, fizemos uma lista mágica de

bichinhos, cada um com seu próprio nome, cor e
tipo. Parece uma lista de amigos de pelúcia, né?

Conversando com Dados Mágicos em JSON

Agora, imagine que você quer saber a cor do
bichinho chamado "Bolinha". Com JSON, é como
conversar com seus brinquedos!
:
 JavaScript

let bichinhoEscolhido = bichinhos[0];

console.log("O " + bichinhoEscolhido.n
ome + " é " + bichinhoEscolhido.cor +
"!");

Aqui, a gente escolheu o bichinho na posição 0

da lista (que é o "Bolinha") e perguntou a cor
dele. Ele nos respondeu "amarelo"!

Magia de Mandar e Receber Dados em JSON

JSON também é ótimo para mandar e receber
informações mágicas. Imagine que você quer
compartilhar a lista de bichinhos mágicos com
um amigo. Você pode fazer assim:

JavaScript

let listaParaAmigo = JSON.stringify(bi

chinhos); console.log(listaParaAmigo);

Com esse pedacinho de código, a lista de

bichinhos se transforma em algo que podemos
mostrar ou até enviar para um amigo!

Explorando o Mundo dos Dados com JSON!

Uau, amiguinho! Agora você sabe que JSON é
como uma mochila mágica onde guardamos
informações especiais. Você pode criar,
conversar e até compartilhar esses dados com
outras pessoas usando JavaScript. É como ter um
diálogo mágico com suas informações!
:
:
 Mapa de a… / ... / Trabalhando …

Trabalhando com
Objetos
cover

Descobrindo um Mundo de Coisas Especiais

com Objetos no JavaScript!
Oi, amiguinho! Vou te mostrar um jeito legal de
guardar um monte de informações especiais
usando algo chamado "objetos" no JavaScript.
Vamos explorar esse mundo cheio de coisas
mágicas juntos!

O Que São Esses Objetos Mágicos?

Sabe quando você tem uma caixa onde guarda
seus brinquedos, roupas e coisas favoritas? Um
objeto no JavaScript é como essa caixa mágica,
onde você pode colocar um montão de
informações importantes juntas!

Criando Seu Próprio Objeto Mágico

Vamos fingir que estamos fazendo uma festa com
informações sobre os convidados. Com objetos, é
super fácil!
:
 JavaScript

let convidado = { nome: "Pedrinho", id

ade: 10, presente: "quebra-cabeça" };

Olha só, amiguinho! Criamos um objeto chamado

"convidado" com várias informações dentro dele,
como nome, idade e presente. É como se
tivéssemos feito uma ficha mágica para nosso
convidado!

Conversando com Objetos Mágicos

Agora, você pode conversar com o objeto como
se fosse um amiguinho. Dá uma olhada:

JavaScript

console.log(convidado.nome + " tem " +

convidado.idade + " anos e trouxe um "
+ convidado.presente + " de present
e!");

Com esse pedacinho de código, conseguimos

perguntar e mostrar várias coisas sobre o nosso
convidado mágico!

Adicionando Mais Magia aos Objetos

Às vezes, você quer adicionar informações novas
ao objeto, como quando você dá um nome ao seu
novo brinquedo. Olha só como é fácil:

JavaScript

convidado.localizacao = "Sala de Esta

r"; console.log(convidado.nome + " est
á na " + convidado.localizacao + ".");
:
 Aqui, demos uma nova informação mágica para o
convidado, que é onde ele está na festa. Agora,
ele pode nos contar onde está!

Explorando o Mundo com Objetos Mágicos

Uau, amiguinho! Agora você sabe que objetos são
como caixas mágicas onde guardamos
informações importantes. Você pode criar,
conversar e até adicionar coisas novas aos
objetos para explorar um mundo cheio de
detalhes incríveis usando o JavaScript. É como se
os objetos fossem nossos amiguinhos mágicos!
:
 Mapa de a… / ... / Trabalhando …

Trabalhando com
Objetos
cover

Descobrindo as Super Vantagens de Usar

Objetos no JavaScript!
Oi, amiguinho curioso! Hoje vou te mostrar por
que usar objetos no JavaScript é como ter
superpoderes para organizar informações. Vamos
explorar as incríveis vantagens desses objetos
mágicos!

Guardando Tudo em um Só Lugar

Sabe quando você guarda todos os seus
brinquedos em uma caixa para não perder
nenhum? Usar objetos no JavaScript é como ter
uma caixa mágica onde você pode guardar várias
informações juntas, como nome, cor e tamanho,
para não perder nada importante!

Fazendo Amigos Mágicos

:
 Com objetos, você pode criar amiguinhos
especiais para cada coisa que quiser guardar
informações. Imagine ter um amiguinho para o
seu cachorro, outro para a sua bicicleta e mais
um para sua comida favorita. Assim, você não
mistura tudo e consegue encontrar rapidinho o
que precisa!

Conversando com Seus Amigos Mágicos

Observe que os objetos são como amigos que
entendem a sua linguagem. Você pode conversar
com eles usando os nomes das informações
guardadas. Isso torna a comunicação super fácil,
como quando você pede um brinquedo para um
amigo e ele sabe exatamente o que você quer.

Adicionando Novas Habilidades Mágicas

Imagine que seu amigo mágico sabe truques
novos toda vez que você o visita. Com objetos,
você pode adicionar informações extras a
qualquer momento. Por exemplo, pode adicionar
uma nova cor ao objeto "carro de brinquedo" ou
uma nova página ao objeto "livro".

Explorando um Mundo de Detalhes Mágicos

Com objetos, você pode explorar o mundo dos
detalhes de uma maneira incrível. Pode saber o
nome, a cor, o tamanho e muito mais sobre um
objeto. Isso é ótimo quando você quer criar um
jogo ou um aplicativo cheio de informações
legais!

Conclusão Mágica
:
 Uau, amiguinho! Agora você entende por que os
objetos no JavaScript são como superpoderes
mágicos para organizar informações. Eles te
ajudam a guardar, organizar e explorar um
montão de detalhes importantes de maneira
divertida e eficiente. Usar objetos é como ter um
exército de amiguinhos mágicos que fazem tudo
ficar mais fácil e organizado!
: