RegExper: Regular Expressions Explained

Share this article

What does this code snippet do?…

Those with several years development expertise will realize it’s a regular expression. But even the most astute guru will take a few moments to determine that it checks the validity of an email address. Only a superior subset of that group will comprehend that it’s fairly superficial and won’t check all possibilities. Regular expressions are extremely powerful search patterns which can be used for string matching and replacement. They’re supported in the majority of languages including JavaScript, PHP, Perl, Java, C#, Python and Ruby. Individual rules are normally straight-forward, e.g. [a-z] matches a single lowercase character and c.t matches a three letter string starting with ‘c’ and ending with ‘t’ — such as ‘cat’. However, when rules are combined, an indecipherable string of seemingly random codes starts to appear. The one above is relatively simple compared to many you’ll find in the wild. Creating your own regular expressions is difficult enough and many of us resort to using the force. But it’s easy compared to parsing someone else’s code — which is normally written by someone who has an irrational aversion to comments!
Fortunately, Jeff Avallone has created a solution to your regex woes. RegExper transforms meaningless JavaScript-based expressions into a graphical representation: Regexper Admittedly, you’ll still need a reasonable understanding of pattern matching, but it’s far more evident the expression is analyzing an email address. Behind the scenes, RegExper is a Ruby application which translates regular expressions into an SVG image. The SVG is embedded in the page, but it should be possible to extract or copy it for use in your own documentation. If you’d like to make improvements or automate the process, the project is open source and available to download or fork from RegExper
is incredibly clever. While there are plenty of tools to help you devise and test regular expressions, very few allow you to parse or reverse-engineer existing code. I’ve not found any which does it quite so prettily either. Add RegExper to your toolkit and you’ll be parsing regular expressions with renewed enthusiasm. Probably.

Frequently Asked Questions about Regexper and Regular Expressions

What is Regexper and how does it work?

Regexper is an online tool that provides a visual representation of regular expressions. It works by taking a regular expression as input and generating a graphical diagram that represents the pattern. This makes it easier to understand complex regular expressions. The tool supports all standard regular expression syntax and can be used to test and debug regular expressions.

How can I use Regexper to understand a complex regular expression?

To use Regexper to understand a complex regular expression, simply enter the regular expression into the input field on the Regexper homepage. The tool will then generate a graphical diagram that represents the pattern. This diagram can be used to understand the structure and function of the regular expression.

Can Regexper be used to generate regular expressions?

No, Regexper is not designed to generate regular expressions. It is a tool for visualizing and understanding existing regular expressions. If you need to generate a regular expression, there are other tools and resources available online that can help with this.

What is a regular expression and what is it used for?

A regular expression is a sequence of characters that forms a search pattern. It can be used for various tasks such as searching for specific patterns in text, replacing text, and validating input. Regular expressions are widely used in programming and text processing.

Can a regular expression be reverse-engineered to output each of its patterns into a list?

In theory, it is possible to reverse-engineer a regular expression to output each of its patterns into a list. However, this would be a complex task and would require a deep understanding of regular expression syntax and semantics. It is generally more practical to analyze the regular expression using a tool like Regexper.

How can I learn more about regular expressions?

There are many resources available online for learning about regular expressions. These include tutorials, guides, and reference materials. Additionally, tools like Regexper can be used to practice and improve your understanding of regular expressions.

Are there any limitations to using Regexper?

Regexper is a powerful tool for visualizing regular expressions, but it does have some limitations. For example, it cannot generate regular expressions, and it may not be able to accurately represent extremely complex regular expressions. However, for most common use cases, Regexper is a very useful tool.

Can Regexper be used offline?

No, Regexper is a web-based tool and requires an internet connection to use. However, the source code for Regexper is available on GitHub, so it is possible to download and run the tool locally if desired.

Is Regexper free to use?

Yes, Regexper is a free tool. It is open-source and the source code is available on GitHub for anyone to use or modify.

Can Regexper be used with any programming language?

Regexper is designed to work with regular expressions from any programming language that supports them. However, there may be some differences in regular expression syntax and semantics between different languages, so it is important to be aware of these when using Regexper.

Craig BucklerCraig Buckler
View Author

Craig is a freelance UK web consultant who built his first page for IE2.0 in 1995. Since that time he's been advocating standards, accessibility, and best-practice HTML5 techniques. He's created enterprise specifications, websites and online applications for companies and organisations including the UK Parliament, the European Parliament, the Department of Energy & Climate Change, Microsoft, and more. He's written more than 1,000 articles for SitePoint and you can find him @craigbuckler.

javascriptregular expressions
Share this article
Read Next
Get the freshest news and resources for developers, designers and digital creators in your inbox each week
Loading form