01 – Javascript – Introdução ao javascript

More videos
Views
   

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.

Introdução ao javascript

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:

https://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;

Curta a página do Código Fluente no Facebook
https://www.facebook.com/Codigofluente-338485370069035/

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:

Digital Ocean

Esse outro link é da one.com:

One.com

Obrigado, até a próxima e bons estudos. 😉

About The Author
-

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>