JavaScript
Prof. Alan Ferreira dos Santos
Agoritmos com
Introdução ao JavaScript
O JavaScript
- Linguagem Client Side/Server Side
- Interpretada pelo navegador do usuário e servidores
- Interage com elementos HTML
- Interage com CSS
- Interage com elementos Bancos de Dados, HTTP, entre outros
- Torna os sites dinâmicos
- Tem recursos como toda linguagem
- Compacto e flexível
O JavaScript
Interfaces de apps no navegador
Funcionalidades de apps de terceiros
Bibliotecas de terceiros e Frameworks de Desenvolvimento
Javascript não é Java
runjs.co
Sintaxe
Sintaxe
// Pega emprestado a maior parte de sua sintaxe do Java, mas também é influenciado por Awk, Perl e Python.
// É case-sensitive e usa o conjunto de caracteres Unicode;
var Variável = 'Variável';
// Por isso as variáveis abaixo são diferentes Variável é diferente de variável;
//Instruções são separadas por um ponto e vírgula (;)
var car = 'Fusca';
console.log(car);
Comentários
// Comentário de única linha
/*
Comentários de
múltiplas linhas
*/
Declarações de Variáveis
// Declara uma variável, podendo ou não inicializá-la
var variavelComum = 'valor';
// Declara uma variável de escopo de bloco, podendo ou não inicializá-la
let variavelDeBloco = 'valor';
// Declara uma constante de escopo de bloco, apenas para leitura
const constanteDeBloco = 'valor';
// Possibilidades de declaração
let _exemploNomeVariavel;
let $exemploNomeVariavel;
let ExemploNomeVariavel;
let exemploNomeVariavel123;
Classificação de Variáveis
var a;
// valor undefined pois não foi definido
console.log(a);
// exceção de erro de referência pois a variável não existe
console.log(b);
// valor NaN pois a variável a não é um número
console.log(a + 2);
// valor 0 pois a variável b é nula
var b = null;
console.log(b * 2);
Estrutura de Dados e Tipos
// Boolean
let ativo = true || false;
// Null
let nome = null;
// Undefined
let sobrenome;
// Number
let idade = 18 || 18.123;
// String
let cidade = "Campo Mourão";
abre.ai/algoritmosjs
Exercícios 1 e 2
Conversão de Dados
// Converte uma string em inteiro
parseInt("1");
// Converte uma string em float
parseFloat("1.2");
// Conversões dinâmicas:
// Converte um número em texto por atribuição
var resposta = 42;
resposta = "Texto da resposta";
// Converte um número em texto por concatenação (+)
var resposta = "A resposta é " + 42;
var a = 1;
// Atribuição de adição
a += 1;
// Atribuição de subtração
a -= 1;
// Atribuição de multiplicação
a *= 1;
// Atribuição de divisão
a /= 1;
var a = 1;
// Igual
a == 1;
// Não igual
a != 1;
// Estritamente igual
a === 1;
// Estritamente diferente
a !=== 1;
// Maior
a > 1;
// Maior que ou igual
a >= 1;
var a = 1;
// Adição
a + 1;
// Subtração
a - 1;
// Multiplicação
a * 1;
// Divisão
a / 1;
// Módulo
a = 5 % 2;
// Incremento
a++;
// Decremento
a--;
var a;
// E lógico
a = true && true;
// Ou lógico
a = true || false;
// Negação lógica
a = !true;
var a = "Meu" + " " + "Texto";
abre.ai/algoritmosjs
Exercícios 3 e 4
var idade = 18
var status = idade >= 18 ? "adulto" : "menor de idade";
// retorna "number"
var idade = 18;
typeof idade
// remove um elemento do array
var decadas = [70, 80, 90];
delete decadas[0];
// remove uma propriedade do objeto
var carro = {
modelo: "Cruze",
marca: "Chevrolet",
ano: 2012
}
delete carro.ano;
Funções
// Função é um fragmento de código que pode ser invocado por outro código, por si mesmo ou uma variável que se refere à função
function logarTexto(texto) {
console.log(texto);
}
logarTexto();
Condicionais
Condicionais
- Permitem a tomadas de decisão na linguagem de programação
if...else
if (condicao) {
//codigo para executar caso a condição seja verdadeira
}
if (condicao) {
//codigo para executar caso a condição seja verdadeira
} else {
//senão, executar este código
}
else if
if (condicao) {
//codigo para executar caso a condição seja verdadeira
} else if (outraCondicao) {
//codigo para executar caso a outra condição seja verdadeira
}
if (condicao) {
//codigo para executar caso a condição seja verdadeira
} else if (outraCondicao) {
//codigo para executar caso a outra condição seja verdadeira
} else {
//senão, executar este código
}
Regra sobre true/false
// Variáveis com os valores abaixo sempre serão falsas
false
undefined
null
0
NaN
// Qualquer outro valor será verdadeiro
true
"texto"
1
[]
{}
switch
- Ótima para pequenos trechos de código;
- Código limpo;
switch
let numero1 = 1;
let numero2 = 1;
let operacao;
let resultado;
switch (operacao) {
case 'adicao':
resultado = numero1 + numero2;
break;
case 'subtracao':
resultado = numero1 - numero2;
break;
case 'divisao':
resultado = numero1 / numero2;
break;
case 'multiplicacao':
resultado = numero1 * numero2;
break;
default:
// Opcional
resultado = '';
break;
}
Laços de Repetição
for
var repeticoes = 5;
for (var i = 1; i <= repeticoes; i++) {
console.log("Repetindo pela " + i + "º vez");
}
while
var repeticoes = 5;
var i = 0;
while (i <= repeticoes) {
i++;
console.log("Repetindo pela " + i + "º vez");
}
break
var repeticoes = 5;
var i = 0;
while (i <= repeticoes) {
i++;
console.log("Repetindo pela " + i + "º vez");
if (i == 4) {
break;
}
}
continue
var repeticoes = 5;
var i = 0;
while (i <= repeticoes) {
i++;
if (i == 1) {
continue;
}
console.log("Repetindo pela " + i + "º vez");
}
Arrays e Objetos
Estrutura de Dados e Tipos
// Array
let numeros = [1, 2];
let animais = ["Cachorro", "Gato", "Potó"];
let pessoas = []
pessoas.push({ nome: 'Fulado', idade: 33 });
numeros.push(3);
Estrutura de Dados e Tipos
// Object
let pessoa = {
nome: "Fulano",
sobrenome: "de Tal",
idade: 18,
cidade: "Campo Mourão"
}
pessoa['peso'] = 80.5;
Iterações
for...in
var carros = [
{
modelo: "Cruze",
ano: 2012
},
{
modelo: "Fusca",
ano: 1987
}
];
for (let index in carros) {
console.log(index);
let carro = carros[index];
carro["vendido"] = true;
carros[index] = carro;
}
console.log(carros);
for...of
var carros = [
{
modelo: "Cruze",
ano: 2012
},
{
modelo: "Fusca",
ano: 1987
}
];
for (let carro of carros) {
console.log(carro);
}
Algoritmos com Javascript
By Alan Ferreira dos Santos
Algoritmos com Javascript
Programação Web
- 151