How to target a dash or hyphen in RegEx if used in a javascript .replace?

Question

I'm trying to target a dash or hyphen using RegEx. This seems to be impossible with how I'm using it though. The other answers I found online doesn't seem to match my scenario.

Scenario:

What should happen is if I click a button, this script will replace the specified numbers + letters. It's working fine, until now when I'm about to include a hyphen in the list.

Please take a look at the RegEx used below and here's the code:

const mapper = new Map();
mapper.set("10th", "11th");
mapper.set("-", "Deleted");
mapper.set("63", "Deleted");
mapper.set("63-5", "Deleted");
mapper.set("121AA", "95");

function fixtext() {
  const elm = document.getElementById("textarea1");
  if (elm) {
    elm.value = elm.value
      .replace(
        /\b\d+(?:A|B|C|D|E|F|G|H|I|J|K|L|M|N|O|P|Q|R|S|T|U|V|W|X|Y|Z|AA|BB|CC|DD|EE|FF|GG|HH|II|JJ|KK|LL|MM|NN|OO|PP|QQ|RR|SS|TT|UU|VV|WW|XX|YY|ZZ|d|th|st|nd)?\b/g,
        m => mapper.has(m) ? mapper.get(m) : m
      );
  }
}

<textarea id="textarea1" rows="4" cols="50">(10th ed), Pretrial Proceedings sample 121AA and - and 63 63-5</textarea>

<button class="nbtngreen" onclick="fixtext()">Update</button>

For 63-5, it should be changed as a whole and not as Deleted-5

I tried using several RegEx I saw online to escape hyphen or to match it. Here's some of them: []-] [a-zA-Z0-9!$* \t\r\n\-] [-] [abc-]

None of these works for me or I cannot understand how to make it work this time.

I also would really like to shorten my RegEx but this is the problem as well. [A-z] or something like this doesn't work as well.

I'd really appreciate any help on how to fix this. Thanks in advance!

Amit Joki · Accepted Answer · 2021-01-18 06:26:59Z

2

You can instead do it in a simpler way. You're only going to replace the keys in the map. So sort the keys by descending order of length and then replace each key with its value.

The descending sort by length is to make sure longer keys gets replaced first.

const mapper = new Map();
mapper.set("10th", "11th");
mapper.set("-", "Deleted");
mapper.set("63", "Deleted");
mapper.set("63-5", "Deleted");
mapper.set("121AA", "95");
const keys = [...mapper.keys()].sort((a, b) => b.length - a.length);

function fixtext() {
  const elm = document.getElementById("textarea1");
  if (elm) {
    for (const key of keys) {
      elm.value = elm.value.replace(new RegExp(key, 'g'), mapper.get(key));
    }
  }
}

<textarea id="textarea1" rows="4" cols="50">(10th ed), Pretrial Proceedings sample 121AA and - and 63 63-5</textarea>

<button class="nbtngreen" onclick="fixtext()">Update</button>

If you don't want to replace within a word, you can use word boundaries like so

elm.value = elm.value.replace(new RegExp('\\b' + key + '\\b', 'g'), mapper.get(key));

edited Jan 18, 2021 at 6:26

answered Jan 18, 2021 at 6:08

Amit Joki

59.4k7 gold badges80 silver badges97 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

ixcode Over a year ago

Hi thank you for your help. However, if I do this, I will encounter problem where it changes a value even if it shouldn't. For example, 1=600*; and if I paste a 21 in textarea, it will change it to 2600 when it shouldn't. And that's what I'm trying to avoid. I don't want to sound ungrateful sir, however, can you please teach me how to use my script and only add a RegEx for hyphen?

Amit Joki Over a year ago

You can use word boundaries like regexr.com/5kenl

Phil.hsu · Accepted Answer · 2021-01-18 07:57:12Z

1

const mapper = new Map();
mapper.set("10th", "11th");
mapper.set("-", "Deleted");
mapper.set("63", "Deleted");
mapper.set("63-5", "Deleted");
mapper.set("121AA", "95");

function fixtext() {
  const elm = document.getElementById("textarea1");
  if (elm) {
    elm.value = elm.value
      .replace(
        /\b\d+(?:[A-Z]|([A-Z])\1|d|th|st|nd)?(|\-\d)?\b/g,
        m => mapper.has(m) ? mapper.get(m) : m
      );
  }
}

<textarea id="textarea1" rows="4" cols="50">(10th ed), Pretrial Proceedings sample 121AA and - and 63 63-5</textarea>

<button class="nbtngreen" onclick="fixtext()">Update</button>

answered Jan 18, 2021 at 7:57

Phil.hsu

865 bronze badges

1 Comment

ixcode Over a year ago

This is what I'm really looking for! Thank you so much for this! Just one question please, how can I also add a comma in the list? For example I want to target mapper.set("1, 3", "Random numbers");?

Collectives™ on Stack Overflow

How to target a dash or hyphen in RegEx if used in a javascript .replace?

2 Answers 2

2 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

2 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related