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

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

Comentários no javascript

Comentários no javascript

Voltar para página principal do blog

Todas as aulas desse curso

Aula 01

Aula 03

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:

Hostinger

Digital Ocean

One.com

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

Voltar para página principal do blog

Todas as aulas desse curso

Aula 01

Aula 03

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

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>