用javascript中的正则表达式屏蔽电话号码

Question

My application has a specific phone number format which looks like 999.111.222 , which I have a regex pattern to mask it on front-end:

/[0-9]{3}\.[0-9]{3}\.([0-9]{3})/

But recently, the format was changed to allow the middle three digits to have one less digit, so now both 999.11.222 and 999.111.222 match. How can I change my regex accordingly?

"999.111.222".replace(/[0-9]{3}\.[0-9]{3}\.([0-9]{3})/, '<div>xxx.xxx.$1</div>')

expected output:

"999.111.222" // xxx.xxx.222
"999.11.222" // xxx.xx.222

Answer 1

Replace {3} with {2,3} to match two or three digits.

/[0-9]{3}\.[0-9]{2,3}\.([0-9]{3})/

For reference see eg MDN

Answer 2

Use

 console.log( "999.11.222".replace(/[0-9]{3}\\.([0-9]{2,3})\\.([0-9]{3})/, function ($0, $1, $2) { return '<div>xxx.' + $1.replace(/\\d/g, 'x') + '.' + $2 + '</div>'; }) ) 

The ([0-9]{2,3}) first capturing group will match 2 or 3 digits, and in the callback method used as the replacement argument, all the digits from th first group are replaced with x .

You may further customize the pattern for the first set of digits, too.

Answer 3

In fact, you should change not only your regex but also your callback replace function:

 const regex = /[0-9]{3}\\.([0-9]{2,3})\\.([0-9]{3})/; const cbFn = (all, g1, g2) =>`<div>xxx.xx${(g1.length === 3 ? 'x' : '')}.${g2}</div>`; const a = "999.11.222".replace(regex, cbFn); const b = "999.111.222".replace(regex, cbFn); console.log(a, b); 

To change regex you could add a term with {2,3} quantifier, as already suggested, and create a new group. Then, in replace cb function, you can use length to know if you must put a new x .