Comentários

JavaScript possui comentários de linha e comentários de bloco. Os comentários de linha são definidos após duas barras //. Dessa forma, todo o conteúdo após as duas barras // é considerado comentário e não será interpretado como código.

// Este é um comentário de linha
numero = 0; // Atribuir o valor 0 a variável numero

Já os comentários de bloco são definidos entre as sequências /* e */. Assim, todo o conteúdo entre as sequências /* e */ é um bloco de comentário e não será interpretado como código.

/* Este é um comentário de bloco.
   Ele pode ter várias linhas.
   É bastante útil para trechos de documentação de código. */

Entrada e saída básica no navegador

Os navegadores de internet possuem alguns métodos úteis para a realização de testes durante o aprendizado da linguagem, como console.log, console.warn e console.error, que produzem saídas no console das ferramentas do desenvolvedor, e os métodos prompt, alert e confirm, do objeto window que permitem entrada e saída básica a partir de janelas pop-ups.

// obter uma string do usuário a partir de uma janela *pop-up*
nome = window.prompt("Digite seu nome:");

// enviar uma mensagem ao usuário por uma janela *pop-up*
window.alert("Olá " + nome);

// obter uma confirmação do usuário (Ok/Cancelar) por uma janela *pop-up*
resposta = window.confirm("Tem certeza?")

// exibir uma mensagem ao usuário no console do desenvolvedor (F12)
// ver também: console.error, console.warn, console.info, console.table, ...
console.log("Olá", nome);

Tipos de dados primitivos

  • Boolean: os valores true e false.
  • null: indica um valor nulo.
  • undefined: indica um valor indefinido.
  • Number: números inteiros e reais, ex: 10.05, 0, -1, 3.14.
  • String: cadeia de caracteres (texto), ex: “Um texto!”.
  • Symbol: (Novo no EcmaScript 6) Tipo com instâncias únicas e imutáveis, pode ser usado, por exemplo, em chaves de objetos.
typeof true; // "boolean"
typeof null; // "object"
typeof undefined; // "undefined"
typeof 123; // "number" 
typeof 1.5; // "number
typeof "abc"; // "string"
typeof 'abc'; // "string"
typeof {}; // "object"
typeof []; // "object"

Operações diversas

Aritmética básica

123 + 321; // adição: 123 mais 321 igual a 444
98  87;   // subtração: 98 menos 87 igual a 11
5 * 2;     // multiplicação: 5 vezes 2 igual a 10
12 / 4;    // divisão: 12 dividido por 4 igual a 3
5 % 2;     // resto da divisão: 5 dividido por 2 sobra 1
4 ** 3;    // potência: 4 elevado a 3 igual a 64

Atribuição simples

a = 1;     // atribuição: a recebe 1
b = a + 2; // atribuição: b recebe valor de a mais 2

Atribuição aritmética

x = 1;   // atribuição simples: x recebe 1
x += 10; // x recebe valor de x mais 10 ... x = 11
x *= 2;  // x recebe valor de x vezes 2 ... x = 22

Incrementadores/decrementadores

x = 0; // atribuição simples: x recebe 0
x++;   // x agora vale 1
x++;   // x agora vale 2
x--;   // x agora vale 1

y = x++; // y vale 1 e x vale 2
y = ++x; // y e x valem 3

Concatenação de Strings

nome = "Fulano";
linguagem = "Java" + "Script";              // "JavaScript"
frase = nome + " programa em " + linguagem; // "Fulano programa em JavaScript"

// usando interpolação com "template string"
outra_frase = `${nome} programa em ${linguagem}`;

Uso de parênteses

// media recebe a soma de 9, 8, 7 e 6 dividida por 4
// ou, media recebe a média aritmética de 9, 8, 7 e 6
media = (9 + 8 + 7 + 6) / 4;

Comparação de valores

a == b; // comparar se o valor de a é igual ao valor de b
a != 0; // comparar se o valor de a é diferente de 0
b > c;  // comparar se o valor de b é maior que o valor de c
c < d;  // comparar se o valor de c é menor que o valor de d
a <= 1; // comparar se o valor de a é menor ou igual a 1
9 >= b; // comparar se 9 é maior ou igual ao valor de b

a === b;   // comparar se a e b tem o mesmo valor e o mesmo tipo
a !== b;   // comparar se a e b não tem mesmo valor e mesmo tipo

1 == "1";  // true
1 != "1";  // false
1 === "1"; // false
1 !== "1"; // true

Operadores lógicos

// and
true && true;   // true
true && false;  // false
false && true;  // false
false && false; // false

// or
true || true;   // true
true || false;  // true
false || true;  // true
false || false; // false

// not
!true;    // false
!false;   // true

!0;       // true
!1;       // false
!"";      // true
!!"";     // false
!"asdf";  // false
!!"asdf"; // true

// busca por um valor "verdadeiro"
nome = "";
sobrenome = "";
usuario = "admin";

console.log(nome || sobrenome || usuario || "visitante"); // "admin"

Objetos

Um objeto é uma lista de pares de nomes associados a valores. Pode-se usar um inicializador literal com {} ou o construtor Object.

contato1 = { nome: "Fulano", email: "fulano@gmail.com" };
console.log("O e-mail de", contato1.nome, "é", contato1.email);

contato2 = {};
contato2.nome = "Cicrano";
contato2.email = "cicrano@live.com";
console.log(`O e-mail de ${contato2.nome} é ${contato2.email}`);

contato3 = new Object();
contato3["nome"] = "Beltrano"; // atributo como string entre colchetes []
contato3.email = "beltrano@hotmail.com";
console.log(`O e-mail de ${contato3.nome} é ${contato["email"]}`);

Arrays

Tecnicamente, em JavaScript, um Array é considerado um objeto com características distintas. É definido como uma lista com zero ou mais valores indexados iniciando em zero.

frutas = ["Laranja", "Banana", "Abacate"];
console.log(frutas[0], "é uma ótima fruta."); // Laranja é uma ótima fruta.

Conversão automática entre tipos

valor = "10" + "5"; // concatenação: "105"
valor = "10" + 5;   // concatenação: "105"
valor = 10 + "5";   // concatenação: "105"
valor = "10"  5;   // subtração: 5 ¯\_(ツ)_/¯
valor = "10" * 5;   // multiplicação: 50

Conversão entre String e Number

// conversão para números inteiros
a = "10";
b = "-2";
parseInt(a) + parseInt(b);

// conversão para base decimal
parseInt("1234", 8);  // octal para decimal
parseInt("10001", 2); // binário para decimal

// conversão para números reais
a = "1.5";
b = "2.75";
parseFloat(a) + parseFloat(b);

// forma alternativa de conversão de texto para números (sinal +)
a = "2.5";
b = "4";
+"1.5" + +"4" + +a;
(+a) + (+b) + (+"1.1");

// CUIDADO!!!
x = "";
parseInt(x); // NaN
+x;          // 0