Encoding URIs

encodeURI() encodes a whole URL but keeps / ? & = #, so it cannot protect a value containing &. encodeURIComponent() leaves only A-Z a-z 0-9 - _ . ! ~ * ' ( ); use it per value, or let URLSearchParams (URLSearchParams) do it. The decode twins reverse them.

Encoding a whole URL versus one query valueJavaScriptLive
const q = 'rock & roll/50%';
console.log(encodeURI(`https://example.com/a b?q=${q}`));
console.log(`https://example.com/search?q=${encodeURIComponent(q)}`);
console.log(new URLSearchParams({ q }).toString());