Raccourcir une chaîne de caractères sans couper de mots en JavaScript

Question

Je ne suis pas très doué pour la manipulation de chaînes de caractères en JavaScript, et je me demandais comment on pouvait raccourcir une chaîne de caractères sans couper de mot. Je sais comment utiliser substring, mais pas indexOf ou quoi que ce soit d'autre.

Supposons que je dispose de la chaîne suivante :

text = "this is a long string I cant display"

Je veux le réduire à 10 caractères, mais s'il ne se termine pas par un espace, terminez le mot. Je ne veux pas que la variable chaîne ressemble à ceci :

"C'est une longue ficelle que je ne peux pas rompre.

Je veux qu'il termine le mot jusqu'à ce qu'un espace se produise.

Answer 1

Si je comprends bien, vous souhaitez raccourcir une chaîne à une certaine longueur (par exemple, raccourcir "The quick brown fox jumps over the lazy dog" à, disons, 6 caractères sans couper aucun mot).

Si c'est le cas, vous pouvez essayer quelque chose comme ce qui suit :

var yourString = "The quick brown fox jumps over the lazy dog"; //replace with your string.
var maxLength = 6 // maximum number of characters to extract

//trim the string to the maximum length
var trimmedString = yourString.substr(0, maxLength);

//re-trim if we are in the middle of a word
trimmedString = trimmedString.substr(0, Math.min(trimmedString.length, trimmedString.lastIndexOf(" ")))

Answer 2

Il existe de nombreuses façons de procéder, mais une expression régulière est une méthode utile en une seule ligne :

"this is a longish string of text".replace(/^(.{11}[^\s]*).*/, "$1"); 
//"this is a longish"

Cette expression renvoie les 11 premiers caractères (au choix) et tous les caractères suivants qui ne sont pas des espaces.

Exemple script :

<pre>
<script>
var t = "this is a longish string of text";

document.write("1:   " + t.replace(/^(.{1}[^\s]*).*/, "$1") + "\n");
document.write("2:   " + t.replace(/^(.{2}[^\s]*).*/, "$1") + "\n");
document.write("5:   " + t.replace(/^(.{5}[^\s]*).*/, "$1") + "\n");
document.write("11:  " + t.replace(/^(.{11}[^\s]*).*/, "$1") + "\n");
document.write("20:  " + t.replace(/^(.{20}[^\s]*).*/, "$1") + "\n");
document.write("100: " + t.replace(/^(.{100}[^\s]*).*/, "$1") + "\n");
</script>

Sortie :

1:   this
2:   this
5:   this is
11:  this is a longish
20:  this is a longish string
100: this is a longish string of text

Answer 3

Je suis un peu surpris que pour un problème aussi simple, il y ait autant de réponses difficiles à lire et que certaines, y compris celle choisie, ne fonctionnent pas.

Je souhaite généralement que la chaîne de résultats soit au maximum maxLen caractères. J'utilise également cette même fonction pour raccourcir les slugs dans les URL.

str.lastIndexOf(searchValue[, fromIndex]) prend un second paramètre qui est l'index à partir duquel la recherche doit commencer à l'envers dans la chaîne de caractères, ce qui rend les choses efficaces et simples.

// Shorten a string to less than maxLen characters without truncating words.
function shorten(str, maxLen, separator = ' ') {
  if (str.length <= maxLen) return str;
  return str.substr(0, str.lastIndexOf(separator, maxLen));
}

Il s'agit d'un exemple de sortie :

for (var i = 0; i < 50; i += 3) 
  console.log(i, shorten("The quick brown fox jumps over the lazy dog", i));

 0 ""
 3 "The"
 6 "The"
 9 "The quick"
12 "The quick"
15 "The quick brown"
18 "The quick brown"
21 "The quick brown fox"
24 "The quick brown fox"
27 "The quick brown fox jumps"
30 "The quick brown fox jumps over"
33 "The quick brown fox jumps over"
36 "The quick brown fox jumps over the"
39 "The quick brown fox jumps over the lazy"
42 "The quick brown fox jumps over the lazy"
45 "The quick brown fox jumps over the lazy dog"
48 "The quick brown fox jumps over the lazy dog"

Et pour la limace :

for (var i = 0; i < 50; i += 10) 
  console.log(i, shorten("the-quick-brown-fox-jumps-over-the-lazy-dog", i, '-'));

 0 ""
10 "the-quick"
20 "the-quick-brown-fox"
30 "the-quick-brown-fox-jumps-over"
40 "the-quick-brown-fox-jumps-over-the-lazy"

Answer 4

Tout le monde semble oublier que indexOf prend deux arguments - la chaîne à faire correspondre et l'indice du caractère à partir duquel il faut commencer à chercher. Vous pouvez interrompre la chaîne au premier espace après 10 caractères.

function cutString(s, n){
    var cut= s.indexOf(' ', n);
    if(cut== -1) return s;
    return s.substring(0, cut)
}
var s= "this is a long string i cant display";
cutString(s, 10)

/*  returned value: (String)
this is a long
*/

Answer 5

Lodash dispose d'une fonction spécialement conçue à cet effet : _.truncate

const truncate = _.truncate
const str = 'The quick brown fox jumps over the lazy dog'

truncate(str, {
  length: 30, // maximum 30 characters
  separator: /,?\.* +/ // separate by spaces, including preceding commas and periods
})

// 'The quick brown fox jumps...'