Convert HTML Entities question

Convert HTML Entities question
0

#1

I’m a bit confused with this challenge. My code is not working when an argument does not have a symbol in it, such as convertHTML("abc")

function convertHTML(str) {

  var symbols = ["&", "<", ">", '"', "'"];
  var html = ["&amp;", "&lt;", "&gt;", "&quot;", "&apos;"];
  var newStr = "";
  
  for (var i=0; i<symbols.length; i++) {
    if (str.indexOf(symbols[i]) !== -1) {
      newStr = str.replace(symbols[i], html[i]);
      
      if (i == (symbols.length-1) && newStr.length<1) {
        newStr = str; //abc argument not returning anything
      }
     }
  }
  return newStr;
  
  } 
convertHTML("abc");

They way I figured this would work is that the 2nd if statement would kick in when the loop gets to the end of the symbol array, and newStr is still empty, meaning that it did not detect any symbols. It would then just return the original string. How come it’s not working as expected?


#2

If there is no match on the first if, second if is never reached :wink:


#3

Oh of course! Thanks mate, can’t believe I missed that!


#4

I’m almost there but I’ve hit another snag.

function convertHTML(str) {

  var symbols = ["&", "<", ">", '"', "'"];
  var html = ["&amp;", "&lt;", "&gt;", "&quot;", "&apos;"];
  var newStr = "";
  
  for (var i=0; i<symbols.length; i++) { //CONVERT PHRASE WITH SYMBOL
    if (str.indexOf(symbols[i]) !== -1) {
      newStr = str.replace(new RegExp(symbols[i], 'g'), html[i]);
    }
      
     else if (i == (symbols.length-1) && newStr.length<1) {
          newStr = str; //RETURNS STR IF NO SYMBOL PRESENT
      }
     }
  
  return newStr;
  
  } 
convertHTML("<>");

My code is being passed for everything except convertHTML("<>"); Currently it returns <&gt; I’ve think I’ve determined this is because the way I’ve written my code it does not handle the replacement of two types of symbols. However I don’t understand the current output. In my array of symbols less < comes first, so I’d expect the output to be &lt;> Testing shows that < on it’s own returns &lt; but if I change the argument to convertHTML("><") the output is &gt;< Whats going on here?!


#5

It’s amazing how writing out your problem in the forum can help you troubleshoot! Once I submitted I realized that what was happening was that my loop would continue to run after something would replace. And as per the original code it would update the string with only the last found symbol in the array. I changed it so that var newStr = str & newStr = newStr.replace(new RegExp(symbols[i], 'g'), html[i]);

Thank you again for your original answer :slight_smile:


#6

Here’s my solution using a hash(object):

function convertHTML(str) {
  var entities = {
    "&": "&amp\;",
    "<": "&lt\;",
    ">": "&gt\;",
    "\"": "&quot\;",
    "'": "&apos\;"
  };
  return str.replace(/[&<>'"]/g, m => entities[m]);
}

#7

Here’s mine

[code]var convertHTML = function(str) {
// :slight_smile:
return str.replace(/&/g, ‘&’).replace(/</g, ‘<’).replace(/>/g, ‘>’).replace(/"/g, “”").replace(/’/g, ‘’’);
};

convertHTML(“Dolce & Gabbana”);[/code]


#8

How does your code work? Could you explain a lit bit more?

I have written some code which is around 40 lines so :slight_smile: :smile:


#9

Wow, nice solution! I didn’t know you could use replace with functions like that. You don’t need to escape ; in strings, though. :wink:


#10

Nice Solution JorgeVara…

Can you pls identify the problem with the below code. It satisfies all condition except one: convertHTML("<>");

The code returns both symbols as same lower than html entity – “<<”

function convertHTML(str) {
		var symbols = ['&', '<', '"', "'", '>'];
		var htmlCode = ["&amp;", "&lt;", "&quot;", "&apos;", "&gt;"];
		
		var regEx = /[&<>'"]/g;
		str = str.replace(regEx, function codeReplace(){
			for (var i=0; i < symbols.length; i++){
				if (str.indexOf(symbols[i]) > -1){
					return htmlCode[i];
				}	
			}
		});
		return str;
		}

Thanks