Você está aqui: JavaScript ::: Dicas & Truques ::: Strings e Caracteres

Como converter uma string em um valor de ponto-flutuante em JavaScript usando a função parseFloat()

Quantidade de visualizações: 7789 vezes

Em algumas situações nós precisamos receber uma string informada pelo usuário e convertê-la para um valor real válido. Um valor em JavaScript é o mesmo que um valor com casas decimais, ou seja, um valor de ponto-flutuante.

Esta tarefa pode ser realizada com o auxílio da função parseFloat(). Veja uma página HTML completa demonstrando o seu uso:

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

<!doctype html>
<html>
<head>
  <title>Strings em JavaScript</title>
</head>
<body>

<script type="text/javascript">
  var valor1 = "87.32";
  var valor2 = "Arquivo";
  var valor3 = "65,54";
 
  // vamos exibir os resultados
  document.write(parseFloat(valor1) + "<br>");
  document.write(parseFloat(valor2) + "<br>");
  document.write(parseFloat(valor3));
</script>
  
</body>
</html>

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

87.32
NaN
65

Note que apenas a primeira string pôde ser convertida para um valor fracionário com sucesso.

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como adicionar um ou mais elementos ao início de um vetor JavaScript usando o método unshift() do objeto Array - [Revisado]

Quantidade de visualizações: 7100 vezes

O método unshift(), presente no JavaScript desde sua versão 1.2, é usado quando queremos adicionar um ou mais elementos no início de um vetor (array). Veja:

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

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 4, 5);
  document.write("Valores no vetor: " + valores + "<br>");
  valores.unshift(6);
  document.write("Novos valores no vetor: " + valores);
</script>

Aqui nós adicionamos o valor 6 no início do vetor. Veja agora como adicionar três valores no início do vetor:

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

<script type="text/javascript">
  var valores = new Array(1, 2, 3, 4, 5);
  window.alert("Valores no vetor: " + valores);
  valores.unshift(6, 7, 8);
  window.alert("Novos valores no vetor: " + valores);
</script>

É importante observar que a função unshift() modifica o vetor original, e seu retorno é a nova quantidade de elementos no vetor.

JavaScript ::: DOM (Document Object Model) ::: Eventos JavaScript + DOM (Document Object Model)

Como usar o evento DOMContentLoaded para verificar se o DOM (Document Object Model) já está disponível para manipulação via JavaScript

Quantidade de visualizações: 2183 vezes

Em algumas situações nós precisamos iniciar a manipulação dos elementos de uma página HTML a partir de nossos códigos JavaScript mas não sabemos com certeza se os elementos do DOM (Document Object Model) já estão disponíveis para acesso.

Para essas situações nós podemos usar o evento DOMContentLoaded, que é disparado quando todo o conteúdo DOM já estiver carregado, mesmo que imagens e folhas de estilo CSS ainda estejam pendentes de carregamento.

Vamos ver um exemplo? Considere o código JavaScript abaixo (incluindo o código HTML):

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

<html>
<head>
  <title>Estudos PHP</title>

<script type="text/javascript">
  // vamos obter uma referência ao elemento DIV
  var divElem = document.getElementById("m_div");
  // vamos a cor do texto da DIV
  divElem.style.color = 'blue';
</script>

</head>
 
<body>

<div id="m_div">Sou um elemento DIV</div>

</body>
</html>

Veja que temos um elemento DIV na parte <body> do página e, na parte <head> temos um código JavaScript que tenta alterar a cor do texto da DIV. Como já era de se esperar, ao abrirmos este documento HTM no navegador, teremos o seguinte erro:

Uncaught TypeError: Cannot read property 'style' of null
at index.html:9

Isso aconteceu porque o código JavaScript foi executado antes que o elemento DIV fosse inserido no DOM da página. Para evitar isso, só precisamos usar o evento DOMContentLoaded. Veja a nova versão do código:

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

<html>
<head>
  <title>Estudos PHP</title>

<script type="text/javascript">
  // vamos tratar o evento DOMContentLoaded
  document.addEventListener('DOMContentLoaded', function(e){
    // vamos obter uma referência ao elemento DIV
    var divElem = document.getElementById("m_div");
    // vamos a cor do texto da DIV
    divElem.style.color = 'blue';
  });
</script>

</head>
 
<body>

<div id="m_div">Sou um elemento DIV</div>

</body>
</html>

Agora execute o exemplo novamente e veja como o texto do elemento DIV é colorido de azul, uma boa indicação de que o evento DOMContentLoaded foi disparado com sucesso. Note ainda como usamos o método addEventListener() do objeto document para fazer a associação do evento.

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

Como retornar a quantidade de dias para um determinado mês e ano em JavaScript

Quantidade de visualizações: 8702 vezes

Sempre que estamos desenvolvendo aplicações de calendário ou outras tarefas envolvendo datas e horas em JavaScript nós precisamos saber quantos dias um determinado mês possui.

Nesta dica que mostro como escrever uma função JavaScript chamada diasNoMes() que recebe um mês e um ano e retorna a quantidade de dias que tal mês possui.

Veja a página HTML completa para o exemplo:

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

<!doctype html>
<html>
<head>
  <title>Data e hora em JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // função que recebe um mês e ano e retorna
  // a quantidade de dias no mês informado
  function diasNoMes(mes, ano){
    return 32 - new Date(ano, mes, 32).getDate();
  }
   
  // o mês começa com 0 (Fevereiro = 1)
  document.write("O mês informado possui " + 
    diasNoMes(1, 2023) + " dias");
</script>
  
</body>
</html>

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

O mês informado possui 28 dias

Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

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

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

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

Como encontrar o menor valor em um array de inteiros em JavaScript - Exercícios Resolvidos 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 testar se o argumento de uma função JavaScript é do tipo String - Exercícios Resolvidos de JavaScript

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

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

Veja mais Dicas e truques de JavaScript

Como decodificar uma URL codificada com o método encodeURI

Como obter o valor da constante SQRT2

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

Como obter o logaritmo natural de 10

Como usar a propriedade length do objeto Array para redimensionar uma matriz JavaScript em tempo de execução

Como retornar a quantidade de dias para um determinado mês e ano em JavaScript

Cookies em JavaScript - Como excluir um cookie usando JavaScript

Como calcular o cateto oposto dadas as medidas da hipotenusa e do cateto adjascente em JavaScript

Como calcular a quantidade de dias restantes para uma determinada data em JavaScript

Como criar novos elementos HTML usando o método createElement()

Dicas e truques de outras linguagens

Java - Java Collections - Como adicionar elementos no final de uma LinkedList usando os métodos add() e addLast()

C++ - Como retornar a quantidade de elementos em um vector do C++ usando a função size()

C++ - Como usar a função EnumProcesses() da WinAPI em seus códigos C++ para obter os identificadores de cada processo ativo no Windows

Rust - Como retornar o tamanho de um array em Rust usando a função len()

VisuAlg - Exercícios Resolvidos de VisuAlg - Uma loja está concedendo desconto de 20% para clientes do sexo feminino com idade entre 18 e 35 anos (ambas incluídas)

Python - Como criar um servidor web em Python usando as classes BaseHTTPRequestHandler e HTTPServer

Java - Como transformar em letras maiúsculas as iniciais de cada palavra em uma string Java

Delphi - Como usar a propriedade Items da classe TListBox do Delphi

Java - Como calcular juros simples e composto - Calculando juros simples e montante na linguagem Java

Delphi - Como selecionar um item de uma ListBox do Delphi em tempo de execução usando a propriedade ItemIndex

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 ::: Strings e Caracteres

Como converter uma string em um valor de ponto-flutuante em JavaScript usando a função parseFloat()

JavaScript ::: Dicas & Truques ::: Arrays e Matrix (Vetores e Matrizes)

Como adicionar um ou mais elementos ao início de um vetor JavaScript usando o método unshift() do objeto Array - [Revisado]

JavaScript ::: DOM (Document Object Model) ::: Eventos JavaScript + DOM (Document Object Model)

Como usar o evento DOMContentLoaded para verificar se o DOM (Document Object Model) já está disponível para manipulação via JavaScript

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

Como retornar a quantidade de dias para um determinado mês e ano 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