Trimming Strings; Stripping Text in JavaScript

Strings are one of the most basic structures in any development language. Developing with strings happens in common ways across languages. Sometimes languages don’t offer the common gamut of tools and leave the developer to implement their own methods. One of these cases occurs with a proper strip method in JavaScript. JavaScript added the String.Trim[1] with EcmaScript5, which is a specialized version of a generic strip, so that leaves developers to implement it themselves.

If you’ve written Python, you are most likely familiar with the Python strip method[2]. In Java, trim does not have a native implementation. Rely instead on the trusty Apache Commons StringUtils package for an equivalent trim method, but also for the strip method[3]. PHP has the trim method[4], but the method’s signature is the same as the Python strip method, so it’s only a trim by default. In JavaScript, some major libraries, like jQuery, have already poly-filled the trim method in case the browser is missing the native function. Other utility libraries, like LoDash and Underscore, however are devoid of trim unless further extensions are included like Underscore.string, which also has strip[7].

Stripping text is the removal of characters from both sides of a string that match the pattern given. Generally stripping text without telling it what characters to look for will cause whitespace characters except for newlines to be removed. If you are dealing with strings, especially text driven from user input, strip will become something you find necessary for tasks like validation, matching, caching and tracking keywords.

Regardless, the generally more powerful strip method is missing in JavaScript.

Implementing strip is easy in JavaScript; the hard part is getting it efficient. It should be as fast as trim, but also fast to remove any character. Many implementations also implement lstrip and rstrip to target one side of the string or the other. I’ll leave that for the advanced user.

https://gist.github.com/geedew/58d6b79a4525d27a774b

The first part of my strip method is to validate if any characters were passed in. If nothing was passed through, then we assume a trim was wanted, and if trim is implemented by the browser, just use that method and do an early return. Otherwise, if trim is not implemented, set the characters to an effective trim of whitespace characters.

The next step of the function is to be a little proactive with the characters that we are allowing. Escaping characters that might break the RegExp is a required step.

Finally the function uses a RegExp to target the beginning and end of the string with the characters given and replaces them with nothing. It’s that simple, but powerful.

Further Reading

  1. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trim
  2. https://docs.python.org/2/library/string.html#string.strip
  3. https://commons.apache.org/)
  4. https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/trim
  5. http://us2.php.net/manual/en/function.trim.php
  6. http://epeli.github.io/underscore.string/#home
  7. https://github.com/epeli/underscore.string/blob/master/trim.js
  8. Performance differences
  9. Polyfilling Trim methods