Why is new RegEx not working properly

Question

For some reason…

When ever I try to get the Object.keys from replace.letters and use the Object.keys in a new RegExp joined by |…

The new RegExp only recognize some of the Object.keys but not all of them. I need the RegEx to dynamically create itself.

If I place a static RegExp in… It works perfectly fine.

1. Demo does not work properly

2. Demo works perfectly but I have to force the Regex to know what to look for

replace = {
  letters: {
    a: {
      after: ["til"]
    },
    b: {
      because: ["bec"]
    },
    c: {
      cool: ["chill"]
    },
    e: {
      energy: ["en"]
    },
    h: {
      light: ["look"]
    },
    i: {
      keen: ["ok"]
    },
    r: {
      roll: ["rock"]
    },
    s: {
      ship: ["skip"]
    },
    t: {
      trip: ["tip"]
    }
  }
}

sentence = [
  "If you want a cookie, eat your dinner.",
  "As soon as you enter the house, change clean your room and mop the floor.",
  "So long as I'm king, I will ensure your safty.",
  "Change the curtains, after house is painted.",
  "Change the curtains, by the time that we are headed.",
  "Assuming that you are a good person, hold my beer.",
  "Reject the offer, even if I'm not there.",
  "Reject the offer, zoom I'm not there.",
  "By the time the bus gets here, the show will be over with.",
  "Choose a random number.",
  "Try not to mess this, that and those up.",
  "Change a random number, pick a color, and put it in jason's house.",
  "Zoom, fix and lower the bar.",
  "Don't change the house.",
  "Create a playground.",
  "While you were gone, I changed the lockes",
  "Before I stop the car, can you get my wallet."
]
let objects_letters = Object.keys(replace.letters).join('|')
let letters_RegEx = new RegExp('^(' + objects_letters + ')', 'gi')
console.log(letters_RegEx)//This isn't working properly.

for (var i = 0; i < sentence.length; i++) {
  let $this = sentence[i]
  let commaKey = /,/g.test($this)
  let if_While_Key = /^(If|While)/gi.test($this)


  //Here is the problem
  let letterKey = letters_RegEx.test($this)
  //Here is the problem


  if (commaKey) {
    if (if_While_Key) {}
    if (letterKey) {
      $('body').append($this + '<br>');
    } else {}
  } else {}



}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

replace = {
  letters: {
    a: {
      after: ["til"]
    },
    b: {
      because: ["bec"]
    },
    c: {
      cool: ["chill"]
    },
    e: {
      energy: ["en"]
    },
    h: {
      light: ["look"]
    },
    i: {
      keen: ["ok"]
    },
    r: {
      roll: ["rock"]
    },
    s: {
      ship: ["skip"]
    },
    t: {
      trip: ["tip"]
    }
  }
}

sentence = [
  "If you want a cookie, eat your dinner.",
  "As soon as you enter the house, change clean your room and mop the floor.",
  "So long as I'm king, I will ensure your safty.",
  "Change the curtains, after house is painted.",
  "Change the curtains, by the time that we are headed.",
  "Assuming that you are a good person, hold my beer.",
  "Reject the offer, even if I'm not there.",
  "Reject the offer, zoom I'm not there.",
  "By the time the bus gets here, the show will be over with.",
  "Choose a random number.",
  "Try not to mess this, that and those up.",
  "Change a random number, pick a color, and put it in jason's house.",
  "Zoom, fix and lower the bar.",
  "Don't change the house.",
  "Create a playground.",
  "While you were gone, I changed the lockes",
  "Before I stop the car, can you get my wallet."
]
let objects_letters = Object.keys(replace.letters).join('|')
let letters_RegEx = new RegExp('^(' + objects_letters + ')', 'gi')
console.log(letters_RegEx)//This isn't working properly.

for (var i = 0; i < sentence.length; i++) {
  let $this = sentence[i]
  let commaKey = /,/g.test($this)
  let if_While_Key = /^(If|While)/gi.test($this)


  //Here is the problem
  let letterKey = /^(a|b|c|e|h|i|r|s|t)/gi.test($this)
  //Here is the problem


  if (commaKey) {
    if (if_While_Key) {}
    if (letterKey) {
      $('body').append($this + '<br>');
    } else {}
  } else {}



}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 1

You have to precede special characters with \ when included in a string (RegExp).

EDIT: it looks like you need to escape all the special characters in regexp. I have borrowed escapeRegExp function from Mathias Bynens

Please see corrected snippet below:

replace = {
  letters: {
    a: {
      after: ["til"]
    },
    b: {
      because: ["bec"]
    },
    c: {
      cool: ["chill"]
    },
    e: {
      energy: ["en"]
    },
    h: {
      light: ["look"]
    },
    i: {
      keen: ["ok"]
    },
    r: {
      roll: ["rock"]
    },
    s: {
      ship: ["skip"]
    },
    t: {
      trip: ["tip"]
    }
  }
}

sentence = [
  "If you want a cookie, eat your dinner.",
  "As soon as you enter the house, change clean your room and mop the floor.",
  "So long as I'm king, I will ensure your safty.",
  "Change the curtains, after house is painted.",
  "Change the curtains, by the time that we are headed.",
  "Assuming that you are a good person, hold my beer.",
  "Reject the offer, even if I'm not there.",
  "Reject the offer, zoom I'm not there.",
  "By the time the bus gets here, the show will be over with.",
  "Choose a random number.",
  "Try not to mess this, that and those up.",
  "Change a random number, pick a color, and put it in jason's house.",
  "Zoom, fix and lower the bar.",
  "Don't change the house.",
  "Create a playground.",
  "While you were gone, I changed the lockes",
  "Before I stop the car, can you get my wallet."
]
let objects_letters = Object.keys(replace.letters).join('\|')
let letters_RegEx = new RegExp(escapeRegExp('^(' + objects_letters + ')'), 'i')
console.log(letters_RegEx);

function escapeRegExp(text) {
  return text.replace(/[-[\]{}()*+?.,\\^$|#\s]/g, '\$&');
}

for (var i = 0; i < sentence.length; i++) {
  let $this = sentence[i]
  let commaKey = /,/g.test($this)
  
  let if_While_Key = /^(If|While)/gi.test($this)

  //FIXED
  let letterKey = letters_RegEx.exec($this)

  if (commaKey) {
    if (if_While_Key) {}
    if (letterKey) {
      $('body').append($this + '<br>');
    } else {}
  } else {}



}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Answer 2

Your problem is your RegExp Flags

Change

let letters_RegEx = new RegExp('^(' + objects_letters + ')', 'gi')

to

let letters_RegEx = new RegExp('^(' + objects_letters + ')', 'i')

replace = {
  letters: {
    a: {
      after: ["til"]
    },
    b: {
      because: ["bec"]
    },
    c: {
      cool: ["chill"]
    },
    e: {
      energy: ["en"]
    },
    h: {
      light: ["look"]
    },
    i: {
      keen: ["ok"]
    },
    r: {
      roll: ["rock"]
    },
    s: {
      ship: ["skip"]
    },
    t: {
      trip: ["tip"]
    }
  }
}

sentence = [
  "If you want a cookie, eat your dinner.",
  "As soon as you enter the house, change clean your room and mop the floor.",
  "So long as I'm king, I will ensure your safty.",
  "Change the curtains, after house is painted.",
  "Change the curtains, by the time that we are headed.",
  "Assuming that you are a good person, hold my beer.",
  "Reject the offer, even if I'm not there.",
  "Reject the offer, zoom I'm not there.",
  "By the time the bus gets here, the show will be over with.",
  "Choose a random number.",
  "Try not to mess this, that and those up.",
  "Change a random number, pick a color, and put it in jason's house.",
  "Zoom, fix and lower the bar.",
  "Don't change the house.",
  "Create a playground.",
  "While you were gone, I changed the lockes",
  "Before I stop the car, can you get my wallet."
]
let objects_letters = Object.keys(replace.letters).join('|')
let letters_RegEx = new RegExp('^(' + objects_letters + ')', 'i')
console.log(letters_RegEx)//This isn't working properly.

for (var i = 0; i < sentence.length; i++) {
  let $this = sentence[i]
  let commaKey = /,/g.test($this)
  let if_While_Key = /^(If|While)/gi.test($this)


  //Here is the problem
  let letterKey = letters_RegEx.test($this)
  //Here is the problem


  if (commaKey) {
    if (if_While_Key) {}
    if (letterKey) {
      $('body').append($this + '<br>');
    } else {}
  } else {}



}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>