Trying to make a helper function to replace special characters in a string

May 23, 2024

So as the question states, i’m trying to build a small helper function that will catch and fix special characters, I wasn’t sure where to go with it so opted for an object containing the characters, a check to see if it’s included and if so replace the character in the string with the appropriate object entry.

Im now however getting stuck, i’ve got the object and the check to see if it is in fact included. I just don’t know how to target the piece of the string, and then replace it. I tried using includes and replace but it doesn’t seem to work.

Here’s my code:

export function fixEncoding(str) {
  const specialChars = {
    "&Agrave;": "À ",
    "&Aacute;": "Á",
    "&Acirc;": "Â",
    "&Atilde;": "Ã",
    "&Auml;": "Ä",
    "&Aring;": "Å",
    "&agrave;": "à",
    "&aacute;": "á",
    "&acirc;": "â",
    "&atilde;": "ã",
    "&auml;": "ä",
    "&aring;": "å",
    "&AElig;": "Æ",
    "&aelig;": "æ",
    "&szlig;": "ß",
    "&Ccedil;": "Ç",
    "&ccedil;": "ç",
    "&Egrave;": "È",
    "&Eacute;": "É",
    "&Ecirc;": "Ê",
    "&Euml;": "Ë",
    "&egrave;": "è",
    "&eacute;": "é",
    "&ecirc;": "ê",
    "&euml;": "ë",
    "&#131;": "ƒ",
    "&Igrave;": "Ì",
    "&Iacute;": "Í",
    "&Icirc;": "Î",
    "&Iuml;": "Ï",
    "&igrave;": "ì",
    "&iacute;": "í",
    "&icirc;": "î",
    "&iuml;": "ï",
    "&Ntilde;": "Ñ",
    "&ntilde;": "ñ",
    "&Ograve;": "Ò",
    "&Oacute;": "Ó",
    "&Ocirc;": "Ô",
    "&Otilde;": "Õ",
    "&Ouml;": "Ö",
    "&ograve;": "ò",
    "&oacute;": "ó",
    "&ocirc;": "ô",
    "&otilde;": "õ",
    "&ouml;": "ö",
    "&Oslash;": "Ø",
    "&oslash;": "ø",
    "&#140;": "Œ",
    "&#156;": "œ",
    "&#138;": "Š",
    "&#154;": "š",
    "&Ugrave;": "Ù",
    "&Uacute;": "Ú",
    "&Ucirc;": "Û",
    "&Uuml;": "Ü",
    "&ugrave;": "ù",
    "&uacute;": "ú",
    "&ucirc;": "û",
    "&uuml;": "ü",
    "&#181;": "µ",
    "&#215;": "×",
    "&Yacute;": "Ý",
    "&#159;": "Ÿ",
    "&yacute;": "ý",
    "&yuml;": "ÿ",
    "&#176;": "°",
    "&#134;": "†",
    "&#135;": "‡",
    "&lt;": "<",
    "&gt;": ">",
    "&#177;": "±",
    "&#171;": "«",
    "&#187;": "»",
    "&#191;": "¿",
    "&#161;": "¡",
    "&#183;": "·",
    "&#149;": "•",
    "&#153;": "™",
    "&copy;": "©",
    "&reg;": "®",
    "&#167;": "§",
    "&#182;": "¶",
    "&#039;": "'",
    "&quot;": '"',
  };

  let isinclude = (str, obj) => (
    (str = str.replace("/", "")),
    Object.keys(obj).reduce((a, v) => a || str.includes(v), false)
  );

  console.log(isinclude(str, specialChars));

  for (let i = 0; i < specialChars.length; i++) {
    if (str.includes(specialChars[str])) {
      console.log(str);
      const newStr = str.replace(`${i}`, specialChars[str]);
      return newStr;
    } else return str;
  }

  // return str.replace(/&#039;+/g, "'").replace(/&quot;+/g, '"');
}

>Solution :

First, specialChars is an object, not an array, so you use specialChars.length, Also, your replacement logic inside the loop isn’t correctly set up to handle the replacement for all occurrences of each character.

function fixEncoding(str) {
  const specialChars = {
    "&Agrave;": "À ",
    "&Aacute;": "Á",
    "&Acirc;": "Â",
    "&Atilde;": "Ã",
    "&Auml;": "Ä",
    "&Aring;": "Å",
    "&agrave;": "à",
    "&aacute;": "á",
    "&acirc;": "â",
    "&atilde;": "ã",
    "&auml;": "ä",
    "&aring;": "å",
    "&AElig;": "Æ",
    "&aelig;": "æ",
    "&szlig;": "ß",
    "&Ccedil;": "Ç",
    "&ccedil;": "ç",
    "&Egrave;": "È",
    "&Eacute;": "É",
    "&Ecirc;": "Ê",
    "&Euml;": "Ë",
    "&egrave;": "è",
    "&eacute;": "é",
    "&ecirc;": "ê",
    "&euml;": "ë",
    "&#131;": "ƒ",
    "&Igrave;": "Ì",
    "&Iacute;": "Í",
    "&Icirc;": "Î",
    "&Iuml;": "Ï",
    "&igrave;": "ì",
    "&iacute;": "í",
    "&icirc;": "î",
    "&iuml;": "ï",
    "&Ntilde;": "Ñ",
    "&ntilde;": "ñ",
    "&Ograve;": "Ò",
    "&Oacute;": "Ó",
    "&Ocirc;": "Ô",
    "&Otilde;": "Õ",
    "&Ouml;": "Ö",
    "&ograve;": "ò",
    "&oacute;": "ó",
    "&ocirc;": "ô",
    "&otilde;": "õ",
    "&ouml;": "ö",
    "&Oslash;": "Ø",
    "&oslash;": "ø",
    "&#140;": "Œ",
    "&#156;": "œ",
    "&#138;": "Š",
    "&#154;": "š",
    "&Ugrave;": "Ù",
    "&Uacute;": "Ú",
    "&Ucirc;": "Û",
    "&Uuml;": "Ü",
    "&ugrave;": "ù",
    "&uacute;": "ú",
    "&ucirc;": "û",
    "&uuml;": "ü",
    "&#181;": "µ",
    "&#215;": "×",
    "&Yacute;": "Ý",
    "&#159;": "Ÿ",
    "&yacute;": "ý",
    "&yuml;": "ÿ",
    "&#176;": "°",
    "&#134;": "†",
    "&#135;": "‡",
    "&lt;": "<",
    "&gt;": ">",
    "&#177;": "±",
    "&#171;": "«",
    "&#187;": "»",
    "&#191;": "¿",
    "&#161;": "¡",
    "&#183;": "·",
    "&#149;": "•",
    "&#153;": "™",
    "&copy;": "©",
    "&reg;": "®",
    "&#167;": "§",
    "&#182;": "¶",
    "&#039;": "'",
    "&quot;": '"',
  };

  Object.keys(specialChars).forEach(key => {
    str = str.replace(new RegExp(key, 'g'), specialChars[key]);
  });

  return str;
}

const htmlEncodedString = "This is an encoded string with &quot;quotes&quot; and an apostrophe (&#039;).";
const decodedString1 = fixEncoding(htmlEncodedString);
console.log(decodedString1);