Need help to convert HTML entities pls

Need help to convert HTML entities pls
0

#1
function convertHTML(str) {
  var hObj = {};
  hObj = { "&" : "&",
         "<" : "&lt;",
         '"':"&quot;",
         ">": "&gt;",
         "'": "&apos;",
         "<>": "&lt;&gt;"
          
         };
  
   
  for ( var key in hObj){
    if(hObj.hasOwnProperty(key)){
      //return key;//&
      //return hObj[key];//&amp;
     str =str.replace(key,hObj[key]); 
        }
  str = str.replace(key,hObj[key]);
  }
 
 return str;
}

convertHTML("Dolce & Gabbana");

My solution works with only part of the problems and I can not figured it out. Can I get help please?https://www.freecodecamp.org/challenges/convert-html-entities


#2

I’d recommend looking into RegExp.

The problem with using a for-loop for this is that the '&' character also appears in the replacement strings, so the '&' in the HTML entities might get clobbered in the process.

It also looks like only the first substring is replaced when you pass in a string as the first argument to the replace() method (for example, when you want to replace the '<' character but there are more than one, only the first one gets replaced). With RegExp you can match all substrings at once.


#3

Thanks for your response. I made changes which to take care of more than one special ‘key’ characters. But I can not resolve the issue with ‘&’ as you have mentioned. My solution replaces '&" with “&amp;” and can not figure that out. ‘&’ is part of key as well as ‘value’. I know where the problem is, but I can not resolve it. I would appreciate your help.

function convertHTML(str) {
  var hObj = {};
  hObj = {
    
          '&':"&amp;",
         "<" : "&lt;",
         '"':"&quot;",
         ">": "&gt;",
         "'": "&apos;",
         "<>": "&lt;&gt;"
          
         };
 
  
   //mystr = "";

  for ( var key in hObj){
    if(hObj.hasOwnProperty(key)){
      
     // var k = key;
      //var v = hObj[key];
      
      
   str = str.replace(key,hObj[key]); //does not work with two keys in one string.
        }
 str = str.replace(key,hObj[key]);//need both str for two keys in one string, 
  }
 
 return str;https://www.freecodecamp.org/challenges/convert-html-entities

#4

See below where I took your current code (posted above) and put in a couple of console.log statements in to see what the value of str is after the if statement and then after the second replace function.


function convertHTML(str) {
  var hObj = {
          '&':"&amp;",
         "<" : "&lt;",
         '"':"&quot;",
         ">": "&gt;",
         "'": "&apos;",
         "<>": "&lt;&gt;"
         };

  for ( var key in hObj){
    if(hObj.hasOwnProperty(key)){
      str = str.replace(key,hObj[key]); //does not work with two keys in one string.
    }
    console.log('after if statement str = ' + str);
    str = str.replace(key,hObj[key]);//need both str for two keys in one string, 
    console.log('after second replace function str = ' + str + '\n');
  }
 
 return str; 
}

produces:

after if statement str = Dolce & Gabbana
after second replace function str = Dolce &amp; Gabbana

after if statement str = Dolce &amp; Gabbana
after second replace function str = Dolce &amp; Gabbana

after if statement str = Dolce &amp; Gabbana
after second replace function str = Dolce &amp; Gabbana

after if statement str = Dolce &amp; Gabbana
after second replace function str = Dolce &amp; Gabbana

after if statement str = Dolce &amp; Gabbana
after second replace function str = Dolce &amp; Gabbana

after if statement str = Dolce &amp; Gabbana
after second replace function str = Dolce &amp; Gabbana


#5

Thanks for the help. I used RegExp solve the problems. My biggest problem is where to place return statement.
What is the best way to trouble shoot the code? FCC site is not easy for me.
Thanks,


#6

I use repl.it to test out my code. I use console.log statements to see the values of variables at different points in the code.


#7

I modified your posted solution to use the hObj you created. I have blurred out the solution in case others find this post and do not want to see the solution. Just click on the blurred section to see it.

function convertHTML(str) {
  var hObj = { "&" : "&amp;",
         "<" : "&lt;",
         '"':"&quot;",
         ">": "&gt;",
         "'": "&apos;",
         };
  
  var newStr = ''; // blank string to contain any conversions
  for (var character of str){
    if(hObj.hasOwnProperty(character)){  // iterate through str one character at a time
      newStr += hObj[character];  // add the converted character to new string
    }
    else {
      newStr += character; // add the original character to new string
    }
  }
  return newStr; // return new string
}

#8

Could anyone tell me why my code is being rejected by the test? It works fine in a compiler, so I’m not sure what I’m missing. I know it’s not the most elegant solution, but I’d like to understand why it’s wrong.

const NEWNAMES = {
"&": "&​amp;",
"<": "&lt;",
">": "&gt;",
"\"": "&quot;",
"\'": "&apos;"
};

function getSymbol(char){
  for (let key in NEWNAMES) {
    if (char == key) {
      return NEWNAMES[key];
    }
  }
  return char;
}

function convertHTML(str) {
  let charArr = str.split('');
  let newStr = "";
  for (let i =0; i<charArr.length; i++){
      newStr += getSymbol(charArr[i]);    
  }
  return newStr;
}

convertHTML("Dolce & Gabbana");