0

Tenho a necessidade de quebrar uma String(Frase) nos devidos espaços em branco, de forma que seja inserido no lugar do espaço o quebra de linha \n caractere de escape, afim de que este pule linha-a-linha. Veja uma Lógica de exemplo, abaixo:

Casa Bonita

Fica assim:

Casa

Bonita

Para maiores detalhes, veja o que tenho conseguido até o momento, porém desejo que se faça algo a mais...

<script>
    window.onload=function(){
      campo = "Casa Bonita"
       letra = campo.split(" "); // Quebra Linha no Espaço
       for(var i in letra)
      alert(letra[i]);
    }
</script>

Bom, o que é esse algo mais: resultado sendo exibido no alert() linha após linha sucessivamente conforme o tamanho da String(Frase). No entanto, gostaria de pular cada linha utilizando-se o \n e não <br> dentro de um innerHTML();.

1
  • Legal, mas há como ajustar o método sort(); afim de listar as palavras em ordem albética. Se possível, exemplifique como faria.
    – user43817
    7/04/2016 às 16:43

3 Respostas 3

10

você pode usar uma expressão regular para substituir todos os espaços em branco.

var texto = "minha linda casa branca".replace(/\s/g, "\n");
alert(texto);

P.S: \s é o metacharacter para whitespace.

para realizar um sort das palavras, você vai precisar armazanar as palabras em um array, então realizar o sorte e por fim fazer um join.

var texto = "minha linda casa branca";
var palavras = texto.split(" ");
var collator = new Intl.Collator('pt-BR', { sensitivity: "base" });
palavras.sort(function (paravra1, palavra2) {
  return collator.compare(paravra1, palavra2)
})
texto = palavras.join("\n");
alert(texto);

utilizei o Intl.Collator com { sensitivity: "base" }, para que ao comparar as strings, a case e os acentos sejam "ignorados", neste caso a ≠ b, a = á, a = A.

3
  • 1
    Excelente exemplo, apenas uma nota, acho Intl.Collator não é suportado pelo "iOS Webkit" e pelo Safari 9 (Mac), no entanto pode adicionar este repositório como um fallback github.com/andyearnshaw/Intl.js =) - Outra coisa porque não usa assim .split(/\s/);? +1 pra resposta
    – Syzoth
    7/04/2016 às 18:48
  • @GuilhermeNascimento, tinha usando o /\s/g para poder realizar a substituição de todos os espaços, afinal um .replace(" ", "\n") iria substituir apenas a primeira incidencia do " ", quanto ao .split(/\s/), no momento da resposta estava levando em consideração apenas o " ", por isto achei desnecessario usar o /\s/ (a.k.a [\f\n\r\t\v\u00a0\u1680\u180e\u2000\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]) 7/04/2016 às 19:12
  • 1
    "minha linda casa \t branca".replace(/\s/g, "\n"); retorna várias linhas em branco. Se a necessidade do AP é quebrar por palavras da frase, ficaria melhor usando /\s+/g para considerar vários espaçamentos como um só bloco.
    – utluiz
    8/04/2016 às 0:09
1

Boa, a sua contribuição ajudou em cheio, agora posto o meu feito, de modo que fique para futura análise e estudo por parte de outros usuários que assim como eu tiverem as mesma dúvida. Veja:

texto = "Bruna Dora Carla Amanda Emiliana"
letra = texto.split(" ");
letra.sort();
texto = letra.join("\n");
alert(texto);
1
  • 2
    O .split também suporta regex, poderia usar assim .split(/\s/), dessa maneira ele irá considerar o TABs também =)
    – Syzoth
    7/04/2016 às 18:50
1

A solução com função pronta é adequada, mas complemento fazendo diretamente com um for para as pessoas entenderem o mecanismo que está ocorrendo dentro da função.

E a solução do for passa ser mais adequada quando tem mais do que uma letra que deve ser trocada, seja por outras ou por uma única, ou ainda se tiver uma regra um pouco mais complicada. Porque se rodar o replace() várias vezes para cada letra começa ficar ineficiente e o código fica mais longo do que fazendo um laço manualmente. Então fica aqui uma alternativa para quem está aprendendo a programar agora e ainda não percebe quando algo pode ser bom em um contexto e ruim em outro.

As soluções que usam mais de uma função para realizar a tarefa não são boas porque claramente são ineficientes.

var texto = "Casa bonita";
var novoTexto = "";
for (var i = 0; i < texto.length; i++) novoTexto += (texto[i] === " " ? "\n" : texto[i]);
alert(novoTexto);

Coloquei no GitHub para referência futura.

1
  • Agradeço por responder e compartilhar seu conhecimento. 18/10/2022 às 1:59

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .