URL encode sees “&” (ampersand) as “&” HTML entity

Just to be clear, you should never be using encodeURI() and encodeURIComponent(). If you disagree, just look at its results...

console.log(encodeURIComponent('@#$%^&*'));

Input: ^&*.

Output: %40%23%24%25%5E%26*.

That's not right, is it? * did not get converted! I hope you're not using this as a server-side cleansing function, because * will not be treated as input but as commands, i.e., imagine deleting a user's alleged file with rm *. Well, I hope you're not using encodeURI() or encodeURIComponent()!

TLDR: You actually want fixedEncodeURIComponent() and fixedEncodeURI().

MDN encodeURI() Documentation...

function fixedEncodeURI(str) {
   return encodeURI(str).replace(/%5B/g, '[').replace(/%5D/g, ']');
}

MDN encodeURIComponent() Documentation...

function fixedEncodeURIComponent(str) {
 return encodeURIComponent(str).replace(/[!'()*]/g, function(c) {
   return '%' + c.charCodeAt(0).toString(16);
 });
}

With these functions, use fixedEncodeURI() to encode a single URL piece, whereas fixedEncodeURIComponent() will encode URL pieces and connectors; or, more simply, fixedEncodeURI() will not encode +@?=:#;,$& (as & and + are common URL operators), but fixedEncodeURIComponent() will.