将正则表达式匹配到字符串

Question

I am having a text and would like to get all occurrences in an array, such as:

[
    ['{{ $slot }}'],
    ['{{$example }}'],
    ['{{ $Product2}}'],
    ['{{$category1 }}']
]

I tried the following example:

 const text = "<h1>Hello world!</h1> <h2>What is {{ $slot }} Ipsum?</h2> <p><strong>Lorem Ipsum</strong> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to {{$example }}make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially {{$category1 }} unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more {{ $Product2}} recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <p>&nbsp;</p><p>&nbsp;</p>" let data = text.match('/{{\\s*\\$\\w+\\s*}}') console.log(data) 

As you can see I get null as result.

Any suggestions why?

I appreciate your replies!

Answer 1

In JavaScript, a regexp literal is different from a string literal , so the argument of match must be /{{\\s*\\$\\w+\\s*}}/ and not '{{\\s*\\$\\w+\\s*}}' or '/{{\\s*\\$\\w+\\s*}}' . Notice that there is no quotes around it. So try:

const text = "<h1>Hello world!</h1> <h2>What is {{ $slot }} Ipsum?</h2> <p><strong>Lorem Ipsum</strong> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to {{$example }}make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially {{$category1 }} unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more {{ $Product2}} recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <p>&nbsp;</p><p>&nbsp;</p>"
let data = /{{\s*\$\w+\s*}}/g

Which gives:

>>> data
Array(4) [
    "{{ $slot }}",
    "{{ $example }}",
    "{{ $category1 }}",
    "{{ $Product2}}"
]

Note that I added the g flag after the final slash of the regexp for the match to return all the matching strings and not only the first one.

As others noticed, it is also a good practice to escape the curly brackets, otherwise you would run into trouble when they will contain a number, as this has a special meaning for regexps.

Answer 2

try without the first slash

'{{\\s*\\$\\w+\\s*}}'

regex101 example

Match 1

Full match 35-46 {{ $slot }}

Match 2

Full match 302-315 {{$example }}

Match 3

Full match 452-467 {{$category1 }}

Match 4

Full match 589-603 {{ $Product2}}

Answer 3

Please try the following ( see regex101.com ):

const text = "<h1>Hello world!</h1> <h2>What is {{ $slot }} Ipsum?</h2> <p><strong>Lorem Ipsum</strong> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to {{$example }}make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially {{$category1 }} unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more {{ $Product2}} recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <p>&nbsp;</p><p>&nbsp;</p>";

let regex = /\{\{\s*(\$[\w_]+)\s*\}\}/g;

let data = text.match(regex);
console.log(data)

Answer 4

Just use a RegExp literal and:

• escape the $ via \\$ to match literally the $ character and don't assert the end of the line position in the middle of the regular expression by accident
• use the g global match flag to match every occurrence in the string

More on available flags and character classes

---

So the final regex is:

/{{\s*\$\w+\s*}}/g

---

Working Example:

 const text = '<h1>Hello world!</h1> <h2>What is {{ $slot }} Ipsum?</h2> <p><strong>Lorem Ipsum</strong> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to {{$example }}make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially {{$category1 }} unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more {{ $Product2}} recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <p>&nbsp;</p><p>&nbsp;</p>' let data = text.match(/{{\\s*\\$\\w+\\s*}}/g) console.log(data) 

OR

...via RegExp constructor , just make sure to properly escape the RegExp character classes and already present \\ characters via a leading \\ :

 const text = '<h1>Hello world!</h1> <h2>What is {{ $slot }} Ipsum?</h2> <p><strong>Lorem Ipsum</strong> is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry&#39;s standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to {{$example }}make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially {{$category1 }} unchanged. It was popularised in the 1960s with the release of Letraset sheets containing Lorem Ipsum passages, and more {{ $Product2}} recently with desktop publishing software like Aldus PageMaker including versions of Lorem Ipsum.</p> <p>&nbsp;</p><p>&nbsp;</p>' let data = text.match(new RegExp('{{\\\\s*\\\\$\\\\w+\\\\s*}}', 'g')) console.log(data)