What does this regex (\/?) mean? - javascript

The following code is taken from Jon Resig's book Secrets of JavaScript Ninja
var html = "<div class='test'><b>Hello</b> <i>world!</i></div>";
var results = html.match(/<(\/?)(\w+)([^>]*?)>/);
I want to understand the meaning of the first capture (within the parenthesis) ie (\/?).

It matches an optional slash. The slash needs to be escaped because slashes also serve as delimiters in JavaScript regex literals.
It's not really useful to surround it with capturing parentheses. \/? would work as well (unless you later on want to check whether you have matched an opening or a closing tag).

It is either exactly one / or nothing. / has to be escaped inside regexp because it means "end of regexp" when unescaped.

Related

How to make \ a literal back slash using Regexp in JS

I am pretty new to Regexp and it seems that the \ is used for meta characters. My problem is I want to search this string exactly \"mediaType\":\"img\"
Now I also want to dynamically put a variable in for img. So I want it to be something like this
new RegExp(`\"mediaType\":\"${variable}\"`)
How do I write this to make it work?
Short answer:
function escapeRegEx(s) {
return s.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
}
var expression = new RegExp('\\\\"mediaType\\\\":\\\\"' + escapeRegEx(variable) + '\\\\"');
// or, using a template literal:
var expression = new RegExp(`\\\\"mediaType\\\\":\\\\"${escapeRegEx(variable)}\\\\"`);
Long answer:
Besides being used for meta characters, backslash in regular expressions can be used to escape characters that would otherwise have meaning (like *, $, parentheses, and \). So the way to match a backslash in a regular expression is to add another one as an escape character: \\.
Taking that into account, the regular expression you want to end up with is \\"mediaType\\":\\"img\\", and if you were using a regular expression literal that would be it. Unfortunately it gets a little more involved because you need to create an expression dynamically, you need to provide the expression as a string, which also needs the backslashes escaped. That adds a second layer of escaping, so you need to double up each of the \ characters again, and you end up with new RegExp('\\\\"mediaType\\\\":\\\\"img\\\\"').
Another complication is that you want the contents of variable to be matched literally, not interpreted as a regular expression. Unfortunately, there's no built-in way to automatically escape regular expressions in JavaScript, so you'll need to use one of the solutions in Is there a RegExp.escape function in Javascript?. I used a slightly modified version of the accepted answer that defines it as a standalone function instead of adding it to the RegExp object. The exact solution doesn't matter, as long as you escape the dynamic part.
You just want to use String.raw
const variable = 'text'
const regexp = new RegExp(String.raw `\"mediaType\":\"${variable}\"`)
console.log(regexp)

Regex get last 2 characters pipe not working

I'm creating a regex expression to get the variables passed to a JavaScript constructor.
The input is always going to follow along these lines:
app.use(express.static('public'));
And the regex I plan to use to strip out the unnecessary parts is:
(^app.use\()|(..$)
The first part of the regex gets everything up to the first parenthesis, and the it's supposed to pipe it to another expression which gets the last 2 characters of the string.
My issue is that it seems to be ignoring the second regex. I tried a few other expressions in the second part and they worked, but this one isn't.
What am I doing wrong?
Regex example on Regex101: https://regex101.com/r/jV9eH6/3
UPDATE:
This is not a duplicate of How to replace all occurrences of a string in JavaScript?
My question is about a specific issue with a regex, not about replacing one string with another in JavaScript.
You need to use multiline modifier. Whenever anchors ^, $ are used in your regex then feel free to add multi-line modifier m.
/(^app.use\()|(..$)/gm
DEMO

What does the forward slash mean within a JavaScript regular expression?

I can't find any definitive information on what / means in a JavaScript regex.
The code replace(/\r/g, '');
What I'm able to figure out is this:
/ = I don't know
\r = carriage return
/g = I don't know but It may mean 'the match must occur at the point where the previous match ended.'
The slashes indicate the start and end of the regular expression.
The g at the end is a flag and indicates it is a global search.
From the docs:
Regular expressions have four optional flags that allow for global and
case insensitive searching. To indicate a global search, use the g
flag. To indicate a case-insensitive search, use the i flag. To
indicate a multi-line search, use the m flag. To perform a "sticky"
search, that matches starting at the current position in the target
string, use the y flag. These flags can be used separately or together
in any order, and are included as part of the regular expression.
To include a flag with the regular expression, use this syntax:
var re = /pattern/flags;
To add a little more detail, the / characters are part of the regular expression literal syntax in JavaScript/ECMAScript. The / characters are used during lexical analysis to determine that a regular expression pattern is present between them and anything immediately following them will be regular expression flags. The ECMAScript standard has defined this in EBNF, for your perusual:
RegularExpressionLiteral :: / RegularExpressionBody /
RegularExpressionFlags
A good analogy for the / in regular expressions is the " or ' that surround string literals in JavaScript.
As others have pointed out, you should read the docs! That said:
Think of the forward slash as quotation marks for regular expressions. The slashes contain the expression but are not themselves part of the expression. (If you want to test for a forward slash, you have to escape it with a backwards slash.) The lowercase g specifies that this is a global search, i.e., find all matches rather than stopping at the first match.
As is indicated here, the forward slashes are not a part of the expression itself, but denote the beginning and ending of the expression.
To add to metadept's answer:
the g bit is the global indicator - see What does the regular expression /_/g mean? - i.e. replace all occurrences, not just the first one

Matching "{CHARACTERS}" using Javascript RegExp

I'm really struggling with the Javascript version of Regular Expression matching, despite knowing how to do it in other languages like C# and PHP.
I wish to match {ANYCHARACTERS}.
It must have:
a { at the start
a } at the end
1 or more characters between (any characters, symbols etc.)
So far I have the following:
<script type="text/javascript">
// The string that I want to perform a match on
var str = "{ASTRINGINHERE£$%^&*éáó}";
// Mt Matching expression
var patt1 = ^/{(.*){1,*}/}$/i;
// Write the matched result
document.write(str.match(patt1));
</script>
As written, your current pattern should result in a javascript syntax error. Here are the problems I see:
You have your ^ character outside the actual regular expression.
You have two regular expression ending characters (/).
See #kopischke's answer on why I removed the {1,} portion.
This should resolve your issues:
/^{(.+)}$/i
The string start / string end codes belong inside the regex. Also, your repetition code is unnecessarily complex. Finally, there is no need to indicate case independence when you match any character. This should do:
patt1 = /^{.+}$/

javascript email regular expression

Can someone explain this regular expression to validate email.
var emailExp = /^[\w\-\.\+]+\#[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;
I need to know what does this independent elements do
"/^" and "\" and "\.\-" and "$" //Please explain individually
Thanks in advance
Quick explanation
/
JavaScript regular expressions start with a / and end with another one. Everything in-between is a regular expression. After the second / there may be switches like g (global) and/or i (ignore case) ie. var rx = /.+/gi;)
^
Start of a text line (so nothing can be prepended before the email address). This also comes in handy in multi-line texts.
\
Used to escape special characters. A dot/full-stop . is a special character and represents any single character but when presented as \. it means a dot/full-stop itself. Characters that need to escaped are usually used in regular expression syntax. (braces, curly braces, square brackets etc.) You'll know when you learn the syntax.
\.\-
Two escaped characters. Dot/full-stop and a minus/hyphen. So it means .-
$
End of line.
Learn regular expressions
They are one of the imperative things every developer should understand to some extent. At least some basic knowledge is mandatory.
Some resources
General regular expression syntax resource
http://www.regular-expressions.info/
JavaScript related regular expressions
https://developer.mozilla.org/en/Core_JavaScript_1.5_Guide/Regular_Expressions
/
The start of the expression
^
The start of the string (since it appears at the start of the expression)
\
Nothing outside the context of the character that follows it
\.\-
A full stop. A hyphen.
$
The end of the string
The other posters have done an excellent job at explaining this regex, but if your goal is to actually do e-mail validation in JavaScript, please check out this StackOverflow thread.

Categories