Aula 01 - Javascript - Introdução ao javascript
Javascript é uma linguagem que todos os desenvolvedores Web devem conhecer bem.
Obs. Javascript não tem nada haver com Java, são duas linguagens bem diferentes.
Se gostarem do conteúdo dêem um joinha 👍 na página do Código Fluente no
Facebook
Link do código fluente no Pinterest
Meus links de afiliados:
Introdução ao javascript
Javascript é uma linguagem de programação dinâmica, isto é, uma linguagem de script.
Ela é leve, ou seja, não consome muita memória e possui uma sintaxe e recursos relativamente simples.
É orientada a objetos, multiplataforma, pois pode ser usada em vários sistemas, não só para desenvolvimento web.
Javascript é uma das três tecnologias mais usadas no desenvolvimento web, junto com css e html.
O html é responsável pelo conteúdo em si (títulos, parágrafos, cabeçalhos, etc.), o css pela formatação (cores, fonts, tamanho na tela, etc.), ou seja, a apresentação.
O Javascript possibilita fazer páginas dinâmica, que reagem com efeitos interativos, ele fornece ações reativas nos componentes da página.
Sua especificação é chamada de ECMAScript.
Javascript é fracamente tipada (weak typing), ou seja, você não precisa definir antes o tipo da variável (int, float, string, etc.), então, um código como esse abaixo, executa sem nenhum problema.
var x = "Maria";
var y = 12;
alert(x + y);
Saída:
Maria12
O javascript roda principalmente no browser do usuário, ou seja, no lado do cliente (client-side).
Mas pode ser executado também no servidor ou, na verdade, em qualquer dispositivo que tenha um programa interpretador JavaScript.
Muitos programas desktop e servidores usam JavaScript. O Node.js é o mais conhecido.
Alguns bancos de dados, como o MongoDB e o CouchDB, também usam JavaScript como linguagem de programação.
A linguagem foi inicialmente criada para "tornar as páginas da web vivas".
Os scripts são feitos e executados como arquivo de texto simples.
Não precisa de preparação ou compilação especial para serem exibidos.
Mãos a obra.
Crie uma pasta como por exemplo:
javascript_codes/exemple01/ e dentro crie o arquivo
index.html com conteúdo abaixo:
<!DOCTYPE html>
<html lang="pt-br">
<head>
<meta charset="UTF-8">
<title>Aula 1: Fundamentos da Linguagem JavaScript - código fluente</title>
</head>
<body>
<h1>Aula 1: Fundamentos da Linguagem JavaScript - código fluente</h1>
</body>
<script>
console.log('Olá mundo!');
</script>
</html>
Abra a página no browser, vá em ferramentas de desenvolvedor no browser e depois escolha console.
Você verá o print
Olá mundo! no console.
Vamos agora fazer uma outra experiência, vamos colocar o script em um arquivo separado, fora do html.
Crie na mesma pasta
javascript_codes/exemple01/ um arquivo chamado
script.js e coloque nele.
console.log('Olá mundo!!!');
Agora modifique o
index.html.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Aula 1: Fundamentos da Linguagem JavaScript - código fluente</title>
</head>
<body>
<h1>Aula 1: Fundamentos da Linguagem JavaScript - código fluente</h1>
</body>
<script src="script.js"></script>
</html>
Veja no console do browser o mesmo resultado.
Vamos falar de variáveis agora, variável é um conceito fundamental em qualquer linguagem de programação.
Foi falado anteriormente que Javascript é fracamente tipada (weak typing), diferente de C, Java, entre outras, que você precisa definir o tipo da variável antes de guardar qualquer valor nela, seja um número inteiro, um tipo float, uma string, etc.
Para saber mais sobre tipos de variáveis: int, float, double, string, char... Aconselho a assistirem as aulas do curso de programação em C:
http://www.codigofluente.com.br/algoritmo-programacao/linguagem-de-programacao-c/
Uma variável nada mais é do que um recipiente em que colocamos algum valor para poder processar alguma coisa, algum dado.
Para declarar uma variável no Javascript é bem simples, é só utilizar a palavra var antes do nome da variável, mas, se quiser que seja uma variável global, é só omitir o var antes da declaração da variável.
Se não usar o
var antes da declaração da variável, ele será uma variável global.
nome_global = "Variável Global";
Usando o
var antes da declaração da variável, ele será uma variável local.
var nome_local = "Variável Local";
A variável
nome_global e
nome_local são pedaços da memória do computador que estão guardando as strings:
Variável Global e
Variável Local respectivamente.
Poderíamos ter usado aspas simples nos valores das strings que também funcionaria.
Vamos criar agora a variável nome no console, apenas para testar:
var nome = "João";
Agora a sobrenome:
var sobrenome = "da Silva";
Variável idade:
var idade = 50;
Veja que idade é um tipo diferente de dado, é um dado numérico.
Então, vamos aproveitar para falar dos tipos de dados primitivos do Javascript.
Javascript tem 5 tipos diferentes de tipos de dados.
- Numérico: números reais tipo float, decimais e inteiros.
- String: sequência de caracteres, usada para textos.
- Boolean: para dados lógicos, que podem ser apenas verdadeiro(true) ou Falso(false).
- Underfined: tipo de dados para variáveis que não tem nenhum valor ainda.
- Null: para dados não existentes.
Os números em Javascript são sempre ponto flutuante, isto é, tipo float, mesmo que as vezes não pareça, mesmo sem que nós os definamos.
Por exemplo: 5 é 5.0
Na maioria das linguagens, temos tipos diferentes para inteiros, decimais, ponto flutuante, mas, em Javascript não.
Javascript é tipado dinamicamente, isso quer dizer que não precisamos definir que tipo de dado será colocado em uma variável, o próprio Javascript descobre automaticamente se é um número, um texto, um booleano, se é indefino, etc.
Voltando ao código, vamos criar a variável estadoCivil:
var estadoCivil = false;
Coloque no
javascript_codes/exemple01/script.js todas as variáveis que criamos anteriormente no console.
var nome = "João";
var sobrenome = "da Silva";
var idade = 50;
var estadoCivil = false;
console.log(nome)
console.log(sobrenome)
console.log(idade)
console.log(estadoCivil)
A convençao de nomes de variáveis é camel case, ou seja, variáveis com mais de um nome, por exemplo, estadoCivil, começa com letras minúsculas e cada palavra nova inicia com maiúscula.
Vamos criar outra variável no
javascript_codes/exemple01/script.js chamada profissao, sem atribuir nenhum valor a ela.
var nome = "João";
var sobrenome = "da Silva";
var idade = 50;
var estadoCivil = false;
var profissao
console.log(sobrenome)
console.log(idade)
console.log(estadoCivil)
console.log(profissao)
Agora vamos definir um valor para a variável profissão no
javascript_codes/exemple01/script.js:
var nome = "João";
var sobrenome = "da Silva";
var idade = 50;
var estadoCivil = false;
var profissao;
profissao = "Médico";
console.log(sobrenome);
console.log(idade);
console.log(estadoCivil);
console.log(profissao);
if (estadoCivil)
console.log(nome + " " + sobrenome + " é casado")
else
console.log(nome + " " + sobrenome + " é solteiro")
Existe algumas coisas que não podemos fazer com nomes de variáveis, por exemplo, teste no console do browser:
var 5anos = 5;
Isso dará erro porque variáveis não podem começar com números.
Para corrigir isso, podemos usar um underscore ou sinal de dolar, por exemplo:
var _5anos = 5;
Outra violação das palavras chave e símbolos reservados da linguagem seria:
var toti/cavalcanti = "Toti Cavalcanti";
Outros exemplos:
var function = 5342;
var delete = 5342;
var if = 5342;
Vou deixar meu link de referidos na digitalocean pra vocês.
Quem se cadastrar por esse link, ganha $100.00 dólares de crédito na digitalocean:
Esse outro link é da one.com:
Obrigado, até a próxima e bons estudos. ;)
