Shorten string without cutting words in JavaScript Shorten string without cutting words in JavaScript javascript javascript

Shorten string without cutting words in JavaScript


If I understand correctly, you want to shorten a string to a certain length (e.g. shorten "The quick brown fox jumps over the lazy dog" to, say, 6 characters without cutting off any word).

If this is the case, you can try something like the following:

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 lengthvar trimmedString = yourString.substr(0, maxLength);//re-trim if we are in the middle of a wordtrimmedString = trimmedString.substr(0, Math.min(trimmedString.length, trimmedString.lastIndexOf(" ")))


There are lots of ways to do it, but a regular expression is a useful one line method:

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

This expressions returns the first 11 (any) characters plus any subsequent non-space characters.

Example 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>

Output:

1:   this2:   this5:   this is11:  this is a longish20:  this is a longish string100: this is a longish string of text


I am kind of surprised that for a simple problem like this there are so many answers that are difficult to read and some, including the chosen one, do not work .

I usually want the result string to be at most maxLen characters. I also use this same function to shorten the slugs in URLs.

str.lastIndexOf(searchValue[, fromIndex]) takes a second parameter that is the index at which to start searching backwards in the string making things efficient and simple.

// 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));}

This is a sample output:

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"

And for the slug:

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"