Skip to content
Advertisement

Regex match variable identifiers, function identifiers, function parameter and class name from a string

Hay, i need your help…
So we have an example code at textarea and we will use regex to match all:

  • class name
  • function and variable identifier, and
  • parameter inside parentheses (…)

this is the expected return :

(abc) (a) (abc123) (taHandler) (elem) (pattern) (caret_start) (ClassMates) (name) (age) (displayInfo)

if you want to edit at regex101: https://regex101.com/r/UCI6Np/1

I already do half of work intil i get stuck to matching variable identifiers that separated by coma. I really appreciate any help from you guys. if something is not clear, fell free to ask me at comment section.

const str = document.getElementById('val_').value;
const regex = /(?<=(let|var|const|function|class)s+)(w+)/g;
let m;

while ((m = regex.exec(str)) !== null) {
    // avoid infinite loops with zero-width matches
    if (m.index === regex.lastIndex) { regex.lastIndex++; }
    
    // The result can be accessed through the `m`-variable.
    m.forEach((match, groupIndex) => {
       if( groupIndex === 2 ){
         console.log(`match:(${match})`);
       }
    });
}
/* 
we need to match :
- class name
- function and variable identifier
- parameter inside parentheses (...)
this is the expected return :
(abc)
(a)
(abc123)
(taHandler) 
(elem)
(pattern)
(caret_start)
(ClassMates)
(name)
(age)
(displayInfo)
*/

/*
edit on regex101:
https://regex101.com/r/UCI6Np/1
*/
<textarea id="val_" style="width:100%;height:200px;">
this just example code for regex matching purpose:
var abc = 123;
let a = 'ok';
const abc123 = 'yep';
        function taHandler(elem) {
            let
            pattern     = /r?n|r/,
            caret_start = elem.selectionStart,
            caret_end   = elem.selectionEnd,
            elmval_     = elem.value;
class ClassMates{
    constructor(name,age){
        this.name=name;
        this.age=age;
    }
    displayInfo(){
        return this.name + "is " + this.age + " years old!";
    }
}
</textarea>

Advertisement

Answer

You almost had it done. One difficulty I found is like you said to match variable identifiers separated by commas.

I think if you check they’re preceded by a comma and followed by a = (+ optional white spaces) you’ll be quite safe:

(?<=(let|var|const|function|class)s+)(w+)|(?<=,s+)(w+)(?=s*=)|(?<=[(,])(w+)(?=[),])|(?<=}s+)(w+)(?=()

In order to recognize functions in a class I check if they are preceded by } and followed by ( (+ optional white spaces). This way we exclude the constructor.

User contributions licensed under: CC BY-SA
7 People found this is helpful
Advertisement