Shorten string without cutting words in JavaScript

Question

I m not very good with string manipulation in JavaScript  and I was wondering how you would go about shortening a string without cutting any word off  I know how to use substring  but not indexOf or anything really well   Say I had the following string   text    this is a long string I cant display    I want to trim it down to 10 characters  but if it doesn t end with a space  finish the word  I don t want the string variable to look like this       this is a long string I cant dis    I want it to finish the word until a space occurs

User · Answer

I m late to the party  but here s a small and easy solution I came up with to return an amount of words    It s not directly related to your requirement of characters  but it serves the same outcome that I believe you were after   function truncateWords sentence  amount  tail      const words   sentence split          if  amount  gt   words length        return sentence         const truncated   words slice 0  amount     return    truncated join        tail       const sentence    Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium  totam rem aperiam  eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo     console log truncateWords sentence  10             See the working example here  https   jsfiddle net bx7rojgL

User · Answer

we can do this easily by using truncate function of lodash   truncate  hi-diddly-ho there  neighborino         gt   hi-diddly-ho there  neighbo        truncate  hi-diddly-ho there  neighborino        length   24     separator                 gt   hi-diddly-ho there       go on Lodash Documentation for more clearence

User · Answer

Here s a one-line version with a few useful properties   Handles any form of space matched by the  s regex Performs independent of input length  anything past the max length is not scanned  Performs independent of output length  scans backward from max length and doesn t split join the string   s length  gt  maxLen   s substring 0  s substring 0  maxLen   1  search   s  S        s

User · Answer

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  lt   maxLen  return str    return str substr 0  str lastIndexOf separator  maxLen        This is a sample output   for  var i   0  i  lt  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  lt  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

User · Answer

I took a different approach   While I needed a similar result I wanted to keep my return value less than the specified length   function wordTrim value  length  overflowSuffix        value   value trim        if  value length  lt   length  return value      var strAry   value split           var retString   strAry 0       for  var i   1  i  lt  strAry length  i              if  retString length  gt   length    retString length   strAry i  length   1  gt  length  break          retString          strAry i             return retString    overflowSuffix             Edit I refactored it a bit here   JSFiddle Example   It rejoins the original array instead of concatenating     function wordTrim value  length  overflowSuffix        if  value length  lt   length  return value      var strAry   value split           var retLen   strAry 0  length      for  var i   1  i  lt  strAry length  i              if retLen    length    retLen   strAry i  length   1  gt  length  break          retLen   strAry i  length   1           return strAry slice 0 i  join         overflowSuffix

User · Answer

Pasta with tomato and spinach    if you do not want to cut the word in half  first iteration   acc 0   acc  cur length   5   newTitle     Pasta     second iteration   acc 5   acc   cur length   9   newTitle     Pasta    with     third iteration   acc 9   acc   cur length   15   newTitle     Pasta    with    tomato     fourth iteration   acc 15   acc   cur length   18 limit bound    newTitle     Pasta    with    tomato     const limitRecipeTitle    title  limit 17   gt       const newTitle           if title length gt limit           title split      reduce  acc  cur   gt               if acc cur length  lt   limit                   newTitle push cur                             return acc cur length            0              return    newTitle join                output  Pasta with tomato

User · Answer

Here s yet another piece of code that truncates along punctuation marks  was looking for this and Google found this question here   Had to come up with a solution on my own  so this is what I hacked in 15 minutes  Finds all occurrences of       and truncates at any position of these that s  lt  than len  function pos str  char        let pos   0     const ret          while    pos   str indexOf char  pos   1      -1            ret push pos            return ret    function truncate str  len        if  str length  lt  len          return str      const allPos         pos str           pos str           pos str        sort   a b    gt  a-b       if  allPos length     0            return str substr 0  len             for let i   0  i  lt  allPos length  i              if  allPos i   gt  len                return str substr 0  allPos i-1    1                     module exports   truncate

User · Answer

You can trim spaces with this   var trimmedString   flabbyString replace    s      s       1

User · Answer

If you  already  using a lodash library  there is a function called truncate which can be used for trimming the string  Based on the example on the docs page   truncate  hi-diddly-ho there  neighborino        length   24     separator                gt   hi-diddly-ho there

User · Answer

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    lt pre gt   lt script gt  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     lt  script gt    Output   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

User · Answer

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 and re-trim only when necessary  prevent re-trim when string is shorted than maxLength  it causes last word cut   if yourString length  gt  trimmedString length         trim the string to the maximum length     var trimmedString   yourString substr 0  maxLength          re-trim if we are in the middle of a word and      trimmedString   trimmedString substr 0  Math min trimmedString length  trimmedString lastIndexOf

User · Answer

Typescript  and with ellipses     export const sliceByWord    phrase  string  length  number  skipEllipses   boolean   string   gt      if  phrase length  lt  length  return phrase   else       let trimmed   phrase slice 0  length      trimmed   trimmed slice 0  Math min trimmed length  trimmed lastIndexOf            return skipEllipses   trimmed   trimmed

User · Answer

This excludes the final word instead of including it   function smartTrim str  length  delim  appendix        if  str length  lt   length  return str       var trimmedStr   str substr 0  length delim length        var lastDelimIndex   trimmedStr lastIndexOf delim       if  lastDelimIndex  gt   0  trimmedStr   trimmedStr substr 0  lastDelimIndex        if  trimmedStr  trimmedStr    appendix      return trimmedStr      Usage   smartTrim yourString  11                The quick

User · Answer

Everyone seems to forget that indexOf takes two arguments- the string to match  and the character index to start looking from  You can break the string at the first space after 10 characters   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

User · Answer

Based on NT3RP answer which does not handle some corner cases  I ve made this code  It guarantees to not return a text with a size   maxLength event an ellipsis     was added at the end   This also handle some corner cases like a text which have a single word being   maxLength  shorten  function text maxLength options        if   text length  lt   maxLength             return text            if    options   options           var defaultOptions                By default we add an ellipsis at the end         suffix  true          suffixString                     By default we preserve word boundaries         preserveWordBoundaries  true          wordSeparator                   extend options  defaultOptions          Compute suffix to use  eventually add an ellipsis      var suffix           if   text length  gt  maxLength  amp  amp  options suffix            suffix   options suffixString                Compute the index at which we have to cut the text     var maxTextLength   maxLength - suffix length      var cutIndex      if   options preserveWordBoundaries                We use  1 because the extra char is either a space or will be cut anyway            This permits to avoid removing an extra word when there s a space at the maxTextLength index         var lastWordSeparatorIndex   text lastIndexOf options wordSeparator  maxTextLength 1              We include 0 because if have a  very long first word   size  gt  maxLength   we still don t want to cut it            But just display        But in this case the user should probably use preserveWordBoundaries false            cutIndex   lastWordSeparatorIndex  gt  0   lastWordSeparatorIndex   maxTextLength        else           cutIndex   maxTextLength             var newText   text substr 0 cutIndex       return newText   suffix      I guess you can easily remove the jquery dependency if this bothers you

User · Answer

Didn t find the voted solutions satisfactory  So I wrote something thats is kind of generic and works both first and last part of your text  something like substr but for words   Also you can set if you d like the spaces to be left out in the char-count       function chopTxtMinMax txt  firstChar  lastChar 0           var wordsArr   txt split               var newWordsArr                var totalIteratedChars   0          var inclSpacesCount   true           for var wordIndx in wordsArr               totalIteratedChars    wordsArr wordIndx  length    inclSpacesCount   1   0               if totalIteratedChars  gt   firstChar  amp  amp   totalIteratedChars  lt   lastChar    lastChar  0                    newWordsArr push wordsArr wordIndx                                     txt   newWordsArr join               return txt

User · Answer

Updated from  NT3RP I found that if the string happens to hit a space first time around it will end up deleting that word making your string one word shorter than it can be  So I just threw in an if else statement to check that the maxLength doesn t fall on a space   codepen io  var yourString    The quick brown fox jumps over the lazy dog     replace with your string  var maxLength   15    maximum number of characters to extract  if  yourString maxLength                trim the string to the maximum length var trimmedString   yourString substr 0  maxLength    alert trimmedString     re-trim if we are in the middle of a word trimmedString   trimmedString substr 0  Math min trimmedString length  trimmedString lastIndexOf           else     var trimmedString   yourString substr 0  maxLength      alert trimmedString

User · Answer

For what it s worth I wrote this to truncate to word boundary without leaving punctuation or whitespace at the end of the string    x000D   x000D  function truncateStringToWord str  length  addEllipsis  x000D    x000D      if str length  lt   length  x000D        x000D             provided string already short enough x000D          return str   x000D        x000D   x000D         cut string down but keep 1 extra character so we can check if a non-word character exists beyond the boundary x000D      str   str substr 0  length 1   x000D   x000D         cut any non-whitespace characters off the end of the string x000D      if      s     test str   x000D        x000D          str   str replace     s           x000D        x000D   x000D         cut any remaining non-word characters x000D      str   str replace     w           x000D   x000D      var ellipsis   addEllipsis  amp  amp  str length  gt  0     amp hellip         x000D   x000D      return str   ellipsis   x000D    x000D   x000D  var testString    hi stack overflow  how are you  Spare   x000D  var i   testString length  x000D   x000D  document write   lt strong gt Without ellipsis  lt  strong gt  lt br gt     x000D   x000D  while i  gt  0  x000D    x000D    document write i        truncateStringToWord testString  i      lt br gt     x000D    i--  x000D    x000D   x000D  document write   lt strong gt With ellipsis  lt  strong gt  lt br gt     x000D   x000D  i   testString length  x000D  while i  gt  0  x000D    x000D    document write i        truncateStringToWord testString  i  true      lt br gt     x000D    i--  x000D    x000D   x000D   x000D

User · Answer

Lodash has a function specifically written for this    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

User · Answer

You can use truncate one-liner below    x000D   x000D  const text    The string that I want to truncate    x000D   x000D  const truncate    str  len    gt  str substring 0   str        lastIndexOf      len    x000D   x000D  console log truncate text  14    x000D   x000D   x000D

User · Answer

function shorten str n      return  str match RegExp      n     S       str   0      shorten  Hello World   3       Hello     x000D   x000D     SHORTEN STRING TO WHOLE WORDS x000D  function shorten s l    x000D    return  s match new RegExp      l     S       s   0   x000D    x000D   x000D  console log  shorten  The quick brown fox jumps over the lazy dog   6         The quick  x000D   x000D   x000D

User · Answer

Here is a solution in one line     x000D   x000D  text    this is a long string I cant display  x000D   x000D  function shorten text max    x000D      return text  amp  amp  text length  gt  max   text slice 0 max  split      slice 0  -1  join        text x000D    x000D   x000D   x000D  console log shorten text 10    x000D   x000D   x000D

User · Answer

shorten str  maxLen  appendix  separator          if  str length  lt   maxLen  return str  let strNope   str substr 0  str lastIndexOf separator  maxLen    return  strNope    appendix        var s   this is a long string and I cant explain all   shorten s  10              this is

User · Answer

I came late for this but I think this function makes exactly what OP requests  You can easily change the SENTENCE and the LIMIT values for different results    x000D   x000D  function breakSentence word  limit    x000D    const queue   word split       x000D    const list       x000D   x000D    while  queue length    x000D      const word   queue shift    x000D   x000D      if  word length  gt   limit    x000D        list push word  x000D        x000D      else   x000D        let words   word  x000D   x000D        while  true    x000D          if   queue length    x000D              words length  gt  limit    x000D              words length   queue 0  length   1  gt  limit    x000D            break  x000D            x000D   x000D          words          queue shift    x000D          x000D   x000D        list push words   x000D        x000D      x000D   x000D    return list  x000D    x000D   x000D  const SENTENCE    the quick brown fox jumped over the lazy dog   x000D  const LIMIT   11  x000D   x000D     get result x000D  const words   breakSentence SENTENCE  LIMIT   x000D   x000D     transform the string so the result is easier to understand x000D  const wordsWithLengths   words map  item    gt    x000D    return     item   has a length of -   item length    x000D      x000D   x000D  console log wordsWithLengths   x000D   x000D   x000D    The output of this snippet is where the LIMIT is 11 is       the quick  has a length of - 9       brown fox  has a length of - 9       jumped over  has a length of - 11       the lazy  has a length of - 8       dog  has a length of - 3

User · Answer

With boundary conditions like empty sentence and very long first word  Also  it uses no language specific string api library    x000D   x000D  function solution message  k    x000D      if  message   x000D          return       when message is empty x000D        x000D      const messageWords   message split       x000D      let result   messageWords 0   x000D      if result length gt k   x000D          return       when length of first word itself is greater that k x000D        x000D      for let i   1  i lt messageWords length  i     x000D          let next   result         messageWords i   x000D   x000D          if next length lt  k   x000D              result   next  x000D           else  x000D              break  x000D            x000D        x000D      return result  x000D    x000D   x000D  console log solution  this is a long string i cant display   10    x000D   x000D   x000D

[javascript] Shorten string without cutting words in JavaScript

Examples related to javascript

Examples related to string

Examples related to substring