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

Como inverter a ordem dos caracteres das palavras de uma string em JavaScript usando as funções map(), split(), reverse() e join()

Quantidade de visualizações: 489 vezes
O código que mostrarei nessa dica é muito interessante e abre a possibilidade para a criação de algorítmos muito úteis. Trata-se de inverter a ordem dos caracteres das palavras de uma frase ou texto. Para isso faremos uso das funções map(), split(), reverse() e join() do JavaScript.

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>Strings em JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // vamos criar uma string
  var frase = "GOSTO MUITO DE JAVA";
  document.write("A frase é: " + frase + "<br>");
  
  // agora vamos inverter os caracteres de cada
  // uma das palavras na frase
  var frase = frase.split(" ").map(palavra => 
    palavra.split("").reverse().join("")).join(" ");
	
  // e mostramos o resultado
  document.write("Com palavras invertidas: " + frase);  
</script>
  
</body>
</html>

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

A frase é: GOSTO MUITO DE JAVA
Com palavras invertidas: OTSOG OTIUM ED AVAJ

Link para compartilhar na Internet ou com seus amigos:

JavaScript ::: Dicas & Truques ::: Geometria, Trigonometria e Figuras Geométricas

Como testar se um ponto está dentro de um círculo em JavaScript - Desenvolvimento de Games com JavaScript

Quantidade de visualizações: 1482 vezes
Quando estamos trabalhando com computação gráfica, geometria e trigonometria ou desenvolvimento de jogos em JavaScript, é comum precisarmos verificar se um determinado ponto (uma coordenada x, y) está contido dentro de um círculo.

Para melhor entendimento, veja a imagem a seguir:



Veja que temos um círculo com raio igual a 115 e com centro nas coordenadas (x = 205; y = 166). Temos também dois pontos. O ponto vermelho está nas coordenadas (x = 140; y = 90) e o ponto azul está nas coordenadas (x = 330; y = 500.

Como podemos ver na imagem, o ponto vermelho está dentro do círculo, enquanto o ponto azul está fora. E nosso intenção nesta dica é escrever o código JavaScript que permite fazer essa verificação. Tenha em mente que está técnica é muito útil para o teste de colisões no desenvolvimento de games.

Veja o código completo 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>Desenvolvimento de Games usando HTML5 e JavaScript</title>
</head>
<body>

<script type="text/javascript">
  // vamos declarar a classe Circulo
  class Circulo{
    constructor(xc, yc, raio){
      this.xc = xc; // x do centro
      this.yc = yc; // y do centro
      this.raio = raio; // raio do círculo
    }
  }
  
  // agora vamos declarar a classe Ponto
  class Ponto{
    constructor(x, y){
      this.x = x; // coordenada x
      this.y = y; // coordenada y	
    }
  }
  
  // vamos criar um objeto Circulo
  var c = new Circulo(90, 50, 115);
  // vamos criar um objeto Ponto
  var p = new Ponto(140, 90);
  
  // vamos verificar se o ponto está dentro do
  // círculo
  var dx = p.x - c.xc;
  var dy = p.y - c.yc;
  if((Math.pow(dx, 2) + Math.pow(dy, 2)) < Math.pow(c.raio, 2)){
    document.writeln("O ponto está dentro do círculo");  
  }
  else{
    document.writeln("O ponto NÃO está dentro do círculo");  
  }
</script>
  
</body>
</html>

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

O ponto está dentro do círculo.

Experimente com círculos de raios e coordenadas centrais diferentes e também com pontos em várias coordenadas e veja como os resultados são interessantes.


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

Como retornar apenas os três primeiros elementos de um array em JavaScript usando a função slice() do objeto Array

Quantidade de visualizações: 8705 vezes
Nesta dica eu mostrarei como é possível usar o método slice() do objeto Array da linguagem JavaScript para retornar um ou mais elementos de um vetor, como um novo objeto array.

Para isso só precisamos fornecer ao método o índice inicial e o índice final (não incluindo) dos elementos a serem retornados. É importante observar que o método slice() não modifica o vetor original.

Veja o exemplo completo:

----------------------------------------------------------------------
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">
  var valores = new Array(1, 2, 3, 4, 5, 6, 7);
  document.write("Valores no vetor: " + valores + "<br>");
  document.write("Retornando os três primeiros elementos<br>");
  var valores2 = valores.slice(0, 3);
  document.write("Valores no novo vetor: " + valores2);
</script>
 
</body>
</html>

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

Valores no vetor: 1,2,3,4,5,6,7
Retornando os três primeiros elementos
Valores no novo vetor: 1,2,3


JavaScript ::: Dicas & Truques ::: Matemática e Estatística

Como calcular Fatorial em JavaScript usando recursão - Como calcular Fatorial usando recursividade - Aprenda a calcular Fatorial usando JavaScript

Quantidade de visualizações: 17105 vezes
Embora existam várias formas de efetuar o cálculo de Fatorial, a forma mais comum é usando recursividade, ou seja, dividir a resolução do problema em partes menores e juntá-las no final.

Neste dica eu mostro como calcular Fatorial em JavaScript usando recursividade. Veja o código completo:

----------------------------------------------------------------------
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>
 
<script type="text/javascript">
  function fatorial(num){
    if(num > 1)
      return num * arguments.callee(num - 1);
    else 
      return 1;
  }
</script>
 
</head>
<body>
 
<script type="text/javascript">
  document.write("O fatorial de 5 é: " + fatorial(5));
</script>
 
</body>
</html>

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

O fatorial de 5 é: 120


Desafios, Exercícios e Algoritmos Resolvidos de JavaScript

Veja mais Dicas e truques de JavaScript

Dicas e truques de outras linguagens

Códigos Fonte

Programa de Gestão Financeira Controle de Contas a Pagar e a Receber com Cadastro de Clientes e FornecedoresSoftware 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 funcionalidadesControle 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: Delphi
6º lugar: C
7º lugar: JavaScript
8º lugar: C++
9º lugar: VB.NET
10º lugar: Ruby



© 2025 Arquivo de Códigos - Todos os direitos reservados
Neste momento há 23 usuários muito felizes estudando em nosso site.