String Regular Expressions with MooTools

By  on  

Whether you like given JavaScript library or not , there are always snippets you can take from the code which accomplish a task you may need to address.  We all know that I looooooove MooTools, but maybe you're a Dojo or jQuery developer that doesn't get a good look at Moo.  The following are a choice selection of regular expression used with MooTools -- maybe you have use for them?

Clean Whitespace

var newString = myString.replace(/^\s+|\s+$/g, '');

Camel-Case a Dash-Separated String

var newString = myString.replace(/-\D/g, function(match){
	return match.charAt(1).toUpperCase();
});

Dash-Separate a Camel-Cased String

var newString = myString.replace(/[A-Z]/g, function(match){
	return ('-' + match.charAt(0).toLowerCase());
});

Escape a Regular Expression

var newString = myString.replace(/([-.*+?^${}()|[\]\/\\])/g, '\\$1');

Hex to RGB, RGB to Hex

var hex = myString.match(/^#?(\w{1,2})(\w{1,2})(\w{1,2})$/);
var newString = (hex) ? hex.slice(1).hexToRgb(array) : null;

Term Substitution

var newString = this.replace(regexp || (/\\?\{([^{}]+)\}/g), function(match, name){
	if (match.charAt(0) == '\\') return match.slice(1);
	return (object[name] != undefined) ? object[name] : '';
});

Strip Scripts from a String

var newString = myString.replace(/<script[^>]*>([\s\S]*?)<\/script>/gi, function(all, code){
	scripts += code + '\n';
	return '';
});

Above are just a sampling of regular expression used by MooTools to accomplish tasks.  Most, in fact, are applied as methods to the String native so they are available with *ANY* string!

Recent Features

  • By
    LightFace:  Facebook Lightbox for MooTools

    One of the web components I've always loved has been Facebook's modal dialog.  This "lightbox" isn't like others:  no dark overlay, no obnoxious animating to size, and it doesn't try to do "too much."  With Facebook's dialog in mind, I've created LightFace:  a Facebook lightbox...

  • By
    fetch API

    One of the worst kept secrets about AJAX on the web is that the underlying API for it, XMLHttpRequest, wasn't really made for what we've been using it for.  We've done well to create elegant APIs around XHR but we know we can do better.  Our effort to...

Incredible Demos

  • By
    Create a NoScript Compatible Select Form Element with an onChange Event

    I wouldn't say that I'm addicted to checking Google Analytics but I do check my statistics often. I guess hoping for a huge burst of traffic from some unknown source. Anyway, I have multiple sites set up within my account. The way to...

  • By
    9 Incredible CodePen Demos

    CodePen is a treasure trove of incredible demos harnessing the power of client side languages.   The client side is always limited by what browsers provide us but the creativity and cleverness of developers always pushes the boundaries of what we think the front end can do.  Thanks to CSS...

Discussion

  1. Jeffrey

    Technologies will come and go – one library will find favor over the one you are currently using, one scripting language will arise that will make the one you are using look foolish, etc. But regular expressions are one of those things that will be a useful thing to know even on the tumultuous seas of techno-change.

    Good little article – make it a series. A cache of tested regular expressions to crib from is a useful thing to have.

    • Hear, hear!

      Perl was the first programming language I ever learned, so Regular Expressions have always been a primary tool I’ve used no matter the language. I just don’t know what I’d do without them!

      ^_^

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!