0% acharam este documento útil (0 voto)
7 visualizações5 páginas

Intro Js Profvitorio

O documento é uma introdução ao JavaScript, explicando sua função como uma linguagem de programação para criar interatividade em páginas web. Ele aborda métodos de entrada e saída de dados, como alert(), prompt() e console.log(), e inclui uma lista de exercícios práticos para aplicar esses conceitos. Os exercícios variam de saudações simples a simulações de login e cálculos de DPI.

Enviado por

hiago.teotonio
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
0% acharam este documento útil (0 voto)
7 visualizações5 páginas

Intro Js Profvitorio

O documento é uma introdução ao JavaScript, explicando sua função como uma linguagem de programação para criar interatividade em páginas web. Ele aborda métodos de entrada e saída de dados, como alert(), prompt() e console.log(), e inclui uma lista de exercícios práticos para aplicar esses conceitos. Os exercícios variam de saudações simples a simulações de login e cálculos de DPI.

Enviado por

hiago.teotonio
Direitos autorais
© © All Rights Reserved
Levamos muito a sério os direitos de conteúdo. Se você suspeita que este conteúdo é seu, reivindique-o aqui.
Formatos disponíveis
Baixe no formato PDF, TXT ou leia on-line no Scribd
Você está na página 1/ 5

Introdução ao Javascript

Data @11/03/2025

Professor a adevair vitorio

O que é JavaScript?
JavaScript (ou simplesmente JS) é uma linguagem de programação usada para
tornar as páginas da web dinâmicas. Enquanto HTML define a estrutura da
página e CSS cuida do estilo, o JavaScript permite adicionar interatividade,
como botões que respondem a cliques, formulários que validam informações e
animações visuais.

Entrada e Saída de Dados no JavaScript


Em JavaScript, podemos interagir com o usuário através de caixas de diálogo,
como alert , prompt e console.log . Esses métodos são muito úteis para exibir
informações e coletar dados do usuário.

🔹 alert() : Exibindo uma Mensagem


O alert() exibe uma caixa de diálogo com um texto e um botão "OK". Ele é usado
para mostrar informações ao usuário.

alert("Bem-vindo ao JavaScript!");

Quando esse código é executado, uma janela pop-up aparece com a


mensagem.

🔹 prompt() : Solicitando Informações


O prompt() permite que o usuário insira um valor. Esse valor pode ser
armazenado em uma variável para ser usado no código.

Introdução ao Javascript 1
let nome = prompt("Qual é o seu nome?");
alert("Olá, " + nome + "! Seja bem-vindo.");

1. O JavaScript exibe um campo de entrada pedindo o nome do usuário.

2. O nome digitado é armazenado na variável nome .

3. Em seguida, o alert() mostra uma mensagem personalizada.

🔹 console.log() : Exibindo no Console


O console.log() exibe informações no console do navegador, sem interromper o
fluxo do programa.

console.log("Essa mensagem será exibida no console.");

O console pode ser acessado pressionando F12 no navegador e indo até a aba
"Console".

📝JavaScript
Lista de Exercícios – Entrada e Saída de Dados em

Exercícios:
1️⃣ Saudação Simples
Peça ao usuário seu nome usando prompt().

Exiba uma mensagem de boas-vindas usando alert().

Exemplo de saída: "Olá, João! Bem-vindo ao nosso site!"

2️⃣ Calculadora de Soma


Peça dois números ao usuário.

Some esses números e mostre o resultado com alert().

Introdução ao Javascript 2
3️⃣ Verificador de Idade
Peça a idade do usuário.

Use console.log() para exibir se ele é maior de idade (18 anos ou mais).

4️⃣ Multiplicação de Números


Peça dois números ao usuário.

Multiplique os valores e exiba o resultado no console.log().

5️⃣ Boas-Vindas Personalizadas


Peça ao usuário seu nome e cidade.

Exiba uma mensagem no formato:

"Olá, Maria! Que bom saber que você é de São Paulo!"

6️⃣ Calculadora de Média


Peça ao usuário três notas.

Calcule a média das notas e exiba o resultado usando alert().

7️⃣ Dobro de um Número


Peça um número ao usuário.

Mostre o dobro desse número usando alert().

8️⃣ Tabuada de um Número


Peça um número ao usuário.

Exiba a tabuada desse número (de 1 a 10) no console.

9️⃣ Pergunta de Sim ou Não


Pergunte ao usuário se ele gosta de programação (prompt()).

Exiba uma resposta diferente para "sim" e "não" com alert().

🔟 Cálculo de Idade no Futuro


Peça o ano de nascimento do usuário.

Calcule e mostre quantos anos ele terá em 2050.

Exercícios Especiais:

Introdução ao Javascript 3
1️⃣ Simulador de Notificação Push
Peça ao usuário para inserir uma mensagem de notificação usando
prompt().

Exiba essa mensagem em um alert(), simulando uma notificação.

Exemplo: " 📢 Nova mensagem: Não se esqueça da reunião às 15h!"


2️⃣ Simulação de Login
Peça um nome de usuário e uma senha (não precisa validar a senha de
verdade).

Exiba uma mensagem de boas-vindas se o login for bem-sucedido.

Exemplo: "Bem-vindo, João!"

3️⃣ Calculadora de DPI para Telas


Peça ao usuário a largura e a altura de um dispositivo móvel em pixels.

Calcule a resolução total multiplicando os valores e exiba no console.

Exemplo: Se o usuário digitar 1080 e 1920, o console deve mostrar:

"A resolução da tela é: 2.073.600 pixels"

4️⃣ Simulação de Vibração (Apenas em Dispositivos Móveis)


Peça ao usuário um tempo de vibração em milissegundos.

Use navigator.vibrate() para fazer o dispositivo vibrar (em navegadores que


suportam).

Exemplo de código:

let tempo = prompt("Digite o tempo de vibração em milissegundos:");


navigator.vibrate(parseInt(tempo));
alert("Seu dispositivo vibrou por " + tempo + "ms!");

5️⃣ Modo Escuro e Claro


Peça ao usuário para escolher entre "claro" e "escuro" (usando prompt()).

Se escolher "escuro", altere o document.body.style.backgroundColor para


black e a cor do texto para white.

Introdução ao Javascript 4
Se escolher "claro", altere as cores para white e black.

Exemplo:

let tema = prompt("Escolha um tema: claro ou escuro?");


if (tema.toLowerCase() === "escuro") {
document.body.style.backgroundColor = "black";
document.body.style.color = "white";
} else {
document.body.style.backgroundColor = "white";
document.body.style.color = "black";
}

Introdução ao Javascript 5

Você também pode gostar