CODING_JAVASCRIPT 2

CODING_JAVASCRIPT 1

CODING
PROGRAMAÇÃO EM JAVASCRIPT

2 CODING
JAVASCRIPT
 CODING_JAVASCRIPT 2

Programação em Linguagem JavaScript

2023

Todo o conteúdo deste material, como textos, gráficos, imagens, logotipo e tabelas, é
de propriedade exclusiva da BuildingUp Centro de Educação Integrada Ltda e da
B.Up Educacional Ltda, e protegido pelas leis de direitos autorais do Brasil,
proporcionadas pela Constituição Federal em seu artigo 5º, parágrafos 27 e 28, bem
como pelo Código Civil Brasileiro e pela Lei 9.610/98. Outros nomes de marcas e
logotipos podem ser marcas comerciais ou marcas registradas de outras empresas.
Não é permitido copiar, distribuir, retransmitir ou modificar o conteúdo deste material,
na forma eletrônica ou impressa, para qualquer fim. Tais atos serão considerados
crimes e julgados na forma da Lei pertinente.

2
 CODING_JAVASCRIPT 2

INDICE
• Conteúdo deste modulo

• Objetivos das unidades

• Unidade 1: Condicionais

• Unidade 2: If / Else

• Unidade 3: Switch / Case

• Unidade 4: Avançando nos Tipos de Dados

• Unidade 5: Criando Arrays

• Unidade 6: Criando Objects

• Unidade 7: Introdução aos Loops

• Unidade 8: Comando ‘For’

• Unidade 9: While & Do-while

• Unidade 10: For-in

3
 CODING_JAVASCRIPT 2
CONTEÚDO

CONTEÚDO
Parabéns por continuar embarcando nesta jornada de
aprendizado de JavaScript! Esta é uma linguagem
extremamente versátil e poderosa, capaz de criar
aplicações incríveis e revolucionar a forma como
interagimos com a tecnologia.

Como base para continuar essa jornada, veremos neste

módulo condicionais, tipos de dados avançados e loops.
Essts são os elementos que nos permitirão controlar a
lógica do nosso código e trabalhar com diferentes tipos
de informações, tornando nossos programas mais
dinâmicos e interativos.

Aprender a programar pode ser uma jornada

desafiadora, mas também é extremamente gratificante.
Não importa qual seja o seu nível atual de
conhecimento, você sempre pode evoluir e aprender
mais!

Lembre-se de que o sucesso na programação requer

dedicação e persistência… não existe uma solução
mágica que resolverá todos os seus problemas, mas com
o tempo e o esforço, você conseguirá reconhecer sua
propria evolução!

4
 CODING_JAVASCRIPT 2

UNIDADE

OBJETIVOS
• Entender o conceito de condicionais e como

1 Condicionais funcionam;
• Aprender o conceito das condicionais mais
OBJETIVOS

usadas
UNIDADE

• Entender a estrutura básica;

OBJETIVOS
2 If / Else
• Aprender a utilizar expressões lógicas para avaliar
condições;
• Aprender a encadear várias estruturas "if/else"
UNIDADE

OBJETIVOS • Entender o conceito de estrutura

3 Switch / Case
• Aprender a escrever estruturas "switch/case"
• Aprender a utilizar a palavra-chave
"break","continue" e "default"
UNIDADE

OBJETIVOS

Avançando
4 nos tipos de
dados
• Entender o conceito e a estrutura de arrays e
objects
UNIDADE

OBJETIVOS

• Entender como arrays são utilizados para

5 Criando
Arrays
armazenar coleções de dados;
• Aprender a criar arrays e manipular seus
elementos
UNIDADE

OBJETIVOS

• Entender o conceito de objects no JavaScript e como

6 Criando
Objects
eles são utilizados para armazenar coleções de dados;
• Aprender a criar objects e manipular seus elementos
UNIDADE

OBJETIVOS

7 Introdução
aos loops
• Entender o conceito de loops e sua importância
na programação
UNIDADE

OBJETIVOS

• Entender o conceito do loop for;

8 Comando “for” • Entender sua estrutura e como aplicá-lo de forma
correta no codigo
UNIDADE

OBJETIVOS

• Entender o conceito e a diferença entre entre

9 While &
Do-while
while e do/while;
• Entender sua estrutura e como aplicá-los de forma
correta no codigo
UNIDADE

OBJETIVOS

• Entender o conceito de loop for-in e sua utilização;

10 For-in • Aprender a escrever estruturas for-in;
• Aplicar o loop for-in em exemplos práticos

5
 CODING_JAVASCRIPT 2

UNIDADE

CONDICIONAIS

6
 CODING_JAVASCRIPT 2
UNIDADE 1

Introdução a condicionais
em JavaScript
Condicionais são uma ferramenta
na programação que permitem
ao computador tomar decisões.

Elas permitem que o código seja

executado de forma diferente
dependendo do resultado de
uma expressão booleana.

Uma expressão booleana é uma

expressão que pode ser
verdadeira ou falsa.

Por exemplo, se você quiser saber se uma pessoa tem mais

de 18 anos, você pode usar uma expressão booleana
para verificar se a idade da pessoa é maior ou igual a 18.
Se a expressão for verdadeira, o código será executado
de uma maneira; se for falsa, será executado de outra.

Estruturas mais utilizadas

• A estrutura condicional mais comum é o "if-else".

O comando "if" verifica se uma determinada condição é

verdadeira e executa o código que foi pedido logo após
essa verificação ser dada como verdadeira.

Já "else" é usado para dizer o que o programa deve fazer

se a condição não for verdadeira.

7
 CODING_JAVASCRIPT 2
UNIDADE 1

Para ilustrar, imagine que você está

escrevendo um programa para uma loja
online.

Se o preço do item que o cliente está

comprando for menor do que $50, você
pode oferecer a ele um desconto especial.

Se o preço for igual ou maior do que $50,

você não oferece o desconto.

Esse é um exemplo de como as condicionais podem ser

usadas para tomar decisões dentro do código e personalizar
a experiência do usuário.

Isso é essencial para a lógica de programação e a tomada

de decisões dentro do código.

A tradução do "if" para o português é

"Se" e "else" é "Se não". Um exemplo de
como isso pode ser representado em
pseudocódigo é:

Se (if) a expressão 2 > 0 for verdadeira,

imprima 'maior que 0' na tela.
Se não (else), imprima 'menor que 0' na
tela".

Como o resultado da expressão 2 > 0 é verdadeiro, a

mensagem exibida na tela será 'maior que 0', caso
contrário, o resultado seria 'menor que 0'.

8
 CODING_JAVASCRIPT 2
UNIDADE 1

Além do "if-else", existem outras estruturas condicionais como

o "switch-case" e o "ternário".

• O "switch-case" é uma estrutura de seleção que permite

testar várias condições diferentes e executar diferentes
ações dependendo do resultado.

Ele é útil quando você tem várias opções possíveis e quer

escrever código diferente para cada uma delas.
Um exemplo simples de como utilizar a estrutura "switch-
case" em um programa poderia ser a seguinte:

Imagine que você está escrevendo um

programa que classifica frutas de acordo com
a cor. Você pode usar o comando "switch"
para testar a cor da fruta e, dependendo do
resultado, imprimir uma mensagem diferente
na tela.

O objetivo deste programa é classificar frutas

de acordo com a cor. Para isso, utilizamos uma
variável chamada 'corDaFruta' que guarda a
cor da fruta. Utilizamos a estrutura de controle
'switch-case' e, dependendo do resultado,
imprimir uma mensagem diferente na tela.
para verificar a cor da fruta

Por exemplo, se a variável 'corDaFruta'

contiver o valor 'vermelho', o programa
imprimirá a mensagem 'A fruta é uma maçã'
na tela.

Se a variável contiver o valor 'amarelo', o

programa imprimirá 'A fruta é uma banana'.
E se a variável contiver o valor 'verde', o
programa imprimirá 'A fruta é uma kiwi'.

9
 CODING_JAVASCRIPT 2
UNIDADE 1

No caso de a cor não ser identificada, temos um valor

padrão 'default' que imprimirá 'Não conseguimos identificar
a fruta'.

Dessa forma, utilizando a estrutura switch-case, conseguimos

classificar as frutas de forma automatizada e eficiente.

• O “condicional ternário” é uma estrutura de controle de

fluxo muito útil e versátil que permite a tomada de
decisões lógicas de forma concisa e eficiente no
JavaScript.
Ele é composto por três partes: uma expressão condicional,
seguida por um "?", e então duas possíveis expressões,
separadas por ":".
A primeira expressão é avaliada se a expressão condicional
for verdadeira, e a segunda expressão é avaliada se a
expressão condicional for falsa.

É importante notar que o condicional ternário é uma

maneira muito concisa de escrever uma estrutura de
controle de fluxo if-else, e é especialmente útil quando
precisamos tomar uma decisão simples com base em uma
única expressão condicional. No entanto, é importante usá-
lo com moderação, pois ele pode tornar o código difícil de
ler e entender se usado excessivamente ou em situações
complexas.

Em resumo, o condicional ternário é uma ferramenta valiosa

no JavaScript que permite a tomada de decisões simples de
forma concisa e eficiente, mas deve ser usado com
moderação para garantir a legibilidade do código.

10
 CODING_JAVASCRIPT 2
UNIDADE 1

Pode ser difícil entender os conceitos de condicionais neste

início, mas tenha certeza de que, à medida que avançarmos
no curso, você verá como esses conceitos são simples e
fáceis de se aplicar na prática!
No entanto, é importante que não deixemos de lado esses
conceitos agora, pois eles são fundamentais para a
programação.

11
 CODING_JAVASCRIPT 2
UNIDADE 1

Conclusão

Ao final desta jornada de aprendizado sobre condicionais,

somos capazes de compreender plenamente a importância
destas estruturas de controle de fluxo em nossos programas.
Elas nos permitem tomar decisões críticas e adaptar o
comportamento do nosso código de acordo com as
condições específicas do problema que estamos tentando
resolver.
Durante esta unidade, tivemos a oportunidade de explorar
as estruturas if, else, switch case e ternário, aprendendo
como utilizá-las de maneira eficiente e eficaz. Aprendemos
a controlar o fluxo de nossos programas de acordo com
diferentes condições e a utilizar estas estruturas para tomar
decisões lógicas.

É importante destacar que estas habilidades não são

apenas fundamentais para a programação, mas também
para a resolução de problemas em geral, e serão muito úteis
em nossas carreiras.

Agora, temos a capacidade de escrever códigos mais

sofisticados e flexíveis, o que nos permite criar aplicações
mais poderosas e adaptáveis às necessidades do usuário.

Devemos continuar praticando e aplicando esses conceitos

em nossos projetos futuros, pois quanto mais os usamos, mais
fácil se torna aplicá-los em situações reais e complexas.

12
 CODING_JAVASCRIPT 2

UNIDADE

IF / ELSE

13
 CODING_JAVASCRIPT 2
UNIDADE 2

If / Else
Introdução às estruturas de controle de fluxo: If e Else

Nesta aula, vamos aprender sobre as

estruturas de controle de fluxo no
JavaScript, especificamente sobre o
uso de If e Else.
Vamos entender como essas estruturas
funcionam e como elas podem ser
utilizadas para controlar o fluxo de
execução do nosso código.

Veremos exemplos práticos para que possa entender

como aplicar essas estruturas em seus próprios projetos.

If e Else são as estruturas de controle de fluxo mais comuns

em qualquer linguagem de programação. Recaptulando,
elas permitem que o código execute determinadas ações
baseadas em certas condições.

O comando If verifica se uma determinada condição é

verdadeira, e se for, executa um determinado conjunto
de instruções.
Caso contrário, o comando Else permite que outro
conjunto de instruções seja executado.

Além disso, também podemos utilizar vários comandos

"Else if" para testar várias condições diferentes, e assim,
tomar decisões mais complexas no nosso código.

14
 CODING_JAVASCRIPT 2
UNIDADE 2

Essas estruturas são amplamente utilizadas em aplicações

web, jogos, aplicativos de desktop e em muitas outras áreas
da programação.

Elas são fundamentais para a construção de programas

com lógica e inteligência.

Desta forma, esta aula é importante para quem deseja se

tornar um desenvolvedor de software, pois as estruturas de
controle de fluxo são fundamentais para a construção de
qualquer programa.

Aplicando condições lógicas com If e Else

Em JavaScript, as condições lógicas são usadas com os
comandos "if" e "else" para determinar se uma determinada
ação deve ser executada ou não. Por exemplo:

Neste exemplo, o código verifica se a variável "x" é maior do

que 0. Se for verdadeiro, a mensagem "x é maior do que 0" é
exibida no console. Caso contrário, a mensagem "x é menor
ou igual a 0" é exibida.
Mas e quando quisermos fazer mais de uma verificação?
podemos utilizar o "else if' para testar mais condições

"Else if" é uma condição adicional que pode ser usada em

conjunto com o comando "if" em programação. Ele permite
testar várias condições diferentes.

15
 CODING_JAVASCRIPT 2
UNIDADE 2

Imagine que você queira escrever um código que verifique

a idade de uma pessoa e que a classifique como criança,
adolescente ou adulto.

Você pode usar o comando "if" para verificar se a idade é

menor do que 12 e classificá-la como criança.
Mas, e se a pessoa tem 13 anos? Você precisaria usar outra
condição para verificar se a idade é maior do que 12 e
menor do que 18, e classificá-la como adolescente.

E se a pessoa tiver mais de 18 anos? Você precisaria usar

outra condição para verificar se a idade é maior do que 18,
e classificá-la como adulto.
Ao invés de escrever três condições diferentes usando "if"
três vezes, você pode usar "else if" para adicionar várias
condições ao mesmo comando "if". Assim, o código ficaria
mais curto e fácil de ler.

Neste exemplo, o código verifica se a idade é menor do

que 12. Se for verdadeiro, a pessoa é classificada como
criança.

Se não for verdadeiro, o código verifica se a idade é maior

ou igual a 12 e menor que 18. Se for verdadeiro, a pessoa é
classificada como adolescente.

Se nenhuma das condições anteriores forem verdadeiras, a

pessoa é classificada como adulto.

16
 CODING_JAVASCRIPT 2
UNIDADE 2

Aqui vão mais exemplos para você se familiarizar mais:

1. Calcular o maior número entre dois números:

2. Verificando se uma pessoa é maior de idade:

3. Verificando se uma pessoa é elegível para

aposentadoria:

17
 CODING_JAVASCRIPT 2
UNIDADE 2

Exercícios

Vamos à pratica!

Para melhor compreender como os comandos 'if' e 'else'

funcionam, crie um arquivo chamado "Aula8-if-else.js" e
cole o código de exemplo anterior (da página 16).

Em seguida, faça alterações na variável 'idade' testando os

valores 10, 14 e 20. Execute o programa e observe como a
classificação de criança, adolescente ou adulto muda de
acordo com as condições estabelecidas no código.

E agora no mesmo arquivo, faça o seguinte:

1. Escreva um código que verifique se um número é
positivo, negativo ou zero.

2. Escreva um código que verifique se uma letra digitada

é uma vogal ou uma consoante.
3. Escreva um código que verifique se um número é
divisível por 3 e por 5.

4. Escreva um código que verifique se um número é

primo ou não.

5. Escreva um código que verifique se uma pessoa pode

dirigir com base na idade e no número de anos de
carteira de habilitação.
6. Verifique se um número é par ou ímpar.

18
 CODING_JAVASCRIPT 2
UNIDADE 2

Conclusão

Esta unidade sobre condicionais no JavaScript mostrou

como usar as estruturas de controle de fluxo "if", "else" e "else
if" para tomar decisões lógicas no código.

Vimos como essas estruturas permitem que o programa

execute certas ações de acordo com determinadas
condições.

Usando o "if", podemos verificar se uma determinada

condição é verdadeira e, em caso afirmativo, executar
uma determinada ação.

O "else" é usado para fornecer uma ação alternativa caso a

condição do "if" seja falsa.
Por fim, o "else if" permite testar várias condições diferentes,
uma após a outra, e executar uma ação específica para
cada condição satisfeita.

Essas estruturas de controle de fluxo são fundamentais para

a programação e são amplamente utilizadas em muitos
aplicativos e sistemas.

Com a prática e o estudo, você deve se sentir confiantes

em usar "if", "else" e "else if" em seus próprios projetos.

19
 CODING_JAVASCRIPT 2

UNIDADE

SWITCH / CASE

20
 CODING_JAVASCRIPT 2
UNIDADE 3

Switch / Case
Introdução ao Switch / Case no JavaScript

O switch/case é uma estrutura de controle de fluxo no

JavaScript que permite testar vários valores diferentes de
uma variável ou expressão.
Ele é usado para comparar o valor de uma expressão com
vários valores "case" e, se corresponder, executar um
conjunto de instruções.
O switch/case é útil quando você tem vários valores
possíveis para uma variável e deseja executar uma ação
diferente para cada valor.
A sintaxe básica do switch/case é a seguinte:

A expressão é avaliada uma vez e é comparada com cada

valor case. Quando uma correspondência é encontrada, as
instruções correspondentes são executadas e, em seguida,
o fluxo de controle sai do switch.

O comando break é usado para sair do switch/case assim

que as instruções correspondentes são executadas.

21
 CODING_JAVASCRIPT 2
UNIDADE 3

O default é usado para lidar com valores não especificados.

Se nenhum dos valores case corresponderem ao valor da
expressão, as instruções no default serão executadas.

Se não houver um default, o fluxo de controle simplesmente

sairá do switch/case sem executar qualquer instrução.

Exemplos do switch/case no JavaScript

Oberve este exemplo basico onde comparamos a cor da
fruta para saber qual fruta é:

É importante observar que o switch/case é sensível ao tipo

de dados, ou seja, comparações serão feitas por tipo e
valor.

Por isso, é importante ter cuidado ao comparar valores de

diferentes tipos de dados.

22
 CODING_JAVASCRIPT 2
UNIDADE 3

Analise este exemplo para compreender como ocorre a

comparação de dados no switch/case de maneira mais
clara:

Como o switch/case é sensível ao tipo de dados, ele irá

selecionar o case correspondente ao valor exato e tipo de
dado, ignorando o caso onde o número "1" é passado
como uma string e selecionando o case onde o número 1 é
passado como um tipo number, resultando na impressão da
mensagem "o número é 1 com o dado tipo number".

Além disso, é importante notar que o switch/case não é

apenas limitado a comparações simples como números e
strings. Ele também pode ser usado para comparar
expressões. Veja o exemplo a seguir:

23
 CODING_JAVASCRIPT 2
UNIDADE 3

Neste exemplo, a expressão x + y é avaliada antes de ser

comparada com os valores case.

Isso significa que se x = 2 e y = 3, a soma será 5 e o case

correspondente será executado e "A soma é 5" será impresso
no console.

É importante estar ciente de que o switch/case pode ser

uma ferramenta poderosa e versátil, mas também é
importante usá-lo de maneira adequada para evitar
problemas de desempenho e legibilidade do código.

Outra coisa importante é que o switch/case pode ser

considerado mais performático do que o uso de múltiplos
if/else quando você tem muitas condições para verificar, pois
a comparação ocorre apenas uma vez e a execução é
direcionada para o case correspondente.

24
 CODING_JAVASCRIPT 2
UNIDADE 3

Exercícios

Agora vamos praticar!

1. Escreva um programa que receba um número inteiro

de 1 a 7 e imprima o nome do dia da semana
correspondente (utilizando switch case).
2. Escreva um programa que receba uma letra e
verifique se ela é uma vogal ou consoante (utilizando
switch case).
3. Escreva um programa que receba um código de
cores (por exemplo, "vermelho", "azul", "verde") e
imprima a cor correspondente em inglês (utilizando
switch case).
4. Escreva um programa que receba uma nota de 0 a
10 e imprima a correspondência em conceitos (por
exemplo, "reprovado", "aprovado", "aprovado com
louvor") (utilizando switch case).

25
 CODING_JAVASCRIPT 2
UNIDADE 3

Conclusão

Esta unidade que tratou sobre o uso do switch case no

JavaScript foi bastante proveitosa, pois foi possível
compreender a importância desse recurso na construção
de programas mais claros e eficientes.

O switch case é uma estrutura de controle de fluxo muito útil

quando se deseja comparar uma variável com vários
valores possíveis.
Ele funciona de maneira semelhante a uma série de if-else,
mas com uma sintaxe mais concisa e legível. Isso torna o
código mais fácil de ler e manter.

Foi possível ver na prática como o switch case pode ser

utilizado em diversas situações. Isso mostrou a versatilidade
desse recurso, que pode ser utilizado em muitas outras
aplicações.
Além disso, foi visto também que o switch case permite a
criação de casos padrão, como o default, que é executado
quando nenhum dos casos anteriores foi satisfeito. Isso é
muito útil quando se deseja tratar situações inesperadas ou
fornecer uma resposta padrão.

26
 CODING_JAVASCRIPT 2

UNIDADE

AVANÇANDO NOS
TIPOS DE DADOS

27
 CODING_JAVASCRIPT 2
UNIDADE 4

Avançando nos tipos de

dados
Introdução aos tipos de dados avançados no
JavaScript

Já sabemos que JavaScript é uma linguagem de

programação poderosa e versátil, e oferece uma variedade
de tipos de dados para armazenar e manipular
informações.

Nesta unidade, vamos nos concentrar em dois tipos de

dados avançados no JavaScript: arrays e objetos.
Começando com os arrays, eles são uma coleção
ordenada de valores que podem ser de qualquer tipo. Eles
são criados usando colchetes e separando os valores com
vírgulas.
Por exemplo, um array de números pode
ser criado da seguinte maneira:
var numeros = [1, 2, 3, 4, 5];.

Arrays são muito úteis para armazenar

conjuntos de dados relacionados, como
uma lista de nomes ou uma série de
números.

Os arrays oferecem uma série de métodos que permitem

manipular os dados de maneiras convenientes, como
adicionar, remover ou encontrar elementos. Além disso, eles
podem ser facilmente percorridos usando loops (um assunto
que veremos mais para frente), o que permite aplicar
operações em cada elemento.

Outro tipo de dado avançado importante é o objeto. Os

objetos são estruturas de dados que armazenam pares de
valores chave-valor.
28
 CODING_JAVASCRIPT 2
UNIDADE 4

Eles são criados usando chaves {} e

podem conter qualquer tipo de dado,
incluindo outros objetos e arrays. Por
exemplo, um objeto pode ser criado para
armazenar informações de uma pessoa,
como nome, idade e endereço.

Os objetos são muito versáteis e podem ser usados para

representar dados em formatos estruturados, como JSON
ou XML.
Eles também oferecem a capacidade de adicionar
métodos, ou funções, que podem ser usadas para
manipular os dados do objeto.
Em suma, arrays e objetos são tipos de dados avançados
fundamentais no JavaScript que permitem armazenar e
manipular dados de maneira estruturada e eficiente.

Eles são amplamente utilizados em aplicações JavaScript e

são uma parte importante da programação orientada a
objetos.

Introdução ao array

Os arrays no JavaScript são estruturas de dados que

permitem armazenar uma coleção de valores.

Eles são semelhantes a listas em outras linguagens de

programação e podem conter qualquer tipo de dado,
incluindo números, strings, objetos e até mesmo outros
arrays.

29
 CODING_JAVASCRIPT 2
UNIDADE 4

Os arrays são uma das estruturas de dados mais versáteis e

úteis em JavaScript, pois permitem armazenar e acessar
uma variedade de informações de maneira organizada e
eficiente.
Eles também possuem uma série de métodos e
propriedades que podem ser usados para manipular seus
elementos de diferentes maneiras.

Antes de partirmos para a proxima unidade e ver melhor

como é uma array, precisamos entender o que é e como
utilizar um indice de um array

Um índice de array é como um número de identificação

para cada elemento dentro do array.

Imagine um armário com vários

compartimentos, cada compartimento tem
um número, assim como cada elemento
dentro de um array tem um índice.

O índice é um número inteiro que começa em 0 para o

primeiro elemento, 1 para o segundo elemento, 2 para o
terceiro elemento e assim por diante.

Para acessar um elemento específico dentro de um array,

você usa os colchetes [] e coloca o índice do elemento
dentro dele.

Por exemplo, se você tem um array chamado "frutas" e quer

acessar o elemento "maçã", você escreveria "frutas[0]"
(lembrando que o primeiro elemento é 0).

Em resumo, os índices de arrays são números inteiros que

servem como identificadores para cada elemento dentro
de um array e são usados para acessar, alterar e remover
esses elementos.

30
 CODING_JAVASCRIPT 2
UNIDADE 4

Introdução ao object

Os objetos são como caixas de ferramentas digitais, onde

cada ferramenta é chamada de "propriedade" e tem um
valor específico.

Por exemplo, você pode criar um objeto chamado "carro" e

dar-lhe propriedades como "marca", "modelo" e "ano". Essas
propriedades podem ter valores específicos, como "Tesla",
"Model S" e "2022".

Além das propriedades, os objetos também podem ter

"métodos", que são como ferramentas especiais que podem
ser usadas para fazer coisas específicas com o objeto.

Por exemplo, você pode dar ao seu objeto "carro" um

método chamado "acelerar", que faria com que o carro
aumentasse a velocidade.
Os objetos podem ser criados usando a notação de objeto
literal, como "{ prop1: valor1, prop2: valor2 }".

Além disso, os objetos podem ser acessados e modificados

usando a notação de ponto, como "objeto.propriedade" ou
a notação de colchetes, como "objeto['propriedade']".
Em resumo, os objetos em JavaScript são uma forma
poderosa de armazenar e manipular dados em seus
programas. Eles permitem que você crie objetos complexos
com várias propriedades e métodos, e também podem ser
herdados para criar novos objetos com base em objetos
existentes.

31
 CODING_JAVASCRIPT 2
UNIDADE 4

Conclusão

Nesta unidade, nós cobrimos alguns dos tipos de dados

avançados que o JavaScript oferece para armazenar e
manipular informações em seus programas.
Primeiro, discutimos os tipos de dados avançados, como os
objetos e os arrays.

Os arrays são como listas de itens, onde cada item tem um

índice numérico

Os objetos são como caixas de

ferramentas digitais, onde cada
ferramenta é chamada de
"propriedade" e tem um valor
específico.

Em seguida, discutimos a introdução

ao array. Os arrays são uma das
estruturas de dados mais populares
em JavaScript e são usados para
armazenar uma coleção de valores.

Eles podem ser criados usando a notação de array literal,

como "[item1, item2, item3]" e podem ser acessados e
modificados usando a notação de índice, como
"array[índice]".

Além disso, os arrays possuem métodos embutidos que

permitem realizar operações como adicionar, remover, e
filtrar elementos.

Eles podem ser criados usando a notação de objeto literal,

como "{ prop1: valor1, prop2: valor2 }" e podem ser
acessados e modificados usando a notação de ponto,
como "objeto.propriedade" ou a notação de colchetes,
como "objeto['propriedade']". Além disso, os objetos
podem ter métodos que permitem realizar operações
específicas com o objeto.
32
 CODING_JAVASCRIPT 2

UNIDADE

CRIANDO
ARRAYS

33
 CODING_JAVASCRIPT 2
UNIDADE 5

Criando Arrays
Criar um array no JavaScript é simples e pode ser feito de
várias maneiras diferentes.

A forma mais comum de criar um array é usando a notação

de array literal, que é simplesmente uma lista de itens
separados por vírgulas e colocados entre colchetes. Por
exemplo, você pode criar um array de números como este:

Outra maneira de criar um array é usando o construtor de

array. Você pode criar um array vazio usando o construtor
de array como este:

Ou você pode passar valores para o construtor de array

para inicializar o array com esses valores:

E por último temos o método Array() é um construtor que

pode ser usado para criar arrays vazios ou arrays já
inicializados com valores:

Existem várias maneiras de se criar arrays no JavaScript,

essas são as principais formas. Cada uma dessas maneiras
tem suas vantagens e desvantagens, e a escolha
dependerá do seu caso específico.

34
 CODING_JAVASCRIPT 2
UNIDADE 5

Acessando e modificando elementos de um Array

Acessar e modificar elementos de um array é uma tarefa

comum ao trabalhar com arrays no JavaScript.

Para acessar um elemento específico de um array, você

pode usar o índice do elemento, que é uma posição
numérica dentro do array.

Por exemplo, para acessar o segundo elemento de um

array chamado "numbers", você pode usar o seguinte
código:

Você também pode modificar o valor de um elemento

específico de um array usando o índice do elemento e
atribuindo um novo valor a ele.

Por exemplo, para mudar o valor do primeiro elemento de

um array chamado "numbers" para 10, você pode usar o
seguinte código:

Além disso, existem métodos úteis para gerenciar elementos

de um array, como o método push() para adicionar um
elemento no final do array e o método pop() para remover
o último elemento do array.

Esses métodos são parte do conjunto de recursos do

JavaScript que permitem trabalhar de maneira eficiente
com arrays.
Mas não se preocupe, pois mais para frente vamos explorar
esses métodos em mais detalhes e ver como eles podem ser
utilizados para gerenciar seus dados de maneira eficiente!

35
 CODING_JAVASCRIPT 2
UNIDADE 5

Trabalhando com Arrays multidimensionais

Trabalhar com arrays multidimensionais pode ser um pouco

mais complexo do que trabalhar com arrays simples, mas é
uma habilidade importante ter quando se trabalha com
dados complexos no JavaScript.

Um array multidimensional é simplesmente um array dentro

de outro array.
Por exemplo, você pode ter um array chamado "matrix" que
contém três arrays internos, cada um representando uma
linha da matriz:

Para acessar um elemento específico em um array

multidimensional, você precisa especificar o índice do
elemento em cada nível de array. Por exemplo, para
acessar o número 5 na matriz acima, você usaria:

Isso acessaria o segundo array interno (índice 1) e, em

seguida, o segundo elemento desse array (índice 1).
É importante notar que trabalhar com arrays
multidimensionais pode ser mais complexo do que trabalhar
com arrays simples e pode ser mais fácil de se perder em
sua lógica. É importante planejar cuidadosamente como
você vai trabalhar com seus dados quando estiver
trabalhando com arrays multidimensionais.

36
 CODING_JAVASCRIPT 2
UNIDADE 5

Exercícios
Neste momento, vamos criar um novo arquivo chamado
'Aula10-Arrays.js' e realizaremos os exercícios abaixo
utilizando o terminal. Isso nos permitirá verificar se o código
está sendo executado corretamente e conforme o
esperado.

1. Crie um array de frutas e imprima cada fruta em uma

nova linha.

2. Modifique um elemento específico no array de frutas.

3. Crie um array multidimensional e acesse um elemento

específico.

4. Crie um array com os seus 5 filmes favoritos e imprima

cada filme em uma nova linha.
5. Modifique o segundo elemento do array de filmes.
6. Crie um array com 5 números e calcule a soma de
todos os números.
7. Modifique um número específico no array de números.

8. Crie um array com 5 nomes de pessoas e junte todos

os nomes em uma única string, separados por vírgula.
9. Modifique o segundo nome do array de nomes.

37
 CODING_JAVASCRIPT 2
UNIDADE 5

Conclusão

Nesta unidade, abordamos o assunto de arrays no

JavaScript, começando pelo básico: como criar e inicializar
arrays com valores predefinidos.
Discutimos como acessar e modificar elementos em um
array simples, bem como como trabalhar com arrays
multidimensionais.
Ao final desta seção, você deve ter uma compreensão
clara de como criar, acessar e modificar arrays no
JavaScript, bem como de como trabalhar com arrays
multidimensionais.
Este conhecimento é importante para gerenciar dados
complexos no seu código e permitirá que você construa
aplicações poderosas e escaláveis.

Lembre-se de continuar praticando e explorando novos

métodos e técnicas relacionados a arrays no JavaScript
para se tornar cada vez mais confiante em seu uso.

Com a prática e o tempo, você poderá se tornar um expert

em arrays no JavaScript e poderá aplicá-los de maneira
profissional em seus projetos futuros!

38
 CODING_JAVASCRIPT 2

UNIDADE

CRIANDO
OBJECTS

39
 CODING_JAVASCRIPT 2
UNIDADE 6

Criando objects
Criando objetos com notação literal

A notação literal é uma forma simples e eficiente de criar

objetos em JavaScript.

Ao invés de utilizar a palavra-chave "new" ou uma função

construtora, você pode definir um objeto diretamente em
seu código, entre chaves "{}".
Cada propriedade de um objeto é representada por uma
chave-valor, separadas por dois pontos.

Por exemplo, você pode criar um objeto para representar

uma pessoa, com as propriedades "nome", "idade" e
"cidade".

Você pode acessar as propriedades de um objeto criado

com notação literal usando o operador ".", seguido pelo
nome da propriedade.

Por exemplo, para acessar o nome da pessoa, você pode

escrever:

40
 CODING_JAVASCRIPT 2
UNIDADE 6

Você também pode modificar e remover propriedades de

um objeto criado com notação literal da mesma forma que
acessa. Por exemplo, você pode mudar a idade da pessoa
para 31 anos, assim:

E remover a propriedade "cidade", assim:

A notação literal é uma ferramenta poderosa para

trabalhar com objetos em JavaScript, e é amplamente
utilizada em aplicações web.

Ao utilizá-la, você pode criar objetos complexos com muitas

propriedades e aninhar objetos uns dentro dos outros, para
representar dados de uma forma clara e organizada.
Além da criação de objetos simples, como o exemplo da
pessoa acima, a notação literal também permite a criação
de objetos mais complexos, com propriedades que são
outros objetos ou arrays.

Por exemplo, você pode criar um objeto para representar

uma loja, com as propriedades "nome", "endereço" e
"produtos".

O endereço pode ser representado por um objeto, com as

propriedades "rua", "cidade" e "estado".
E os produtos podem ser representados por um array de
objetos, cada um com as propriedades "nome", "preço" e
"descrição".

Veja o exemplo na pagina seguinte!

41
 CODING_JAVASCRIPT 2
UNIDADE 6

Você pode acessar as propriedades aninhadas da mesma

forma que acessa propriedades de um objeto simples,
usando o operador ".". Por exemplo, para acessar o
endereço da loja, você pode escrever:

E para acessar o primeiro produto da loja, você pode

escrever:

A notação literal permite ainda a criação de objetos

dinâmicos, onde você pode adicionar ou remover
propriedades em tempo de execução. Isso é útil quando
você precisa representar dados que podem mudar ao
longo do tempo, como um carrinho de compras, onde os
produtos podem ser adicionados ou removidos pelo
usuário.
42
 CODING_JAVASCRIPT 2
UNIDADE 6

Acessando as propriedades de um objeto

Para acessar as propriedades de um objeto você pode usar

o operador "." (ponto), seguido pelo nome da propriedade.

Por exemplo, se você tem um objeto "pessoa" com as

propriedades "nome" e "idade", você pode acessar essas
propriedades da seguinte forma:

Se você precisa acessar a propriedade de um objeto que é

outro objeto, você pode usar o operador "." várias vezes, um
para cada objeto aninhado.

Por exemplo, se você tem um objeto "endereço" com as

propriedades "rua", "cidade" e "estado", você pode acessar
essas propriedades da seguinte forma:

43
 CODING_JAVASCRIPT 2
UNIDADE 6

Além do operador ".", você também pode acessar as

propriedades de um objeto usando a notação de colchetes
"[ ]", passando o nome da propriedade como string.

Por exemplo:

A notação de colchetes é útil quando você precisa acessar

a propriedade de um objeto dinamicamente, ou seja,
quando o nome da propriedade é determinado em tempo
de execução.
Por exemplo:

44
 CODING_JAVASCRIPT 2
UNIDADE 6

Exercícios

Agora que já conhecemos os conceitos e as formas de criar

objetos, vamos colocar em prática!

Crie um arquivo chamado "Aula11-Objects.js" e execute os

exercícios sbaixo. Não esqueça de executar o arquivo no
terminal para verificar se está funcionando corretamente.

1. Crie um objeto "pessoa" com as propriedades "nome",

"idade" e "cidade". Atribua valores a essas propriedades
e imprima na tela.

2. Adicione uma propriedade "endereço" ao objeto

"pessoa", sendo que "endereço" é outro objeto com as
propriedades "rua", "bairro" e "cep". Atribua valores a
essas propriedades e imprima na tela.
3. Adicione a propriedade "hobbies" ao objeto "pessoa",
sendo que "hobbies" é um array de strings,
representando os hobbies da pessoa. Adicione pelo
menos 3 hobbies e imprima na tela.
4. Adicione uma propriedade "trabalho" ao objeto
"pessoa", sendo que "trabalho" é outro objeto com as
propriedades "empresa", "cargo" e "salario". Atribua
valores a essas propriedades e imprima na tela.

45
 CODING_JAVASCRIPT 2
UNIDADE 6

Conclusão

Nesta unidade, aprendemos sobre objetos em JavaScript.

Vimos como criar objetos com notação literal e acessar suas
propriedades.

Além disso, praticamos adicionando propriedades a um

objeto e criando funções para exibir informações sobre ele.

Ao final, é importante ressaltar que objetos são uma parte

fundamental da linguagem e possibilitam uma
representação mais realista e complexa de dados em nossos
programas.

46
 CODING_JAVASCRIPT 2

UNIDADE

INTRODUÇÃO
AOS LOOPS

47
 CODING_JAVASCRIPT 2
UNIDADE 7

Introdução aos Loops

Loops em JavaScript são estruturas de controle de fluxo que

permitem repetir uma ação ou processamento enquanto
uma determinada condição é verdadeira.

Os loops em JavaScript são muito flexíveis e podem ser

usados para realizar uma ampla variedade de tarefas,
como iteração de arrays, cálculos matemáticos,
processamento de formulários, e muito mais. Eles são úteis
para automatizar tarefas repetitivas.

Os loops fornecem uma forma de repetir

uma seção de código até que uma
determinada condição seja satisfeita.
Existem três tipos principais de loops no
JavaScript: for, while, e do...while.

O loop for é usado quando você sabe quantas vezes

precisa repetir a ação.

O loop while é usado quando você não sabe quantas vezes

precisa repetir a ação, mas tem uma condição que
determina quando a repetição deve parar.

O loop do...while é semelhante ao while, mas garante que a

ação seja executada pelo menos uma vez,
independentemente da condição. Além disso, os loops
também podem ser aninhados para realizar tarefas mais
complexas.

Além disso, é possível interromper um loop usando as

palavras-chave "break" ou "continue".

48
 CODING_JAVASCRIPT 2
UNIDADE 7

Os loops são fundamentais para a programação e estão

presentes em quase todas as linguagens de programação,
incluindo o JavaScript.

É importante que os programadores compreendam a

sintaxe e o funcionamento dos loops, bem como as
melhores práticas para seu uso eficiente.

É fácil escrever um código com loop que acabe se

provando ineficiente, ou que contenha erros, portanto, é
importante compreender completamente o funcionamento
dos loops antes de usá-los em projetos reais.
Além disso, é importante prestar atenção às condições de
parada dos loops, garantindo que eles não sejam
intermináveis e causem problemas de performance no seu
aplicativo.

Alguns exemplos comuns de uso de loops incluem:

• Iterar sobre coleções de dados, como arrays ou objetos;

• Realizar cálculos matemáticos complexos;
• Gerar HTML dinamicamente baseado em dados do
servidor;
• Realizar verificações de entrada do usuário;
• Executar ações baseadas em intervalos de tempo (por
exemplo, animações);
• Criar gráficos baseados em dados.

Usar loops ajuda a manter o código conciso, ao invés de

escrever manualmente um commando de repetição. Além
disso, a automatização oferecida pelos loops ajuda a evitar
erros humanos e aumenta a precisão do seu código.

49
 CODING_JAVASCRIPT 2
UNIDADE 7

Além dos exemplos mencionados anteriormente, os loops

também permitem que você execute ações com base em
condições específicas.

Por exemplo, você pode usar um loop para percorrer uma

coleção de dados e executar ações apenas em
determinados itens. Isso pode ser útil ao filtrar dados,
selecionar itens específicos para processamento, etc.

Os loops também podem ser usados para realizar tarefas

recursivas, onde uma função é chamada a si mesma até
que uma determinada condição seja atendida.

Isso é útil para resolver problemas de programação

complexos que podem ser decompostos em subproblemas
menores.
Em resumo, os loops são uma ferramenta poderosa para a
programação e oferecem muitas possibilidades para
automatizar tarefas repetitivas, realizar cálculos complexos, e
realizar ações baseadas em condições.

50
 CODING_JAVASCRIPT 2
UNIDADE 7

Break e Continue

"Break" e "continue" são comandos que permitem a você

controlar o fluxo de repetição em um loop. Quando você
está executando um loop, ele continuará rodando até que
uma determinada condição seja atendida.

"Break" é usado para interromper o loop imediatamente.

Quando o loop encontra "break", ele para a execução do
loop imediatamente.
"Continue", por outro lado, permite que você pule para a
próxima iteração do loop sem executar as ações restantes
na iteração atual.

Esses comandos são úteis quando você quer controlar o

comportamento do loop de acordo com determinadas
condições. Por exemplo, você pode usar "break" para
interromper o loop quando uma condição específica é
atendida, ou usar "continue" para pular iterações
específicas sem interromper o loop completamente.
Além de controlar o fluxo de repetição em um loop, "break"
e "continue" também são úteis em outras situações de
programação. Você pode usar "break" para sair de múltiplos
loops aninhados de uma só vez. Isso pode ser útil se você
quiser interromper a execução de todos os loops quando
uma determinada condição for atendida.

"Continue" também é útil para filtrar dados ou pular

iterações específicas sem interromper o loop
completamente. Por exemplo, você pode usar "continue"
para pular iterações em que um valor específico não é
encontrado em um conjunto de dados.

Em resumo, "break" e "continue" são ferramentas valiosas

para controlar o comportamento de loops em JavaScript, e
podem ser usadas para criar soluções de programação
mais sofisticadas e eficientes.

51
 CODING_JAVASCRIPT 2
UNIDADE 7

Conclusão

Ao longo desta unidade, discutimos sobre loops em

JavaScript e sua importância na programação.

Vimos que loops são estruturas de repetição que permitem

que você execute ações repetidas vezes, até que uma
determinada condição seja atendida.

Eles são amplamente utilizados na programação para

automatizar tarefas repetitivas, filtrar dados e implementar
algoritmos complexos.

Exploramos os atributos dos diferentes tipos de loops

disponíveis em JavaScript, como for, while e do...while.
Cada tipo de loop é apropriado para situações diferentes, e
é importante escolher o loop certo para a tarefa correta.

Aprendemos sobre dois comandos importantes - "break" e

"continue", que permitem controlar o fluxo de execução do
loop. "Break" é usado para interromper o loop
imediatamente, enquanto "continue" permite pular para a
próxima iteração do loop sem executar as ações restantes
na iteração atual.

Em resumo, loops são uma parte fundamental da

programação e são amplamente utilizados para
automatizar tarefas repetitivas, filtrar dados e implementar
algoritmos complexos.

52
 CODING_JAVASCRIPT 2

UNIDADE

COMANDO
‘FOR’

53
 CODING_JAVASCRIPT 2
UNIDADE 8

Comando ‘For’
O comando "for" em JavaScript é uma estrutura de
repetição que permite executar uma determinada ação
várias vezes, baseado em uma condição pré-estabelecida.
É usado para iterar sobre arrays, repetir ações específicas,
entre outros. É ainda uma das estruturas de controle de fluxo
mais comuns em JavaScript. Ele permite que um trecho de
código seja executado várias vezes, enquanto uma
determinada condição for verdadeira.
A estrutura do comando "for" inclui uma inicialização, uma
condição de parada e uma operação de incremento ou
decremento. A cada iteração, a condição é avaliada.
Se a condição for verdadeira, o código dentro do "for" é
executado, e então a operação de incremento ou
decremento é realizada. Este processo é repetido até que a
condição se torne falsa.
O comando "for" é útil para repetir ações específicas e iterar
sobre arrays.

Estrutura do comando "for"

A estrutura do comando "for" em JavaScript consiste em três
partes principais: inicialização, condição de parada, e
operação de incremento/decremento. A sintaxe é a
seguinte:

for (inicialização; condição de parada; operação de

incremento/decremento) {
// código a ser executado
}

54
 CODING_JAVASCRIPT 2
UNIDADE 8

• Inicialização: é realizada uma única vez, no início do loop.

Aqui é definido o valor inicial de uma variável de
contagem, por exemplo.

• Condição de parada: é avaliada a cada iteração. Se a

condição for verdadeira, o código dentro do "for" é
executado. Se a condição for falsa, o loop é interrompido.

• Operação de incremento/decremento: é realizada após

cada iteração. Aqui é definido como a variável de
contagem será modificada em cada iteração.

Exemplo:

Neste exemplo, o loop será executado 10

vezes, começando em 0 e incrementando em
1 a cada iteração, até que a condição i < 10
se torne falsa.
Esta é a saida ao rodar
o arquivo no terminal.

A estrutura do comando "for" em JavaScript é uma das

formas mais eficientes de se realizar tarefas repetitivas. Além
disso, ele permite controlar a quantidade de iterações de
forma precisa, garantindo que o código seja executado
apenas até que a condição desejada seja alcançada.

Isso é útil para realizar operações como percorrer arrays,

realizar cálculos com base em valores específicos, entre
outros.

É importante destacar que o comando "for" é uma estrutura

de repetição determinada, ou seja, o número de iterações é
conhecido previamente. Em casos em que o número de
iterações não é conhecido previamente, outras estruturas de
repetição, como o comando "while", podem ser mais
apropriadas.
55
 CODING_JAVASCRIPT 2
UNIDADE 8

Usando o "for" para repetir ações

O comando "for" pode ser usado para repetir ações

específicas em JavaScript. Isso é feito através da definição
de uma condição de parada e da operação de
incremento/decremento, que determinam quantas vezes o
código dentro do loop será executado.

Exemplo: imprimir números de 0 a 9.

Exemplo: somar todos os números de 1 a 10.

Exemplo: imprimir todos os elementos de um array.

56
 CODING_JAVASCRIPT 2
UNIDADE 8

Para melhor entedimento do último exemplo, aqui vai a

explicação passo a passo:

1. Primeiro, uma variável "arr" é criada com os valores [1, 2,

3, 4, 5].

2. Em seguida, o comando "for" é usado para percorrer o

array "arr". A inicialização "var i = 0" define o valor inicial
da variável de contagem "i" como 0.

3. A condição de parada "i < arr.length" é avaliada antes

de cada iteração. O método ".length" retorna o
comprimento do array, no caso, 5. Então, o loop será
executado 5 vezes, até que a condição "i < 5" se torne
falsa.

4. A operação de incremento "i++" é executada após

cada iteração. Isso significa que a variável "i" será
incrementada em 1 a cada iteração.
5. O código dentro do "for" `console.log(arr[i])` imprime o
valor do elemento no índice "i" do array. Na primeira
iteração, "i" é 0, então o elemento no índice 0 "(arr[0])" é
impresso. Na segunda iteração, "i" é 1, então o elemento
no índice 1 "(arr[1])" é impresso, e assim por diante.
Este exemplo mostra como o comando "for" pode ser usado
para percorrer um array e realizar uma ação para cada
elemento. É uma maneira eficiente de se trabalhar com
arrays em JavaScript.

57
 CODING_JAVASCRIPT 2
UNIDADE 8

Exercícios

Crie um arquivo javascript chamado "Aula12-Comando-

For.js" para realizar os exercicios a seguir. Não esqueça de
utilizar o terminal para rodar o arquivo e verificar se o
Código está correto!

• Imprima todos os números de 1 a 10 no console usando o

comando "for".
• Crie um array com os nomes de seus amigos e imprima
cada nome no console usando o comando "for".

• Calcule a soma de todos os números de 1 a 100 usando

o comando "for".

• Crie uma função que retorne o fatorial de um número x

usando o comando "for".

• Imprima todos os números pares de 0 a 20 usando o

comando "for".

• Crie um array com 10 números aleatórios e imprima o

maior número usando o comando "for".
• Escreva uma função que retorne a média de todos os
elementos de um array de números usando o comando
"for".
Estes simples exercícios são uma ótima maneira de praticar
e fixar os conceitos do comando "for" em JavaScript!

58
 CODING_JAVASCRIPT 2
UNIDADE 8

Conclusão

O comando "for" é uma das estruturas de loop mais

utilizadas em JavaScript. Ele permite a execução de ações
repetitivas de maneira eficiente e controlada.

A estrutura do comando "for" inclui a inicialização de uma

variável de contagem, a definição de uma condição de
parada e a operação de incremento/decremento. Estes
componentes trabalham juntos para determinar quantas
vezes o código dentro do loop será executado.
O comando "for" pode ser usado para percorrer arrays e
realizar ações para cada elemento, ou para realizar
cálculos repetitivos, como a soma de números.

Em resumo, o comando "for" é uma ferramenta poderosa

em JavaScript que permite a execução de ações
repetitivas de maneira controlada e eficiente.
Conhecer sua estrutura e uso é fundamental para a
programação em JavaScript!

59
 CODING_JAVASCRIPT 2

UNIDADE

WHILE &
DO-WHILE

60
 CODING_JAVASCRIPT 2
UNIDADE 9

While & Do While

O que é um loop "while" e como usá-lo

Um loop "while" é uma estrutura de repetição que permite

que um bloco de código seja executado repetidamente
enquanto uma determinada condição for verdadeira. Vale
lembrar que a tradução de while para o português é
“enquanto".

No JavaScript, é usado da seguinte forma:

while (condição) {
// código a ser executado enquanto a condição for
verdadeira
}

O loop "while" é útil quando não se sabe quantas vezes um

determinado código precisará ser executado. Ele permite
que você execute um código repetidamente enquanto
uma condição específica for verdadeira.

É importante que a condição seja modificada dentro do

corpo do loop, de forma que eventualmente ela se torne
falsa, evitando assim um loop infinito.

O loop "while" é usado em muitas situações diferentes, como

percorrer arrays, realizar cálculos e controlar o fluxo de
programas.

Além disso, é possível interromper o loop "while" usando o

comando "break" ou continuar a sua execução com o
comando "continue".
Veremos um exemplo claro do uso do while na próxima
pagina!

61
 CODING_JAVASCRIPT 2
UNIDADE 9

Exemplo de uso do loop "while" no JavaScript:

Neste exemplo, a variável "contador" é inicializada com o

valor 0 e é incrementada a cada iteração do loop. O loop
será executado enquanto "contador" for menor que 10,
imprimindo seu valor na tela a cada iteração. Quando
"contador" atingir 10, a condição não será mais verdadeira
e o loop terminará.

É importante notar que é necessário garantir que a

condição eventualmente se torne falsa dentro do loop,
caso contrário, ele se tornará infinito e poderá travar o seu
programa.

É comum usar um contador ou um iterador para controlar

a condição do loop.

Também é possível interromper a execução do loop "while"

com o comando "break". Este comando encerra
imediatamente a execução do loop, independentemente
da condição.
62
 CODING_JAVASCRIPT 2
UNIDADE 9

Por exemplo:

Neste exemplo, a condição é sempre verdadeira (true), mas

o loop é interrompido quando o contador atinge 6, usando
o comando "break".

63
 CODING_JAVASCRIPT 2
UNIDADE 9

O que é um loop “do-while" e como usá-lo

O loop "do-while" é similar ao loop "while", mas garante que

o código dentro do loop seja executado pelo menos uma
vez, independentemente da condição.

No JavaScript, ele é escrito da seguinte forma:

do {
// código a ser executado
} while (condição);

A diferença em relação ao loop "while" é que a condição é

avaliada após a primeira execução do código dentro do
loop, ao invés de antes. Isso significa que, mesmo se a
condição for falsa, o código dentro do loop será executado
pelo menos uma vez.
Exemplo de uso do loop "do-while" no JavaScript:

Neste exemplo, o código dentro do loop é executado pelo

menos uma vez, independentemente da condição
(contador === 10).

Depois, a condição é avaliada e, enquanto for verdadeira,

o código será executado novamente. O loop terminará
quando a condição se tornar falsa.
64
 CODING_JAVASCRIPT 2
UNIDADE 9

Exercícios

Agora que adquirimos conhecimento sobre o loop while e

do while, é hora de colocarmos em prática o que
aprendemos. Vamos criar um arquivo chamado "Aula13-
While-DoWhile.js" para realizar os próximos exercícios.

Não se esqueça de utilizar o terminal para verificar se o

código está sendo executado com sucesso e para obter
feedback imediato sobre o seu progresso!

1. Escreva um loop "while" que conte de 1 a 10.

2. Escreva um loop "do-while" que conte de 10 a 1.

3. Escreva um loop "while" que calcule a soma de

todos os números pares entre 1 e 10.
4. Escreva um loop "do-while" que imprima a
tabuada do número 7.

5. Escreva um loop "while" que imprima todos os

números ímpares entre 0 e 20.

65
 CODING_JAVASCRIPT 2
UNIDADE 9

Conclusão

Nesta unidade, abordamos dois tipos de loops no JavaScript:

o loop "while" e o loop "do-while". Como vimos
anteriormente, os loops são uma ferramenta importante na
programação, pois permitem a execução de código
repetidamente, baseado em uma condição.

O loop "while" executa o código dentro dele enquanto a

condição for verdadeira. Quando a condição se torna falsa,
o loop é encerrado. É importante garantir que a condição
se torne falsa eventualmente, caso contrário, o loop será
infinito.

Já o loop "do-while" é similar ao loop "while", mas garante

que o código dentro do loop seja executado pelo menos
uma vez, independentemente da condição. A diferença é
que a condição é avaliada após a primeira execução do
código, ao invés de antes.
Em resumo, os loops "while" e "do-while" são ferramentas
poderosas para controlar a execução de código no
JavaScript.

É importante entender as diferenças entre eles e saber como

utilizá-los corretamente para resolver problemas de maneira
eficiente.

66
 CODING_JAVASCRIPT 2

UNIDADE

FOR-IN

67
 CODING_JAVASCRIPT 2
UNIDADE 10

Loop For-in

O que é e como utilizar

O loop for-in é uma característica do JavaScript que permite

percorrer objetos e acessar suas propriedades.

Imagine que você tem uma caixa cheia de objetos, como

livros, brinquedos e outros itens. O loop for-in é como uma
lista de compras que vai percorrendo cada item na caixa e
anotando seu nome (ou propriedade).
A sintaxe do loop for-in é simples: basta escrever a palavra
"for", seguida da variável que irá armazenar o nome de
cada item (ou propriedade) em cada iteração, seguida da
palavra "in", e finalizando com o nome da caixa (ou objeto)
que deseja percorrer.
O loop for-in é uma ferramenta muito útil no
desenvolvimento de aplicações em JavaScript, pois permite
que você acesse facilmente as propriedades de objetos
dinâmicos, ou seja, aqueles cujas propriedades podem
mudar com o tempo. Além disso, ele é uma forma eficiente
de percorrer objetos e obter informações sobre suas
propriedades.

O loop for-in é uma estrutura de repetição em JavaScript

que permite percorrer objetos e arrays, acessando suas
propriedades ou elementos, respectivamente.

Na página seguinte está um exemplo de como usar o loop

for-in para percorrer um array.

68
 CODING_JAVASCRIPT 2
UNIDADE 10

Neste exemplo, estamos criando um array chamado

"numeros" que contém 5 números. Em seguida, usamos o
loop for-in para percorrer o array, acessando cada um de
seus elementos.
A variável "i" representa o índice de cada elemento do
array, que podemos usar para acessar o elemento
específico usando o operador [].

Por fim, usamos o "console.log" para imprimir o valor de

cada elemento.

O resultado deste código será:

69
 CODING_JAVASCRIPT 2
UNIDADE 10

Aqui está mais um exemplo prático de como usar o loop for-

in em JavaScript, mas agora com um objeto:

Neste exemplo, criamos um objeto chamado "pessoa" que

contém informações sobre uma pessoa, como nome, idade
e cidade.

Em seguida, usamos o loop for-in para percorrer o objeto,

acessando cada uma de suas propriedades.

A variável "propriedade" representa o nome de cada

propriedade do objeto, que podemos usar para acessar o
valor específico usando o operador [].

Por fim, usamos o console.log para imprimir o nome e o valor

de cada propriedade.

O resultado deste código será:

70
 CODING_JAVASCRIPT 2
UNIDADE 10

Exercícios

Vamos à prática! Crie um arquivo chamado "Aula14-For-

in.js" e realizar os próximos exercícios.

Não se esqueça de utilizar o terminal para verificar se o

código está sendo executado com sucesso e para obter
feedback imediato sobre o seu progresso.

1. Crie um array com 5 nomes de frutas e use o loop for-in

para imprimir cada um dos nomes.

2. Crie um objeto com informações sobre você (por

exemplo, nome, idade, cidade), e use o loop for-in
para imprimir cada uma das informações.

3. Crie um array com números de 1 a 10 e use o loop for-

in para imprimir o resultado da multiplicação de cada
número por 2.
4. Crie um objeto com informações sobre um carro (por
exemplo, marca, modelo, ano), e use o loop for-in
para imprimir cada uma das informações.

5. Crie um array com números de 1 a 10 e use o loop for-

in para calcular a soma dos números.

6. Crie um objeto com informações sobre vários filmes

(por exemplo, título, gênero, classificação), e use o
loop for-in para imprimir somente os títulos dos filmes.

71
 CODING_JAVASCRIPT 2
UNIDADE 10

Conclusão

Ao trabalhar com loops em JavaScript, o loop for-in é uma

ferramenta muito útil para iterar através de objetos e arrays.
Ele funciona por percorrer todas as propriedades
enumeráveis de um objeto ou todos os índices de um array.
Isso permite que você acesse e manipule de forma eficiente
todos os dados armazenados em um objeto ou array.

Ao usar o loop for-in, é importante ter em mente que ele irá

iterar somente sobre as propriedades enumeráveis de um
objeto, o que significa que as propriedades herdadas por
protótipo não serão acessíveis.
Além disso, é importante lembrar que a ordem na qual as
propriedades são acessadas não é garantida.

72