Você está aqui: JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Aprenda a usar arrays (matrizes ou vetores) em JavaScript

Quantidade de visualizações: 12282 vezes

Arrays (também chamadas de matrizes ou vetores) são encontradas em todas as linguagens de programação. As matrizes são, na verdade, apenas variáveis. Podemos pensar nas matrizes como um conjunto de variáveis, todas possuindo o mesmo nome.

Usamos matrizes quando queremos trabalhar com um determinado conjunto de dados relacionados e do mesmo tipo. Um exemplo seria uma matriz de notas de alunos. Cada nota pode ser acessada pelo nome da matriz e um valor inteiro especificando sua posição na matriz. A posição de um item (elemento) em uma matriz é chamada de índice ou subscrito e, em JavaScript, começa sempre em 0, ou seja, o índice 0 refere ao primeiro elemento na matriz.

A forma mais simples e comum de se criar arrays em JavaScript é por meio do construtor do objeto Array(). Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>

<script type="text/javascript">
  // vamos criar uma matriz de nomes sem especificar
  // o tamanho
  var nomes = new Array();

  // vamos criar uma matriz de notas contendo 10 elementos
  var notas = new Array(10);
</script>

</head>
<body>

</body>
</html>

Aqui nós criamos duas matrizes: uma matriz vazia e outra contendo 10 elementos. Quando criamos matrizes usando o contrutor do objeto Array, todos os elementos da matriz possuem o valor undefined (para os tipos primitivos) e null (para as matrizes de objetos).

Veja agora como criar uma matriz de números inteiros e definir os valores de seus elementos:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos criar uma matriz de 5 números inteiros
  var numeros = new Array(5);

  // vamos definir os valores para os elementos
  numeros[0] = 5;
  numeros[1] = 7;
  numeros[2] = 9;
  numeros[3] = 1;
  numeros[4] = 4;

  // vamos exibir o valor do terceiro elemento (índice 2)
  window.alert("O valor do terceiro elemento é: " + numeros[2]);
</script>

Note que criamos a matriz, inicializamos os valores de seus elementos e usamos o método alert() do objeto window para exibir o valor do terceiro elemento (aquele com o índice 2, já que os índices se iniciam em 0).

É possível também usar o construtor do objeto Array para criar matrizes com valores já definidos. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos criar um array com valores já especificados
  var numeros = new Array(5, 3, 19, 21, 74);

  // vamos exibir o valor do terceiro elemento (índice 2)
  window.alert("O valor do terceiro elemento é: " + numeros[2]);
</script>

Neste trecho de código nós já definimos os valores dos elementos do array diretamente nos parênteses do construtor do objeto Array.

Outra forma muito comum de se criar arrays em JavaScript é usando a notação de colchetes. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos criar um array vazio
  var numeros = [];

  // vamos criar uma array contendo 3 elementos
  var nomes = ["Osmar", "Fabiano", "Márcia"];
</script>

Finalmente, diferente de linguagens tipadas (na qual precisamos especificar o tipo de dados de cada variável), o JavaScript nos permite criar matrizes cujos elementos são de diferentes tipos:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos criar uma array contendo 4 elementos de diferentes
  // tipos de dados: um inteiro, um float, uma string e um boolean
  var valor = [10, 4.32, "Osmar", true];
</script>

</head>
<body>

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Strings e Caracteres

Como adicionar zeros ou outro caractere ao final de uma string em JavaScript usando a função padEnd() do objeto String

Quantidade de visualizações: 1436 vezes

O método padEnd(), adicionado ao objeto String no ES2017 (ECMAScript 8) é usado quando queremos preencher o final de uma string com zeros ou qualquer outro caractere até alcançarmos um comprimento determinado.

Veja, por exemplo, como adicionar asteríscos (*) no final de uma string para alcançar o tamanho de dez caracteres:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  var valor = 17;
  // vamos mostrar o valor com o tamanho de dez caracteres
  document.write("O valor é: " + valor.toString().padEnd(10, "*"));
</script>

Ao executar o exemplo você verá o valor "17********" ser exibido. Porém, como o método padEnd() foi adicionado no ES2017, pode ser que você encontre navegadores que ainda não o suportem. Assim, é sempre uma idéia testar a sua existência. Veja:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  if(String.prototype.padEnd){
    window.alert("Seu browser já suporta a função padEnd().");  
  }
  else{
    window.alert("Seu browser NÃO suporta a função padEnd().");  
  }
</script>

Se o navegador não oferecer suporte a este método, você poderá usar um Polyfill, de terceiros ou uma solução que você mesmo poderá desenvolver.

JavaScript ::: Dicas & Truques ::: Data e Hora

Como construir uma determinada data e hora usando o construtor do objeto Date do JavaScript

Quantidade de visualizações: 6857 vezes

Em algumas situações precisamos construir um objeto Date representando uma determinada data e hora. Para isso podemos usar o construtor deste objeto. Veja a sintáxe:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

new Date(year, month[, date[, h[, m[, s[, ms]]]]]);

Veja que temos que fornecer os argumemtos na ordem ano, mês, dia, horas, minutos, segundos e milisegundos. Apenas os argumentos para os parâmetros ano e mês são obrigatórios. Veja, por exemplo, como podemos construir a data 01/08/2010:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudos JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // vamos construir a data 01/08/2010
  var data = new Date(2010, 7);

  // vamos exibir o resultado
  document.write("A data é: " + data); 
</script>

</body>
</html>

Este trecho de código exibirá o seguinte resultado:

A data é: Sun Aug 1 00:00:00 UTC-0300 2010.

É importante ficar atento à faixa de valores permitida para cada um dos parâmetros:

year - Exigido. Aqui devemos fornecer o ano completo, por exemplo, 1997 (e não 97).

month - Exigido. Devemos fornecer o mês como um inteiro na faixa de 0 a 11 (janeiro é 0 enquanto dezembro é 11).

date - Opcional. Aqui devemos fornecer o dia como um inteiro na faixa de 1 a 31.

hours - Opcional. Devemos fornecer as horas como um inteiro na faixa de 0 a 23.

minutes - Opcional. Devemos fornecer os minutos como um inteiro na faixa de 0 a 59.

seconds - Opcional. Devemos fornecer os segundos como um inteiro na faixa de 0 a 59.

ms - Opcional. Um inteiro na faixa de 0 a 999.

Veja agora um trecho de código no qual construímos a data 14/05/2010 às 17:50:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<script type="text/javascript">
  // vamos construir a data 14/05/2010 às 17:50
  var data = new Date(2010, 4, 14, 17, 50);

  // vamos exibir o resultado
  document.write("A data é: " + data); 
</script>

Este código exibirá o seguinte resultado:

A data é: Fri May 14 17:50:00 UTC-0300 2010.

Esta dica foi escrita e testada no Internet Explorer 8 e Firefox 3.6.

JavaScript ::: Dicas & Truques ::: Data e Hora

Como subtrair dias de uma data em JavaScript - Data e horas em JavaScript

Quantidade de visualizações: 16629 vezes

Em algumas situações, principalmente quando estamos desenvolvendo aplicações que envolvem datas, horas e calendários em JavaScript, nós precisamos subtrair dias de uma data. Nesta dica eu mostro como isso pode ser feito.

Veja o código completo abaixo:

----------------------------------------------------------------------
Se precisar de ajuda com o código abaixo, pode me chamar
no WhatsApp +55 (62) 98553-6711 (Osmar)
----------------------------------------------------------------------

<html>
<head>
<title>Estudando JavaScript</title>
</head>
<body>
 
<script type="text/javascript">
  function subtrairDias(data, dias){
    return new Date(data.getTime() - 
    (dias * 24 * 60 * 60 * 1000));
  }
 
  document.write('Hoje é: ' + 
    (new Date()).toLocaleDateString() + '<br>');
  document.write('5 dias atrás era: ' + 
    subtrairDias(new Date(), 5).toLocaleDateString());
</script>
 
</body>
</html>

Ao executarmos este código nós teremos o seguinte resultado:

Hoje é: 25/03/2021
5 dias atrás era: 20/03/2021

Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

Como subtrair dois números em JavaScript - O operador de subtração da linguagem JavaScript - Exercícios Resolvidos de JavaScript

Como testar se o argumento de uma função JavaScript é do tipo String - Exercícios Resolvidos de JavaScript

Como testar se uma variável é do tipo string em JavaScript - Exercício Resolvido de JavaScript

Como testar se uma string está vazia em JavaScript - Exercício Resolvido de JavaScript

Como multiplicar dois números em JavaScript - O operador de multiplicação da linguagem JavaScript - Exercício Resolvido de JavaScript

Ler três números inteiros e indicar se eles estão em ordem crescente ou decrescente - Exercícios Resolvidos de JavaScript

Como encontrar o menor valor em um array de inteiros em JavaScript - Exercícios Resolvidos de JavaScript

Como somar dois números em JavaScript - O operador de adição da linguagem JavaScript - Exercícios Resolvidos de JavaScript

Veja mais Dicas e truques de JavaScript

Como converter uma string para letras maiúsculas em JavaScript usando a função toUpperCase() do objeto String - JavaScript para iniciantes

Remover caracteres de controle de uma string

Ocultar código JavaScript dos navegadores que não suportam a linguagem

Como criar um tabela (elemento HTML table) dinamicamente, contendo linhas e colunas

Como retornar a primeira palavra de uma string em JavaScript usando a função split()

Como obter o código da tecla pressionada em um elemento HTML usando o evento onkeypress do JavaScript

Como retornar o dia da semana em JavaScript no formato Domingo, Segunda-feira, Terça-feira, etc

Trigonometria em JavaScript - Como converter graus em radianos usando JavaScript

Como substituir uma substring em uma string JavaScript usando a função replace()

Como remover elementos duplicados de um array em JavaScript usando as funções filter() e indexOf() do objeto Array

Dicas e truques de outras linguagens

JavaScript - Como retornar o caractere associado a um código ASCII ou Unicode em JavaScript usando a função fromCharCode() do objeto String

Delphi - Como ler todo o conteúdo de um arquivo texto usando Delphi - As funções AssignFile(), ReadLn() e Eof() do Delphi

C++ - C++ para iniciantes - Como usar a instrução switch em C++

C# - Como contar as palavras de uma frase ou texto em C# usando as funções IndexOf(), Replace() e Split() da classe String

JavaScript - Como acessar as mídias do usuário em JavaScript usando a função getUserMedia() da interface MediaDevices

C# - Como testar a ocorrência de uma substring em uma string do C# usando o método Contains() da classe String

Python - Python Insertion Sort - Como ordenar um vetor de inteiros usando a ordenação Insertion Sort (Ordenação por Inserção)

Java - Exercícios Resolvidos de Java - Como testar se há um serviço sendo executado em uma porta de um servidor ou máquina local

Python - Como usar o método read_csv() do Pandas da linguagem Python para carregar um dataset e retorná-lo como um DataFrame

Ruby - Como retornar a versão do Ruby instalada na sua máquina usando ruby -v ou a constante RUBY_DESCRIPTION

Códigos Fonte

Programa de Gestão Financeira Controle de Contas a Pagar e a Receber com Cadastro de Clientes e Fornecedores

Software de Gestão Financeira com código fonte em PHP, MySQL, Bootstrap, jQuery - Inclui cadastro de clientes, fornecedores e ticket de atendimento
Diga adeus às planilhas do Excel e tenha 100% de controle sobre suas contas a pagar e a receber, gestão de receitas e despesas, cadastro de clientes e fornecedores com fotos e histórico de atendimentos. Código fonte completo e funcional, com instruções para instalação e configuração do banco de dados MySQL. Fácil de modificar e adicionar novas funcionalidades. Clique aqui e saiba mais

Controle de Estoque completo com código fonte em PHP, MySQL, Bootstrap, jQuery - 100% funcional e fácil de modificar e implementar novas funcionalidades
Tenha o seu próprio sistema de controle de estoque web. com cadastro de produtos, categorias, fornecedores, entradas e saídas de produtos, com relatórios por data, margem de lucro e muito mais. Código simples e fácil de modificar. Acompanha instruções para instalação e criação do banco de dados MySQL. Clique aqui e saiba mais

Linguagens Mais Populares

1º lugar: Java
2º lugar: Python
3º lugar: C#
4º lugar: PHP
5º lugar: C
6º lugar: Delphi
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby

Você está aqui: JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Aprenda a usar arrays (matrizes ou vetores) em JavaScript

JavaScript ::: Dicas & Truques ::: Strings e Caracteres

Como adicionar zeros ou outro caractere ao final de uma string em JavaScript usando a função padEnd() do objeto String

JavaScript ::: Dicas & Truques ::: Data e Hora

Como construir uma determinada data e hora usando o construtor do objeto Date do JavaScript

JavaScript ::: Dicas & Truques ::: Data e Hora

Como subtrair dias de uma data em JavaScript - Data e horas em JavaScript

Questões de Concurso para Engenharia Civil

Exercícios Resolvidos

Bancos de Dados

Questões de Concurso

Frameworks

Projetos e Códigos Fonte

Especializações

Calculadoras

Ferramentas

Todas as Linguagens, Frameworks, Biliotecas e Bancos de Dados

Compre pelo WhatsApp: +55 (062) 98553-6711

E-Book 350 Exercícios Resolvidos de Java - Com comentários em Português

PDF COM 500 PÁGINAS

Apenas R$ 19,90