Skip to main content

Duck Punching jQuery's Trim Method

04-03-11 Rob Tarr

Modifying jQuery.trim to accept other characters besides just whitespace. By doing this in your code, your changes will persist, even when upgrading to a different jQuery version.

I was recently working on a project and needed to pull off the leading and trailing ‘/’ (if present) of a URL fragment. Since there’s no built-in trim method in Javascript, and the jQuery $.trim method only removes leading and trailing whitespace, I decided to punch a duck.

Duck punching is simply a method to add functionality to the language without actually modifying the language. Sure, you could just dig into the jQuery core files, and modify the trim method, but what do you do then when 1.5.1 becomes 1.5.2, or jumps to 1.6? If you modified the core files, you have to continue to modify the core every time you update it. If you make the change in your own file, by extending jQuery, your change will persist across jQuery updates.

So, I added this code at the top of my application.js file:

  
    (function($) {
      $.trim = function(str, replace) {
        replace = replace || '\\s';
        return str.replace(new RegExp('^' + replace + '*([\\S\\s]*?)' + replace + '*$'), '$1');
      };
    })(jQuery);

Line 1:

The start of an Immediately-Invoked Function Expression (IIFE).

Line 2:

Replace the jQuery trim method with this modified version.

Line 3:

If nothing was passed in to match, default to trimming whitespace. This will mimic the default behavior of $.trim().

Line 4:

Match str to the new regular expression, removing the replace variable from the beginning and end of str.

Consider the duck punched!

That’s it. You can now call jQuery’s trim method like this:

  
    $.trim('  string to trim  ');    // result: 'string to trim'
    $.trim('/portion/of/url/','\/')  // result: 'portion/of/url'

Sounds like a duck, quacks like a duck, must be a duck.

Related Content

User-Centered Thinking: 7 Things to Consider and a Free Guide

Want the benefits of UX but not sure where to start? Grab our guide to evaluate your needs, earn buy-in, and get hiring tips.

More Details

See Everything In

Want to talk about how we can work together?

Katie can help

A portrait of Vice President of Business Development, Katie Jennings.

Katie Jennings

Vice President of Business Development