PARTE 1

Qual o seu nome?

Oi! Vamos nos conhecer melhor. Qual o seu nome?

Instrues

Escreva seu nome entre aspas, assim: "Ryan", ento clique em "Salvar e Enviar
Cdigo".

Descubra o comprimento

Muito bom!
Qual seria o comprimento do seu nome?

Instrues

Para descobrir o comprimento do seu nome, escreva-o entre aspas. Ento, escreva um
ponto e a palavra length, assim: "yourName".length

Quando tiver terminado, clique em Salvar e Enviar Cdigo

(De agora em diante, faa isso sempre que terminar um exerccio).
No meu caso (meu nome Leng) isso seria "Leng".length

Matemtica bsica

Bom trabalho! Agora, vamos fazer um pouco de matemtica. Voc pode fazer contas
com programao!

Instrues

Some quaisquer dois nmeros, assim: 3 + 4

Nmeros e mais

V o que aconteceu? Voc pode usar a linha de comando para realizar operaes
matemticas bsicas. Tente fazer mais algumas.

Instrues

Voc pode usar * para multiplicao e / para diviso se quiser. Entre outra expresso
vlida para encerrar esta lio.
Erro: no computa!

H algumas coisas que voc no pode fazer no console. Computadores falam apenas
certas linguagens, como a que voc est usando hoje: JavaScript!

Se voc usar palavras que no fazem parte da linguagem JavaScript, ele ficar confuso
apresentar um erro.

Instrues

Tente confundir o interpretador usando uma palavra que ele no conhece, como
berinjela: Isso gerar um ReferenceError.

Editor e comentrios
At agora estivemos escrevendo linhas de cdigo no editor. Agora vemos duas linhas
que comeam com //.

O sinal // para comentrios. Um comentrio uma linha de texto que o JavaScript

no vai tentar executar como cdigo. apenas para humanos lerem.

Comentrio tornam seu programa mais fcil de entender. Quando voc rel seu cdigo,
ou outros querem colaborar com voc, podem ler seus comentrios e entender
facilmente o que seu cdigo faz.

Instrues
O computador vai ignorar o cdigo nas linhas 1-2, j que ele est marcado como
comentrio.

Na linha 3, encontre o comprimento da palavra "cake" (bolo).

Podemos encontrar o comprimento da palavra "Emily" assim:

"Emily".length;
Se voc marcar seu novo cdigo como comentrio, ele no vai funcionar! Tenha certeza
de que ele no est marcado como comentrio.

// Isto e um comentario, que o computador vai ignorar.

// Ele e apenas para voce!

"cake".length
O que programao?

Programar como escrever uma lista de instrues para o computador, para que ele
possa fazer coisas leagais com suas informaes.

Programas ainda no podem fazer sua cama, mas podem fazer contas, manter o controle
da sua conta bancria, ou mandar uma mensagem para um amigo.

Para fazer qualquer uma dessas coisas, o programa precisa de uma entrada. Voc pode
pedir por uma entrada com um prompt.

Exemplos:

1. prompt("Qual o seu nome?");

2. prompt("O que Ubuntu?");

Instrues

Use o comando prompt para perguntar ao usurio de onde ele . Consulte os exemplos
acima para saber como fazer isso!

O que estou aprendendo?

Este o JavaScript (JS), uma linguagem de programao. H muitas linguagens, mas o

JS tem muitos usos e fcil de aprender.

Para que podemos usar o JavaScript?

fazer websites responder interao do usurio

criar apps e jogos (por ex. blackjack)

acessar informaes na internet (por ex. descobrir as palavras mais mencionadas

no Twitter por tpico)

organizar e apresentar dados (por ex. automatizar o trabalho com planilhas,

visualizao de dados)

Instrues

Clique em Salvar e Enviar Cdigo para ver um exemplo de como o JavaScript pode ser
interativo!

confirm('Isto e um exemplo do uso de JS para criar interao em um

website. Clique em OK para continuar!');
JavaScript Interativo

O que acabamos de ver foi um exemplo divertido de como o JavaScript pode ser
interativo. Agora tente voc!

Exemplos:

confirm("Me sinto timo!");

confirm("Estou pronto para ir.");

Essas caixas podem ser usados em websites para confirmar coisas com os usurios.
Voc provavelmente j as viu aparecer quando tenta apagar coisas importantes, ou sair
de um website sem salvar modificaes.

Instrues

Escreva sua prpria mensagem para o que voc quer que o usurio confirme.

// Tente tambm o forum de Perguntas e Respostas para obter ajuda

// O link esta no canto inferior esquerdo da pagina!

confirm("adriana sua chata!");

confirm("eu te amo!");

O que programao?
Programar como escrever uma lista de instrues para o computador, para que ele
possa fazer coisas leagais com suas informaes.

Programas ainda no podem fazer sua cama, mas podem fazer contas, manter o controle
da sua conta bancria, ou mandar uma mensagem para um amigo.

Para fazer qualquer uma dessas coisas, o programa precisa de uma entrada. Voc pode
pedir por uma entrada com um prompt.

Exemplos:

1. prompt("Qual o seu nome?");

2. prompt("O que Ubuntu?");

Instrues
Use o comando prompt para perguntar ao usurio de onde ele . Consulte os exemplos
acima para saber como fazer isso!
At mesmo pequenos erros de digitao podem causar erros. Tenha certeza de que sua
pontuao est correta e que todos as chaves ou colchetes abertos sejam fechados.

prompt("QUAL O SEU NOME?");

prompt("NAO");

Tipos de Dados I e II: Nmeros e Strings

Dados vm em diversos tipos. Voc j usou dois deles!

a. nmeros so quantidades, como voc j est acostumado. Voc pode fazer contas
com eles.

b. strings so sequncias de caracteres, como as letras a-z, espaos, e at mesmo

nmeros. Todos esses so exemplos de strings: "Ryan", "4" e "Qual e o seu nome?"
Strings so extremamente teis como identificadores, nomes, e contedo para seus
programas.

Para criar um nmero em seu cdigo, simplesmente escreva um nmero com algarismos
sem aspas: 42, 190.12334.

Para escrever uma string, coloque as palavras entre aspas: "Qual o seu nome?"

Instrues

1. Escreva uma string com pelo menos 3 palavras. Leia os exemplos de strings
acima.

2. Encontre o comprimento da string escrevendo um ponto e a palavra length,

assim:

3. "string".length;

Length conta quantos caracteres h na string, incluindo os espaos!

Dica

Para verificar o comprimento de algo, digitamos "string".length;

Lembre-se que uma string pode no ser sempre uma palavra voc pode colocar
praticamente qualquer caractere entre aspas para formar uma string.
Tipo de Dados III: Booleanos

Bom trabalho! Agora vamos aprender sobre booleanos. Um booleano verdadeiro

(true) ou falso (false).

Por exemplo, comparar dois nmeros retorna um resultado true ou false:

23 > 10 true

5 < 4 false

Instrues

Vamos comparar dois nmeros para retornar um resultado verdadeiro:

1. Primeiro, escreva a string "Estou programando como um profissional"

2. A seguir, encontre o comprimento da string usando .length

3. Ento, compare o comprimento da string para ver se ela tem mais do que 10
caracteres

Se quiser verificar seu cdigo, clique em "Problemas? Leia uma dica!" abaixo

Usando console.log

Voc pode ter notado que o interpretador no exibe tudo o que ele faz. Ento, se
quisermos saber o que voc est pensando, s vezes temos que pedir a ele que fale
conosco.

console.log() tomar o que quer que esteja ente os parnteses o registrar (log) no
console abaixo do seu cdigo por isso que chamado console.log()!

Isso comumente chamado exibio.

Instrues

Exiba as duas declaraes console.log seguintes ao mesmo tempo. Digite uma na linha
1 e a outra na linha 2. Ento, clique em Salvar e Submeter Cdigo.

console.log(2 * 5)
console.log("Al")

Dica
 1. Tenha certeza de incluir aspas em strings, e no para nmeros.

2. Verifique seus parnteses cuidadosamente.

3. Tenha certeza de estar rodando duas declaraes console.log ao mesmo tempo

Na linha 1, digite a primeira declarao. Ento, na linha 2, digite a segunda declarao.

Ento clique em "Salvar e Enviar Cdigo"!

Comparaes

At agora aprendemos sobre trs tipos de dados:

strings (por ex. "cachorros fazem au au!")

nmeros (por ex. 4, 10)

booleanos (por ex. false, 5 > 4)

Agora vamos aprender mais sobre operadores de comparao.

Lista de operadores de comparao:

> Maior que

< Menor que

<= Menor ou igual a

>= Maior ou igual a

=== Igual a

!== Diferente de

Instrues

Tente usar cada um dos operadores acima.

1. Selecione o operador correto de comparao para fazer cada uma das quatro
exibirem true.

?
Dica
Quando voc usa .length, o valor retornado um nmero. Portanto, quando voc insere
algo como "Jenny".length === 5;, o computador est avaliando se o nmero de
letras em Jenny igual a 5.

Decises, decises

Bom trabalho com as comparaes! Agora vamos ver como podemos usar comparaes
para fazer perguntas com respostas "sim" ou "no".

Digamos que queremos escrever um programa que pergunte se o seu nome tem mais do
que 7 letras. Se a resposta for sim, podemos responder com "Seu nome bem longo!"
Podemos fazer isso com uma declarao if:

if( "myName".length >= 7 ) {

console.log("Seu nome bem longo!");
}

Uma declarao if composta pela palavra-chave if, uma condio como as que
vimos antes, e um par de chaves { }. Se a resposta da condio for sim, o cdigo dentro
das chaves ser executado.

Examine a declarao if no editor.

1. Na linha 1, adicione uma condio dentro dos parnteses ( ).

2. Se a resposta condio for sim, o cdigo dentro das chaves ser executado.
Ento use console.log na linha 2 para exibir uma string.

Computadores so inteligentes

timo! Usamos uma declarao if para fazer algo se a resposta condio for sim, ou
verdadeira (true) como dissemos em JavaScript.

Alm de fazer algo quando a condio true, podemos fazer outra coisa se a condio
for false. Por exemplo, se seu nome tiver menos de 7 letras, podemos responder com
"Seu nome bem curto!" Podemos fazer isso usando uma declarao if / else:

if( "myName".length >= 7 ) {

console.log("Seu nome bem longo!");
}
else {
console.log("Seu nome bem curto!");
}

Como antes, se a condio for true, ento apenas o cdigo dentro do primeiro par de
chaves ser executado. Caso contrrio, a condio false, ento apenas o cdigo
dentro do segundo par de chaves depois da palavra-chave else ser executada.
No exemplo acima a condio "myName".length >= 7 resulta em false j que
"myName" tem apenas 6 letras. Como a condio false, apenas o cdigo dentro das
chaves depois da palavra-chave else executado, e exibe Seu nome bem curto!.

Instrues

1. Na linha 1, preencha uma condio que resultar em false

2. Preencha a poro else com um trecho de cdigo (isso ser executado se a

condio for false). Use console.log para esta parte.

?
Dica

Voc pode escrever uma condio com uma desigualdade, como 10 < 5:

if (10 < 5) {
// Isso no ser executado, j que 10 > 5
}
else {
// Esta parte VAI ser executada!
}

Mais prtica com condicionais

Agora vamos praticar, usando declaraes if/else . Faa o mximo que puder por
conta prpria, mas se precisar de um lembrete, clique no boto "Problemas? Leia uma
dica!" abaixo.

Instrues

1. Escreva uma declarao if/else como fizemos no ltimo exerccio. Eis como o
cdigo se parece:

2. if (condio)
3. {
4. // se a condio for verdadeira
5. // execute este cdigo
6. }
7. else // "caso contrrio"
8. {
9. // execute este cdigo
10. }

11. Se sua condio for true, use console.log para exibir "A condio
verdadeira".
 12. Caso contrrio (else) quando ela for false, use console.log para exibir "A
condio falsa".

13. Tenha certeza de que sua condio seja false, para que seu programa exiba "A
condio falsa".

?
Dica

Seu cdigo deve se parecer com isso

if( 10 < 3 )
{
console.log("A condio verdadeira");
}
else
{
console.log("A condio era falsa");
}

Computadores no so muito inteligentes

Bom trabalho! Agora, computadores so muito literais. A sintaxe precisa ser exata para
que o computador compreenda o cdigo.

Quando voc comear a programar, vamos ensinar muitas regras de sintaxe. Isso como
a gramtica das linguagens de programao. Primeiro a gramtica, e depois a poesia da
programao!

Instrues

H muitos erros neste cdigo. Encontre e conserte todos.

Voc est fazendo o que chamado de "depurar" ou "debugar", um termo popularizado

por Grace Hopper quando ela literalmente tirou uma mariposa de seu computador.

?
Dica

Lembre-se, as declaraes if / else tem esta aparncia:

if (condition) {
code;
} else {
code;
}
Tenha certeza de que a condio est entre parnteses, e que o cdigo est entre
conlchetes!

Pausa no Meio da Lio

Avanamos muito at agora! Tantos novos termos, tanta sintaxe. Vamos fazer uma pausa
e uma reviso. Aprendemos:

1. Confirm e prompt

Podemos fazer quadros pop-up aparecerem!

confirm("Estou bem");
prompt("Voc esta bem?");

2. Tipos de dados

a. nmeros (por ex. 4.3, 134)

b. strings (por ex. "cachorros fazem au au!", "especialista em JavaScript")

c. booleanos (por ex. false, 5 > 4)

3. Condicionais

Se (if) a primeira condio for atendida, execute o primeiro cdigo de bloco. Se ela no
for atendida, execute o cdigo no bloco else. Veja o cdigo direita para outro
exemplo.

Instrues

Esperamos que essa pausa tenha sido til! Clique em 'Salvar e Enviar' para continuar.

Matemtica

Vimos matemtica bsica antes. Os smbolos da matemtica bsica que aprendemos na

escola funcionam aqui. At mesmo a ordem em que o computador entende a matemtica
igual da escola!

Cdigo:

1. ( ): controle da ordem das operaes

2. * e /: multiplicao e diviso
3. - e +: subtrao e adio

Exemplos:

1. 100/10 igual a 10
2. "Jane".length + 5 igual a 9
3. 5*(3+1) igual a 20
Instrues

1. Complete os trechos de cdigo que faltam para construir a declarao if / else.

Faa a condio ser verdadeira.

2. Finalize a declarao else exibindo a string "Erro Erro Erro" no console.

?
Dica

H muita sintaxe que deixamos de lado. A palavra-chave if e o {} depois da palavra-

chave else foram deixados de fora.

Tenha certeza de no deletar nada do cdigo fornecido. Isso pode fazer seu cdigo
falhar!

Matemtica e o resto

Vamos conhecer um smbolo interessante chamado resto. Quando % usado entre dois
nmeros, o computador divide o primeiro pelo segundo, e ento retorna o resto da
diviso.

Ento, se fizermos 23 % 10, dividimos 23 por 10, o que igual a 2 com resto 3. Ento,
23 % 10 igual a 3.

Mais exemplos:

17 % 5 igual a 2

13 % 7 igual a 6

Instrues

Use console.log e resto trs vezes para exibir o resto das seguintes equaes:

a. 14 / 3
b. 99 / 8
c. 11 / 3

?
Dica

Digite console.log trs vezes em trs linhas, preenchendo os parnteses a cada vez
com uma nova declarao. No se esquea de usar % e no / para obter o resto!
Resto e if / else

Ento, porque aprender a calcular o resto? Para comear, ele bom para testar a
divisibilidade. Considere 30 % 10. O que ele retorna? No h resto, ento 0.

E quanto a 9 % 3? Tambm 0.

Podemos usar restos em comparaes, assim:

10 % 2 === 0 true

7 % 3 === 0 false porque h um resto de 1.

Instrues

Vamos fazer a declarao if/else exibir "O primeiro nmero par".

1. Edite a linha 5 adicionando uma comparao que resulta em true.

2. Na comparao, use um resto e um nmero par, como fizemos no exemplo

acima.

?
Dica

Nmeros pares so divisveis por 2 sem resto. Por exemplo, 10 % 2 ===0 deve
funcionar!

Tenha certeza de no adicionar ponto e vrgulas em seu cdigo. No deve haver um

ponto e vrgula entre o ) e { em sua declarao if!

Substrings

Aprendemos alguns meios de manipular nmeros. E quanto a manipular strings?

s vezes voc no quer exibir toda a string, apenas uma parte dela. Por exemplo, voc
pode configurar sua caixa de entrada do Gmail para exibir os primeiros 50 caracteres, de
cada mensagem, para que possa ver do que se tratam. Esse trecho uma substring da
string original (a mensagem inteira).

Cdigo:

"uma palavra".substring(x, y) em que x onde voc comea a cortar e y onde

voc termina de cortar a string original.
A parte dos nmeros um pouco estranha. Para selecionar o "he" em "hello", voc
escreve:

"hello". substring(0, 2);

Cada caractere uma string e indexada a partir do 0, assim:

0 1 2 3 4
| | | | |
h e l l o

A letra h est na posio 0, a letra e est na posio 1, e assim por diante.

Portanto, se voc comear na posio 0, e cortar na posio 2, tem s he

Mais exemplos:

1. As 3 primeiras letras de "Batman"

"Batman".substring(0,3);

2. Da 4a at a 6a letra de "laptop"
"laptop".substring(3,6);

Instrues

Encontre a 4a at 7a letras da string "wonderful day".

?
Dica

Lembre-se de comear a contar a partir do 0. Em outras palavras, a 1a letra comea na

posio 0, a 2a comea na posio 1, e assim por diante.

No necessrio usar console.log, j que no pedimos para que voc exiba-as!

Mais prtica com substrings

Conseguir o posicionamento das letras na substring complicado! Vamos garantir que

entendemos tudo.

Lembre-se que cada caractere em uma string numerada a partir do 0. Ento, para a
palavra "hello", a letra h est na posio 0, a letra e est na posio 1 e assim por diante.

Instrues

Usando console.log, em trs linhas separadas, exiba as substrings das seguintes

strings.
a. "Jan" em "Janeiro"
b. "Melbourne e" em "Melbourne e otima" (note o espao!)
c. "burgers" em "Hamburgers"

?
Dica

assim que se exibe as duas primeira letras da palavra "hello":

console.log( "hello".substring(0, 2) );

Variveis

J aprendemos como fazer algumas algumas coisas: compor strings, encontrar o

comprimento de strings, encontrar o caractere na n-sima posio, fazer contas bsicas.
Nada mal para um dia de trabalho!

Para criar programas mais complexos, precisamos de um modo de salvar os valores do

seu cdigo. Fazemos isso definindo uma varivel com um nome especfico e sensvel
caixa alta/baixa. Depois que voc cria (ou declara) uma varivel como tendo um nome
em particular, pode chamar esse valor digitando o nome da varivel.

Cdigo:

var varName = data;

Exemplo:

a. var myName = "Leng";

b. var myAge = 30;
c. var isOdd = true;

Instrues

Crie uma varivel chamada myAge e digite sua idade.

?
Dica

Lembre-se de no usar aspas, ou sua idade ser uma string. Para declarar uma varivel,
voc precisa apenas digitar:

var variableName = /* some value */

Mais Prtica com Variveis

Vimos como criar uma varivel. Mas como as usamos? interessante pensar que
sempre que voc digita o nome da varivel, est pedindo ao computador para trocar o
nome da varivel pelo valor da varivel.

Por exemplo:

var myName = "Steve Jobs";

myName.substring(0,5)

Examine a segunda linha acima. Voc pediu ao computador para trocar myName por
Steve Jobs, ento

myName.substring(0,5)

se torna

"Steve Jobs".substring(0,5)

que resulta em Steve.

Outro exemplo

var myAge = 120;

O que

myAge % 12 ? Leia a dica para verificar sua resposta.

Ento, a varivel armazena o valor da varivel, seja este um nmero ou uma string.
Como voc ver logo, isso torna escrever programas muito mais fcil!

Instrues

Siga as instrues nos comentrios do cdigo para continuar.

?
Dica

Note que "Nova York" e "new york" so vistas pelo computador como strings
diferentes. (ou seja, "Nova York" no igual a "nova york")

E a resposta que myAge % 12 igual a 0.

// Declare uma varivel na linha 3 chamada

// myCountry e atribua a ela uma string.

var myCountry = "myCountry"

// Use console.log para exibir o comprimento da varivel myCountry.

console.log("myCountry".length );

// Use console.log para exibir as tres primeiras letras de myCountry.

console.log("myCountry".substring(0,3));

Mude os valores das variveis

At agora, vimos
a. como criar uma varivel
b. como usar uma varivel

Agora vamos ver como mudar o valor de uma varivel. O valor de uma varivel
mudado facilmente. Faa de conta que voc est criando uma nova varivel enquanto
usa o mesmo nome da varivel j existente!

Exemplo:

var myAge = "Trinta";

digamso que eu fiz aniversrio e quero mudar minha idade na varivel.
myAge = "Trinta e um";

Agora o valor de myAge "Trinta e um"!

Instrues

Siga as instrues na linha 1, linha 3, linha 5 e linha 8. Estamos usando esse mtodo
para mostrar a voc a ordem na qual voc diz ao computador o que fazer muito
importante.

?
Dica

Para exibir a varivel myName, coloque myName entre os parnteses depois de

console.log.
// Na linha 2, declare uma variavel myName e atribua a ela seu nome.

var myName = "Wilian Walney"

// Na linha 4, use console.log para exibir a variavel myName.

console.log (myName);

// Na linha 7, mude o valor de myName para ser apenas as primeiras 2

letras do seu nome.

Myname = "";

// Na linha 9, use console.log para exibir a varivel myName.

console.log (myName.substring(0,2));

Concluso: Parte 1

Vamos fazer uma reviso rpida!

Tipos de dados

strings (por ex. "cachorros fazem au au!")

nmeros (por ex. 4, 10)

booleanos (por ex. false, 5 > 4)

Variveis
Armazenamos valores de dados em variveis. Podemos trazer de volta os valores dessas
variveis digitando o nome da varivel.

Manipulando nmeros e strings

comparaes (por ex. >, <=)

resto (%)

comprimento da string(por ex. "Emily".length;)

substrings (por ex. "oi".substring(0, 1);)

console.log( )
Exibe no console o que quer que colocamos entre os parmetros.

Instrues
 1. Na linha 1, crie uma varivel myColor e atribua a ela uma string.

2. Na linha 2, exiba o comprimento de myColor no console.

var myColor = "branco";

console.log(myColor.length );

// Na linha 2, escreva seu primeiro comentrio! Pode ser qualquer coisa!

// bora programas

Concluso: Parte 2

Parabns por chegar at aqui. Voc aprendeu muito! S mais um exerccio antes de um
grande tapinha nas costas!

A ltima coisa complicada aprendemos foram as declaraes if / else.

Declaraes if / else so declaraes condicionais. Sob condies diferentes, o
computador exibir coisas diferentes.

Instrues

1. Escreva sua prpria declarao if / else.

2. A nica instruo que o resultado de avaliar a declarao a exibio no

console de "Terminei minha primeira aula!".

?
Dica

H trs etapas em uma declarao if / else.

1. Decidir que condio voc quer
2. Se a condio for verdadeira, decida que cdigo voc quer executar.
3. Se for falsa, decida o outro cdigo que voc quer executar!

if(condio escolhida){
// cdigo que imprime "terminei minha primeira aula!"
else{
// cdigo;
}
Escolha Sua Prpria Aventura!

Confirme!

Voc j tem alguma habilidade com programao. hora de fazer algo que voc pode
mostrar para as pessoas! Vamos mostrar como programar um jogo do tipo "escolha sua
prpria aventura". Ele ter uma histria simples, o usurio dever tomar algumas
decises, e o final deve ser feliz. Depois, voc pode modific-lo como quiser e exibir
seus talentos criativos!

Uma observao antes de comearmos. Cada um dos exerccios a seguir pedir que
voc crie sobre seus cdigos anteriores. Lembre-se de no apagar ou modificar nada que
tenha feito nos exerccios anteriores. Boa sorte!

Instrues

1. sempre de bom-tom perguntar se o usurio est pronto para comear.

2. Usando o comando confirm, confirme se seu usurio est pronto para jogar. Por
exemplo, eu usaria a frase "Estou pronto para jogar!". Adicione qualquer frase
que queira em confirm.

?
Dica

Para que o usurio confirme alguma coisa, a sintaxe ser:

confirm("Entendi, confirmado!");
// Verifique se o usuario esta pronto para jogar!

confirm("esta pronto");

var age

age = prompt("Qual e sua idade?");

if(age < 13)

console.log ("pode jogar nao pive");

else

console.log ("bora jogar mane");

Acrescentando um pouco de histria

Vamos criar o cenrio para sua histria. Sob todo o cdigo anterior, exiba a introduo,
exatamente como est escrita.

"Voc est em um show do Justin Bieber, e ouve a letra 'Lace my shoes

off, start racing'."

Instrues

Exiba a introduo usando console.log. Lembre-se de que a introduo uma string,

ento tenha certeza de mant-la entre aspas.

?
Dica

Quando eu estava jogando, cometi alguns erros!

1. No se esquea de usar console.log para exibir coisas.

2. A introduo uma string, ento no se esquea de coloc-la entre aspas.

3. Copie e cole a string exatamente como est escrita nas instrues.

// Verifique se o usuario esta pronto para jogar!

confirm("esta pronto");

var age

age = prompt("Qual e sua idade?");

if(age < 13)

console.log ("pode jogar nao pive");

else

console.log ("bora jogar mane");

console.log ("Voc est em um show do Justin Bieber, e ouve a letra 'Lace

my shoes off, start racing'.")

// Verifique se o usuario esta pronto para jogar!

confirm("esta pronto");

var age

age = prompt("Qual e sua idade?");

if(age < 13)

console.log ("pode jogar nao pive");

else

console.log ("bora jogar mane");

}
console.log ("Voc est em um show do Justin Bieber, e ouve a letra 'Lace
my shoes off, start racing'.")

console.log("De repente, Bieber para e pergunta 'Quem quer correr

comigo?'");

var userAnswer

userAnswer = prompt ("Voce quer correr com Bieber no palco?");

A histria esquenta!
Agora voc deve criar cenrios diferentes. Que bom que sabemos como fazer isso
usando declaraes if / else.

Se userAnswer for "sim", exiba: "Voc e Bieber comeam a correr. Esto

cabea a cabea! Voc vence por um nariz!"

Caso contrrio, exiba: "Oh no! Bieber balana a cabea e canta 'I set a
pace, so I can race without pacing.'"

Lembre-se: = para atribuio, e === para verificar se as coisas so iguais!

Instrues

Use uma declarao if / else para escrever a ltima parte do seu jogo!

Tenha certeza de verificar o console em busca de mensagens de erro e sugestes sobre

como consert-los.

Dica

Corte e cole as sentenas que voc deve exibir para evitar erros de digitao. Se voc
no digitar as coisas exatamente, nada funcionar! Lembre-se de responder com sim, ou
no, em minsculas.

Lembre-se, if/else funciona assim:

if (condition) {
// Faa alguma coisa
} else { // Caso contrrio...
// Faa outra coisa!
}
confirm("Estou pronto para jogar!");
var age = prompt("Qual e sua idade");
if(age < 13){
console.log("Pode jogar mas eu no me resposabilizo!");
} else {
console.log("Jogue ento");
}
console.log("Voc est em um show do Justin Bieber, e ouve a letra 'Lace my shoes off,
start racing'.");
console.log("De repente, Bieber para e pergunta 'Quem quer correr comigo?'");
var userAnswer = prompt("Voce quer correr com Bieber no palco?");

if(userAnswer === "sim"){

console.log("Voc e Bieber comeam a correr. Esta cabea a cabea! Voce vence por um
nariz!");
} else {
console.log("Oh no! Bieber balana a cabea e canta 'I set a pace, so I can race without
pacing.'");
}

Pedindo feedback
Vale a pena pedir feedback do usurio!

Instrues
1. Crie uma varivel chamada feedback e use prompt para pedir ao usurio para
dar uma nota para seu jogo.

2. Se feedback for maior do que 8, exiba: "Obrigado! Vamos correr de novo

no prximo concerto!"

3. Caso contrrio, exiba:

"Vou continuar a praticar corrida e programao."

Dica

Lembre-se , o prompt deve se parecer com isso:

var feedback = prompt("Mensagem");

confirm("Estou pronto para jogar!");

var age = prompt("Qual e sua idade");

if(age < 13){

console.log("Pode jogar mas eu no me resposabilizo!");

} else {

console.log("Jogue ento");

console.log("Voc est em um show do Justin Bieber, e ouve a letra 'Lace

my shoes off, start racing'.");

console.log("De repente, Bieber para e pergunta 'Quem quer correr

comigo?'");

var userAnswer = prompt("Voce quer correr com Bieber no palco?");

if(userAnswer === "sim"){

console.log("Voc e Bieber comeam a correr. Esta cabea a cabea! Voce

vence por um nariz!");

} else {

console.log("Oh no! Bieber balana a cabea e canta 'I set a pace, so I

can race without pacing.'");

var feedback

feedback = prompt ("Favor dar uma nota ao jogo.");

if(feedback >= 8)

console.log ("Obrigado! Vamos correr de novo no prximo concerto!");

else

console.log ("Vou continuar a praticar corrida e programao.");

}

Introduo a Funes em JS

ntroduo

Programar simplesmente um modo de fornecer instrues para o computador.

Em Comeando aprendemos sobre as declaraes if / else.

Queremos continuar aprendendo modos de instruir o computador como realizar tarefas

repetitivas com eficincia.

Instrues
Vamos fazer uma rpida reviso! Use if / else para verificar a velocidade com que est
dirigindo.

1. Se speed for maior que 80, use console.log para exibir "Reduza a
velocidade"

2. Caso contrrio (else), use console.log para exibir "Dirija com

seguranca"

Dica

Neste caso, "Dirija com segurana" deve ser registrado, j que 65 menor do que 80.

Lembre-se, if/else funciona assim:

if (condio) {
// Faa uma coisa
} else { // Caso contrrio...
// Faa outra coisa!
}
Introduzindo Funes
Programar parecido com assar bolos. srio! Imagine que voc est tentando ensinar
sua amiga Jane como assar diferentes tipos de bolos.

Cada bolo leva ingredientes diferentes (ou seja, entradas), mas as instrues para
assar so sempre as mesmas. Por exemplo:

1. Pr-aquea o forno a 300 graus

2. Misture todos os ingredientes em uma tigela

3. Coloque a massa no forno por 30 min.

E a sada ser um bolo diferente a cada vez.

tedioso ter que repetir para Jane as mesmas instrues assar a cada vez. E se
pudssemos dizer apenas assar e Jane soubesse exatamente como realizar essas trs
etapas?
exatamente isso que uma funo faz!

Instrues

1. A linha 3 declara a funo e d um nome a ela.

2. Concentre-se nas linhas 4 e 5. O cdigo dentro das chaves { } o

cdigo que queremos usar vrias vezes. (ou seja, as instrues
`assar')

3. A linha 4 declara uma varivel chamada val. A linha 5 exibe o valor

dessa varivel.

4. Nas linhas 8-11, explicamos o que significa chamar uma funo.

5. Na linha 12, substitua o 6 com qualquer nmero e clique em Salvar e

Enviar Cdigo. Faa isso algumas vezes para ver a beleza das
funes!

Dica

Tudo o que voc precisa fazer substituir o 6 na linha 12 por qualquer nmero que voc
quiser.

// Uma funcao tem esta aparencia:

var divideByThree = function (number) {

var val = number / 3;

console.log(val);

};

// Na linha 12, chamamos a funcao pelo nome

// Aqui, ela e chamada de 'dividebythree'

// Dizemos ao computador qual e o numero de entrada (ou seja, 6)

// O computador entao executa o codigo dentro da funcao!

divideByThree(85);

Sintaxe das Funes

Uma funo toma suas entradas, faz algo com elas, e produz uma sada.

Eis um exemplo de uma funo:

var sayHello = function(name) {

console.log('Al ' + name);
};

1. Primeiro declaramos uma funo usando var, e ento damos a ela o

nome sayHello. Existe uma conveno em que o nome de uma
varivel deve comear com uma letra minscula e cada palavra
(exceto a primeira) comea com uma letra maiscula, no caso
tempos "lowerCamelCase",

2. Ento, usamos a palavra-chave function para dizer ao computador

que voc est criando uma funo

3. O cdigo entre parnteses chamado um parmetro. Este uma

varivel temporria, vlida somente dentro da funo, na qual
atribuiremos um valor especfico quando chamarmos a funo.

Mais dvidas, clique em "Problemas? Leia uma Dica!" para mais detalhes.

1. Ento, escreva seu bloco de cdigo reutilizvel entre { }. Cada linha

de cdigo neste bloco deve terminar com ;.

Voc pode executar este cdigo "chamando" a funo, assim:

sayHello("Emily");
Chamar esta funo exibir Al Emily.

Instrues

1. Na linha 11, chamamos a funo greeting e inserimos um nome que

queremos que a funo greeting inclua.

2. Clique "Salve e Enviar Cdigo" e veja a funo entrar em aao! Isso

poupa muito tempo.

Dica

Quando queremos unir duas strings, usamos um sinal de mais.

console.log("Al" + "voce"); exibir Alvoc. No isso que queremos!

Se voc quiser um espao entre as palavras, deve adicionar esse espao tambm!

console.log("Al" + " " + "voc"); exibir Al voc

// Mostramos abaixo a funo greeting!

// Veja a linha 7

// Podemos unir strings usando o sinal de mais (+)

// Leia a dica para mais detalhes sobre como isso funciona.

var greeting = function (name) {

console.log("Que bom ver voc," + " " + name);

};

// Na linha 11, chame a funo greeting!

greeting("walney");

Como funciona uma funo?

Vamos detalhar exatamente como um computador pensa quando v o cdigo de uma
funo.
var functionName = function( ) {
// codigo codigo codigo
// codigo codigo codigo
// (mais linhas de codigo)
};

1. A palavra-chave var declara uma varivel chamada functionName.

2. A palavra-chave function diz ao computador que functionName uma

funo e no alguma outra coisa.

3. Parmetros vo entre parnteses. O computador vai procurar por eles

no bloco de cdigo.

4. O bloco de cdigo o cdigo reutilizvel que est entre as chaves {

}. Cada linha de cdigo entre { } deve terminar com um ponto e
vrgula.

5. Toda a funo termina com um ponto e vrgula.

Para usar a funo, ns a chamamos, simplesmente digitando o nome da funo, e

colocando um valor de parmetro nos parnteses depois dela. O computador executar o
cdigo reutilizvel com o valor especfico do parmetro substitudo no cdigo.

Instrues
Vamos criar uma funo que diga ao mundo o que voc quer comer.

1. Declare sua funo e chame-a foodDemand.

2. Voc pode dar ao parmetro qualquer nome que quiser. Mas vamos
cham-lo food, porque isso que vai mudar sempre que chamarmos
a funo console.log("Quero comer" + " " + food);

3. Chame a funo e insira uma comida especfica que voc queira!

Dica

O parmetro basicamente o que torna uma funo til. Por que? Voc quer usar seu
cdigo vrias vezes. Mas quer usar esse cdigo com entradas diferentes!
Alguns exemplos abaixo:

1. Temos a funo bake. Queremos colocar nela ingredientes diferentes.

2. Temos a funo calculate*. Ento, a chamamos usando diferentes

nmeros.
 3. Temos a funo greeting. Ento, a chamamos usando nomes
diferentes.

4. Agora temos a funo foodDemand. Voc ir cham-la colocando

nela qualquer nome de comida que quiser.

// Escreva sua funcao foodDemand abaixo

// ltima dica: no seu bloco reutilizvel de cdigo, finalize cada linha com
um

// ponto e virgula (;)

var foodDemand = function (food) {

console.log("Quero comer" + " " + food);

foodDemand("comida japonesa");

Juntando tudo

Por que o cdigo est organizado como est nas linhas 2-5?

O computador pode entender o cdigo sem os espaos. Mas essa prtica torna a edio
muito mais fcil e uma das melhores prticas.

Eu devo colocar um ponto e vrgula no fim de cada linha de cdigo depois de cada
linha de cdigo no bloco reutilizvel? E no final da funo toda?

Sim. Adicione um ponto e vrgula no final de cada linha de cdigo (dentro do { }) e

depois da funo toda (depois do { }). O ponto e vrgula age como um ponto em uma
frase. Ele ajuda o computador a saber onde esto os pontos de parada do cdigo.

Instrues

Uma parte importante da programao a depurao. Isso significa encontrar que

diabos deu errado com seu cdigo. Por que ele no funcionou?

1. Examine a linha 9.Ela contm muitos erros de sintaxe. V como a falta de

espaamento torna a depurao mais difcil?

2. Conserte a funo na linha 9. Tenha certeza de que a sintaxe est correta. Tenha
certeza de que ela tem boa aparncia.
 3. Chame a funo greeting depois que ela estiver consertada! No esquea de
passar para ela um nome especfico.

// Funcao bem escrita:

var calculate = function (number) {

var val = number * 10;

console.log(val);

};

// Funcao mal escrita com erros de sintaxe!

var greeting = function (sexo){

console.log("sexo adoro muito");

};

greeting("sexo");

No Se Repita (N.S.R.)
O princpio N.S.R. realmente muito importante em programao. Nada de repetio!

Sempre que voc se encontrar digitar a mesma coisa mas modificando apenas uma
pequena parte, provavelmente pode usar uma funo.

A pequena parte que voc modifica ser o parmetro. E a parte que voc fica
repetindo ser o cdigo no bloco reutilizvel - o cdigo dentro de { }.

Instrues
Voc uma criatura de hbitos. Toda semana voc compra 5 laranjas. Mas os preos das
laranjas mudam o tempo todo!

1. Voc quer declarar uma funo que calcule o custo de comprar 5

laranjas.

2. Ento, voc quer calcular o custo das 5 juntas.

3. Escreva uma funo que faa isso, chamada orangeCost().

 4. Ela deve tomar um parmetro, o preo de uma laranja, e multiplic-lo
por 5.

5. Ela deve enviar o resultado da multiplicao para o console.

6. Chame a funo, com as laranjas custando 5 reais cada.

Dica

Qual o trecho da entrada que muda a cada vez? Este seria o preo. Ento d ao seu
parmetro o nome price. E quando chamar sua funo, coloque um nmero para o
preo (price) para ver quanto custam 5 laranjas!

var orangeCost = function(preo){

console.log(preo * 5);
};

orangeCost(5);

Palavra-chave return
Bom trabalho! Agora, quando chamamos uma funo, nem sempre queremos apenas
exibir coisas. s vezes, queremos apenas que ela retorne um valor. Podemos ento
usar esse valor (ou seja, a sada da funo) em outro cdigo. Vamos aprender sobre a
palavra-chave return, ento veremos como usar funes com uma declarao if / else no
prximo exerccio!

A palavra-chave return simplesmente devolve ao programador o valor que sai da

funo. Ento, a funo executada, e quando a palavra-chave return usada, a funo
imediatamente parar de rodar e retornar o valor.

Instrues
Em nosso exemplo, temos uma funo chamada timesTwo() que toma um nmero e
retorna esse nmero multiplicado por dois.

1. Na linha 7, depois do sinal de igual, chame a funo timesTwo com

qualquer parmetro que quiser

2. A linha 8 exibe newNumber. Note como o valor que retornamos (return)

de timesTwo() atribudo automaticamente a newNumber.
?

Dica

Para chamar a funo, simplesmente usamos o nome da funo. Ento entramos um

valor para o parmetro numrico. por exemplo, timesTwo(8);

// Parametro e um numero, e faremos contas com aquele parametro

var timesTwo = function(number) {

return number * 2;

};

// Chame timesTwo aqui!

var newNumber = timesTwo(20);

console.log(newNumber);

timesTwo(10)

Funes, return e if / else

Quando chamamos uma funo, seu valor return apenas o resultado de executar a
funo. Esse valor pode ser usado como qualquer outro valor no JavaScript!

Examine a declarao if que comea na linha 7. A declarao if est verificando se o

resultado da chamada da funo chamada quarter divisvel por 3.

Instrues

1. Defina uma funo chamada quarter que tem uma parmetro chamado number.

2. Esta funo retorna um valor igual a um quarto do parmetro (ou seja, number /
4;)

3. Chame a funo dentro da condio da declarao if (e use um valor de

parmetro!) de modo que "A declarao verdadeira" seja exibido no console.

?
Dica

Isso um pouco complicado, ento vamos devagar. O cdigo entre { } na funo deve
ser

return number/4

Na linha 7, a condio da declarao if chama a funo! Ela precisa que voc insira o
valor numrico.

Lembre-se que % o resto. Ele d a voc o resto quando um nmero dividido por
outro.
por ex. 13 % 3 1.

Queremos quarter(algum nmero) que quando dividido por 3 tenha resto 0.

// Defina quarter aqui.

quarter = function(number){
return number/4
}

if (quarter(0) % 3 === 0 ) {
console.log("A declarao verdadeira");
} else {
console.log("A declarao falsa");
}

Funes com dois parmetros

At agora, vimos apenas funes com um nico parmetro. Mas muitas vezes
interessante escrever funes com mais de um parmetro. Por exmeplo, podemos ter a
seguinte funo:

var areaBox = function(length, width) {

return length * width;
};
Com mais de um parmetro,podemos criar funes mais teis

Para chamar uma funo com mais de um parmetro, simplesmente insira o valor de
cada parmetro nos parnteses. Por exemplo, areaBox(3,9); retorna a rea de uma
caixa com comprimento de 3 e largura de 9.
Instrues

1. Escreva uma funo chamada perimeterBox que retorna o permetro

do retngulo.

2. Ela deve ter dois parmetros.

3. Uma frmula para o permetro comprimento + comprimento +

largura + largura;

4. Chame a funo e passe para ela qualquer valor para o comprimento

e largura que quiser.

Dica

Lembre-se que nas funes, os parmetros vo entre parnteses, ( ). E o bloco de

cdigo reutilizvel vai entre chaves { }.