02 – Javascript – Comentário, Mutação e Coerção de Variável, Alert e Prompt

More videos
Views
   

Aula 02 – Javascript – Comentário, Mutação e Coerção de Variável, Alert e Prompt

Comentários no javascript

Comentários no javascript

Vamos falar brevemente sobre comentário.

Os comentários são usados em qualquer linguagem de programação para documentar explicativamente em loco o que determinada parte de um código faz.

Os comentários são ignorados pelo interpretador ou compilador, dependendo da linguagem.

Eles são apenas um texto explicativo dentro de um código.

Em javascript temos dois tipos de comentários: o de linha única e o de multiplas linhas.

Exemplo de comentário de única linha:


//idade do cliente
idade = 47

Exemplo de comentário de multiplas linhas:


/*
idade 
do 
cliente
*/
idade = 47

Vamos fazer um comentário no nosso código javascript_codes/exemple01/script.js apenas para explicar do que se trata o exemplo.

O que está em laranja está comentado e portanto será ignorado pelo interpretador javascript.


/********************************
* Variáveis e tipos de dados
*/
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");

Agora crie uma pasta: javascript_codes/exemple02/ e dentro crie o arquivo index.html com conteúdo abaixo: 


<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <meta charset="UTF-8">
        <title>Aula 2: Fundamentos da Linguagem JavaScript - código fluente</title>
    </head>

    <body>
        <h1>Aula 2: Fundamentos da Linguagem JavaScript - código fluente - Comentário, Mutação e Coerção de Variável, Alert e Prompt</h1>
    </body>
    <script src="script.js"></script>
</html>

Crie na mesma pasta javascript_codes/exemple02/ um arquivo chamado script.js e coloque nele.


/********************************
* Comentário, Mutação e Coerção de Variável, Alert e Prompt
*/
var nome, sobrenome, idade, estadoCivil, temFilhos;
nome = "Fulano";
sobrenome = "de Tal";
idade = 39;

//Coerção de tipo
console.log(nome + " " + sobrenome + " tem " + idade + " anos.");

estadoCivil = true;
temFilhos = false;

console.log(nome + " " + sobrenome + " é casado? " + estadoCivil);
console.log("Tem filho? " + temFilhos);

A saída do primeiro console.log():

Fulano de Tal tem 39 anos.

A saída do segundo e terceiro console.log():

Fulano de Tal é casado? true
Tem filho? false

Nome, sobrenome, idade, estadoCivil e temFilhos foram declarados na mesma linha, essa é uma forma diferente de declarar as variáveis, até aí elas estão como undefined.

coerção de tipo

Note que idade é um dado numérico, mas, na hora que o Javascript percebe que o número está sendo concatenado em uma string, isto é, em um texto, ele automaticamente trasforma o dado numérico idade, em uma string com os caracteres ‘5’ e ‘0’.

Na linha seguinte são atribuídos valores booleanos a estadoCivil temFilhos ,true e false respectivamente, e nos dois console.log(), as variáveis booleanas foram transformadas em string automaticamente também, como no caso do número 50, referente a idade do primeiro console.log().

Isso chama-se coerção de tipo e isso acontece o tempo todo em Javascript.

Até mesmo variáveis undefined passam por coerção no Javascript.

Acrescente ao script.js a parte referente a mutação de variável. O que tá em laranja.


/********************************
* mutação e coerção de tipos de variáveis
*/
var nome, sobrenome, idade, estadoCivil, temFilhos;
nome = "Fulano";
sobrenome = "de Tal";
idade = 39;

//Coerção de tipo
console.log(nome + " " + sobrenome + " tem " + idade + " anos.");

estadoCivil = true;
temFilhos = false;

console.log(nome + " " + sobrenome + " é casado? " + estadoCivil);
console.log("Tem filho? " + temFilhos);

//mutação de variável
idade = "Trinta e nove";
console.log(nome + " " + sobrenome + " tem " + idade + " anos.");

Veja que a idade que era numérico, passou a ser explicitamente uma string, um número por extenso.

Comente o que tá em laranja no script.js e acrescente o alert() para ver a saída através dele ao invés do console.log().


/********************************
* mutação e coerção de tipos de variáveis
*/

var nome, sobrenome, idade, estadoCivil, temFilhos;
nome = "Fulano";
sobrenome = "de Tal";
idade = 39;

//Coerção de tipo
//console.log(nome + " " + sobrenome + " tem " + idade + " anos.");
alert(nome + " " + sobrenome + " tem " + idade + " anos.");
/*
estadoCivil = true;
temFilhos = false;

console.log(nome + " " + sobrenome + " é casado? " + estadoCivil);
console.log("Tem filho? " + temFilhos);

//mutação de variável;
idade = "Trinta e nove";
*/

Vamos comentar todo o código agora e pegar a entrada de dados através do prompt.


/********************************
* mutação e coerção de tipos de variáveis
*/

/*
var nome, sobrenome, idade, estadoCivil, temFilhos;
nome = "Paulo";
sobrenome = "Ribeiro";
idade = 39;

//Coerção de tipo
//console.log(nome + " " + sobrenome + " tem " + idade + " anos.");
alert(nome + " " + sobrenome + " tem " + idade + " anos.");

estadoCivil = true;
temFilhos = false;

console.log(nome + " " + sobrenome + " é casado? " + estadoCivil);
console.log("Tem filho? " + temFilhos);

//mutação de variável
idade = "Trinta e nove";
*/
var nome = prompt("Qual seu nome?");
var sobrenome = prompt("Qual seu sobrenome?");
console.log("Olá " + nome + " " + sobrenome + ", tudo bem?");

Na próxima aula veremos operações básicas.

Por favor, deixem seus comentários, sugestões e críticas. 😉

Se gostaram, se inscrevam no blog para ficar por dentro dos posts lançados.

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. 😉

Increva-se

Inscreva-se agora e receba um e-mail assim que eu publicar novo conteúdo.

Concordo em me inscrever no blog Código Fluente

Você poderá cancelar sua inscrição a qualquer momento.

(Visited 18 times, 1 visits today)
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>