O que é JavaScript?


HTML

JavaScript é a Linguagem de Programação para a Web.

JavaScript pode atualizar e alterar HTML e CSS.

JavaScript pode calcular , manipular e validar dados.


Tutorial de início rápido de JavaScript

Este tutorial dará uma rápida olhada nos tipos de dados JavaScript mais importantes.

As variáveis ​​JavaScript podem ser:

  • Números
  • Cordas
  • Objetos
  • Matrizes
  • Funções

Variáveis ​​JavaScript

As variáveis ​​JavaScript são contêineres para armazenar valores de dados.

Neste exemplo, x, y e z são variáveis:

Exemplo

var x = 5;
var y = 6;
var z = x + y;

A partir do exemplo acima, você pode esperar:

  • x armazena o valor 5
  • y armazena o valor 6
  • z armazena o valor 11

Números JavaScript

JavaScript tem apenas um tipo de número. Os números podem ser escritos com ou sem decimais.

Exemplo

var x = 3.14;    // A number with decimals
var y = 3;       // A number without decimals

Todos os números são armazenados como números de ponto flutuante de precisão dupla.

O número máximo de decimais é 17, mas o ponto flutuante nem sempre é 100% preciso:

Exemplo

var x = 0.2 + 0.1;         // x will be 0.30000000000000004


Cadeias JavaScript

Strings armazenam texto . Strings são escritas entre aspas. Você pode usar aspas simples ou duplas :

Exemplo

var carname = "Volvo XC60";  // Double quotes
var carname = 'Volvo XC60';  // Single quotes

O comprimento de uma string é encontrado na propriedade length :

Exemplo

var txt = "ABCDEFGHIJKLMNOPQRSTUVWXYZ";
var sln = txt.length;


Objetos JavaScript

Você já aprendeu que as variáveis ​​JavaScript são contêineres para valores de dados.

Este código atribui um valor simples (Fiat) a uma variável chamada car:

var car = "Fiat";

Objetos também são variáveis. Mas os objetos podem conter muitos valores.

Este código atribui muitos valores (Fiat, 500, branco) a uma variável chamada car:

var car = {type:"Fiat", model:"500", color:"white"};

Matrizes JavaScript

Matrizes JavaScript são usadas para armazenar vários valores em uma única variável.

Exemplo

var cars = ["Saab", "Volvo", "BMW"];

Funções JavaScript

Uma função JavaScript é um bloco de código projetado para executar uma tarefa específica.

Uma função JavaScript é executada quando "algo" a invoca (chama).

Exemplo

function myFunction(p1, p2) {
    return p1 * p2;              // The function returns the product of p1 and p2
}

O que o JavaScript pode fazer?

Esta seção contém alguns exemplos do que o JavaScript pode fazer:

  • JavaScript pode alterar o conteúdo HTML
  • JavaScript pode alterar valores de atributo HTML
  • JavaScript pode alterar estilos HTML (CSS)
  • JavaScript pode ocultar elementos HTML
  • JavaScript pode mostrar elementos HTML

JavaScript pode alterar o conteúdo HTML

Um dos muitos métodos HTML JavaScript é getElementById() .

Este exemplo usa o método para "encontrar" um elemento HTML (com id="demo") e altera o conteúdo do elemento ( innerHTML ) para "Hello JavaScript":

Exemplo

document.getElementById("demo").innerHTML = "Hello JavaScript";

JavaScript pode alterar valores de atributo HTML

Neste exemplo JavaScript altera o valor do atributo src (source) de uma tag <img>:

A lâmpada


JavaScript pode alterar estilos HTML (CSS)

Alterar o estilo de um elemento HTML é uma variante de alterar um atributo HTML:

Exemplo

document.getElementById("demo").style.fontSize = "35px";
or
document.getElementById('demo').style.fontSize = '35px';

JavaScript pode ocultar elementos HTML

Ocultar elementos HTML pode ser feito alterando o estilo de exibição:

Exemplo

document.getElementById("demo").style.display = "none";
or
document.getElementById('demo').style.display = 'none';

JavaScript pode mostrar elementos HTML

A exibição de elementos HTML ocultos também pode ser feita alterando o estilo de exibição:

Exemplo

document.getElementById("demo").style.display = "block";
or
document.getElementById('demo').style.display = 'block';

Tutorial completo de JavaScript

Esta foi uma breve descrição do JavaScript.

Para um tutorial JavaScript completo, vá para W3Schools JavaScript Tutorial .

Para obter uma referência completa de JavaScript, acesse Referência de JavaScript do W3Schools .