Javascript replace all "%20" with a space

Javascript

Javascript Problem Overview


Is there a way to replace every "%20" with a space using JavaScript. I know how to replace a single "%20" with a space but how do I replace all of them?

var str = "Passwords%20do%20not%20match";	
var replaced = str.replace("%20", " "); // "Passwords do%20not%20match"

Javascript Solutions


Solution 1 - Javascript

Check this out: https://stackoverflow.com/questions/1144783/replacing-all-occurrences-of-a-string-in-javascript

Short answer:

str.replace(/%20/g, " ");

EDIT: In this case you could also do the following:

decodeURI(str)

Solution 2 - Javascript

The percentage % sign followed by two hexadecimal numbers (UTF-8 character representation) typically denotes a string which has been encoded to be part of a URI. This ensures that characters that would otherwise have special meaning don't interfere. In your case %20 is immediately recognisable as a whitespace character - while not really having any meaning in a URI it is encoded in order to avoid breaking the string into multiple "parts".

Don't get me wrong, regex is the bomb! However any web technology worth caring about will already have tools available in it's library to handle standards like this for you. Why re-invent the wheel...?

var str = 'xPasswords%20do%20not%20match';
console.log( decodeURI(str) ); // "xPasswords do not match"

Javascript has both decodeURI and decodeURIComponent which differ slightly in respect to their encodeURI and encodeURIComponent counterparts - you should familiarise yourself with the documentation.

Solution 3 - Javascript

Use the global flag in regexp:

var replaced = str.replace(/%20/g, " ");
                                ^

Solution 4 - Javascript

using unescape(stringValue)

var str = "Passwords%20do%20not%20match%21";
document.write(unescape(str))

//Output
Passwords do not match!

use decodeURI(stringValue)

var str = "Passwords%20do%20not%20match%21";
 document.write(decodeURI(str))

Space = %20
? = %3F
! = %21
# = %23
...etc

Solution 5 - Javascript

This method uses the decodeURIComponent() (See edit below) method, which is the best one.

var str = "Passwords%20do%20not%20match%21";
alert(decodeURIComponent(str))

Here it how it works:

Space = %20
? = %3F
! = %21
# = %23
...etc

There's a good example of that at the Mozilla docs [https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/decodeURI]

Edit: decodeURIComponent works better, look at the example.

Solution 6 - Javascript

If you want to use jQuery you can use .replaceAll()

Solution 7 - Javascript

If you need to remove white spaces at the end then here is a solution: https://www.geeksforgeeks.org/urlify-given-string-replace-spaces/

const stringQ1 = (string)=>{
  //remove white space at the end 
  const arrString = string.split("")
  for(let i = arrString.length -1 ; i>=0 ; i--){
    let char = arrString[i];
    
    if(char.indexOf(" ") >=0){
     arrString.splice(i,1)
    }else{
      break;
    }
  }

  let start =0;
  let end = arrString.length -1;
  

  //add %20
  while(start < end){
    if(arrString[start].indexOf(' ') >=0){
      arrString[start] ="%20"
      
    }
    
    start++;
  }
  
  return arrString.join('');
}

console.log(stringQ1("Mr John Smith   "))

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
Questionuser3109009View Question on Stackoverflow
Solution 1 - JavascriptissetView Answer on Stackoverflow
Solution 2 - JavascriptEmissaryView Answer on Stackoverflow
Solution 3 - JavascriptDavid HellsingView Answer on Stackoverflow
Solution 4 - JavascriptRamprasath SelvamView Answer on Stackoverflow
Solution 5 - JavascriptTiago Rangel de SousaView Answer on Stackoverflow
Solution 6 - JavascriptDautView Answer on Stackoverflow
Solution 7 - JavascriptASHISH RView Answer on Stackoverflow