Mountains out of mole hills? example my search and replace solution

Hi all,
Just finished this challenge and was amazed at the solutions others have posted on the forum, specifically at how little code they have used. I’ve noticed that I tend to make a mountain out of my solutions when I have looked at the forum in the past. This tendency is worrying me. Any critique, encouragement, or advice is welcome.

function myReplace(str, before, after) {
var theSentence = str;
//document.getElementById(“replaceThis”).innerHTML = before;
//document.getElementById(“withThis”).innerHTML = after;
//document.getElementById(“theString”).innerHTML = str;

//capitalize the first letter of before
var beforeUpper = before;	
var beforeUpperSplit = beforeUpper.split('');
var beforeUpperSplitSliced = beforeUpperSplit.slice(0, 1);
var beforeUpperRemainder = beforeUpperSplit.slice(1);
console.log("beforeUpperSplitSliced = " + beforeUpperSplitSliced);
var beforeUpper1stLetter = beforeUpperSplitSliced[0].toUpperCase();
beforeUpper = beforeUpperRemainder.toString();
console.log("beforeUpper = " + beforeUpper);
beforeUpper = beforeUpper.replace(/[\,]/g, '');
console.log("beforeUpper = " + beforeUpper);
//capitalize the first letter of after
var afterUpper = after;	
var afterUpperSplit = afterUpper.split('');
var afterUpperSplitSliced = afterUpperSplit.slice(0, 1);
var afterUpperRemainder = afterUpperSplit.slice(1);
console.log("afterUpperSplitSliced = " + afterUpperSplitSliced);
var afterUpper1stLetter = afterUpperSplitSliced[0].toUpperCase();
afterUpper = afterUpperRemainder.toString();
console.log("afterUpper = " + afterUpper);
afterUpper = afterUpper.replace(/[\,]/g, '');
console.log("afterUpper = " + afterUpper);

//find the index of the lower or upper case before in str
var indexOfBeforeInStrLower = str.indexOf(before);
var indexOfBeforeInStrUpper = str.indexOf(beforeUpper);
console.log("test1 = " + indexOfBeforeInStrLower);
console.log("test2 = " + indexOfBeforeInStrUpper);

if(str.charAt(indexOfBeforeInStrLower) === before[0].toLowerCase()){
	theSentence = theSentence.replace(before, after);
	console.log("case 1");
}else if(str.charAt(indexOfBeforeInStrUpper) === before[0].toUpperCase()){
	theSentence = theSentence.replace(beforeUpper, afterUpper);
	console.log("case 2");
//document.getElementById("theSentence").innerHTML = theSentence;
return theSentence;


You have far too many variables going on there, and you don’t need to be messing around with regexes or DOM objects either. Also, your code may pass the tests, but it doesn’t actually meet the spec. The spec asks you to:

NOTE: Preserve the case of the original word when you are replacing it.

Now, that’s a little ambiguous, but to me, that means all of the following should work:

myReplace('This is my dog.', 'dog', 'bOOk');
-> 'This is my book.'
myReplace('This is my DOG.', 'DOG', 'book');
-> 'This is my BOOK.'
myReplace('This is my Dog.', 'Dog', 'booK');
-> 'This is my Book.'
myReplace('This is my dOg.', 'dOg', 'book');
-> 'This is my bOok.'
myReplace('This is my dOg.', 'dOg', 'booK');
-> 'This is my bOoK.'

My solution:

function myReplace(str, before, after) {
  /*If `before` is all caps, all lower case, or only the first letter is
  capitalized, we can simply convert `after` accordingly.*/
  if (before === before.toUpperCase()) {
    after = after.toUpperCase();
  } else if (before === before.toLowerCase()) {
    after = after.toLowerCase();
  } else if (before === before[0].toUpperCase() + before.slice(1).toLowerCase()) {
    after = after[0].toUpperCase() + after.slice(1).toLowerCase();
  } else {
    /*If `before` is mixed case, things get a little more tricky and we need to
    use arrays. Technically, `before` doesn't really need to be array because
    we only need to read from it, but let's convert it anyway for consistency.*/
    var beforeArr = before.split('');
    var afterArr = after.split('');
    for (var i=0;i<beforeArr.length && i<afterArr.length;i++) {
      if (beforeArr[i] === beforeArr[i].toUpperCase()) {
        afterArr[i] = afterArr[i].toUpperCase();
      } else {
         afterArr[i] = afterArr[i].toLowerCase();
    before = beforeArr.join('');
    after = afterArr.join('');

  str = str.replace(before, after);
  return str;

Thanks for taking a look Lionel-rowe,
Agreed, I’ll rework it. I really only need to mess with the input and return the fully transformed string. The regex is overkill. I missed the spec too, was thinking to preserve the case of the first letter of the word, didn’t consider other letters needing to be thought of.
The reason for the DOM objects is because I work the problem in Notepad++ and test in my browser with a HTML page for each assignment.
Anyways thanks for the 2nd set of eyes.
Happy coding :slight_smile: