Collectives™ on Stack Overflow

Find centralized, trusted content and collaborate around the technologies you use most.

Teams

Q&A for work

Connect and share knowledge within a single location that is structured and easy to search.

I'm reading Sitepoints 2007 book "Simply Javascript" and I encountered some code I just can't understand.

It's the following code:

Core.removeClass = function(target, theClass)
    var pattern = new RegExp("(^| )" + theClass + "( |$)");
    target.className = target.className.replace(pattern, "$1");
    target.className = target.className.replace(/ $/, "");
The first call to the replace method is what puzzles me, I don't understand where the "$1" value comes from or what it means. I would think that the call should replace the found pattern with "".
Each pair of parentheses (...) where the first character is not a ?* is a "capturing group", which places its result into $1,$2,$3,etc which can be used in the replacement pattern.
You might also see the same thing as \1,\2,\3 in other regex engines, (or indeed in the original expression sometimes, for repetition)
These are called "backreferences", because they generally refer back to (an earlier) part of in the expression.
(*The ? indicates various forms of special behaviour, including a non-capturing group which is (?:...) and simply groups without capturing.)
In your specific example, the $1 will be the group (^| ) which is "position of the start of string (zero-width), or a single space character".

So by replacing the whole expression with that, you're basically removing the variable theClass and potentially a space after it. (The closing expression ( |$) is the inverse - a space or the string end position - and since its value isn't used, could have been non-capturing with (?: |$) instead.)
Hopefully this explains everything ok - let me know if you want any more info.

Also, here's some further reading from the site regular-expressions.info:
Groups and Backreferences
Atomic Grouping (doesn't work in JS, but interesting)
Lookaround groups (partial support in JS regex)
                Thanks, it's clear now.  I had a little trouble understanding what you meant by "each pair of parentheses", but that applies to the regex pattern. If the regex pattern contains a pair of parentheses then it's a capturing group.
– Niels Bom
                Jul 14, 2010 at 8:46
                In this case $1 will be nothing (if the first group matches the 0-width ^ start of line character) or a space (if the first group matches a space).
– Mike Tunnicliffe
                Jul 13, 2010 at 9:30
        
Thanks for contributing an answer to Stack Overflow!
Please be sure to answer the question. Provide details and share your research!
But avoid …
Asking for help, clarification, or responding to other answers.
Making statements based on opinion; back them up with references or personal experience.
To learn more, see our tips on writing great answers.