Updated May 18, 2023
Definition of JavaScript encodeURI()
JavaScript URI() function is a function in JavaScript which is used to encode any URI (Uniform Resource Identifier) that substitutes certain instances of character with one, two, or three escape sequences representingUTF-8 patterns for the encoding of characters with the encoding URI function including special URI characters with some reserved characters representing a set of exception in characters such as;/? : @ & = + $ followed by another group of exceptions in characters, namely Unescaped characters with alphabetical, decimal digits, – _ . ! ~ * ‘ () and a score representing #.
Syntax:
encodeURI(uri)
The syntax flow follows a pattern where the encodeURI() function is used to encode a URI as soon as it is called. It takes a parameter called uri,, which represents the specific URI that needs to be encoded.
How encodeURI() Function Works in JavaScript?
Let’s see the working flow of the encodeURI() function in JavaScript :
- The encodeURI() function in JavaScript is used to encode characters in a URI by replacing them with escape sequences. This includes encoding three categories of characters.
- The syntax flow for the encodeURI includes the parameter URI, which represents the URI it is pointing to for making the flow of URI streamlined and customized accordingly.
- The decodeURI() function in JavaScript is used to decode an encoded URI. It performs the reverse operation of the encodeURI() function by converting escape sequences in the encoded URI back to their original characters. It takes the encoded URI as input and returns the decoded URI as the output.
- There is quite a flexible compatibility regarding browser support with the encodeURI(URI) function containing the parameter.
- Moreover, any URI-based component, whether encodeURI or any function containing URI components, using encodeURIComponent().
- Both encodeURI(URI) and encodeURIComponent(URI) are related in using functions according to requirements.
- The complexity of JavaScript comes out to be constant as it doesn’t make much manipulation and changes. Instead, it returns the value string as return type, which leads to the time complexity of this as constant.
- These functions have similar functionality as they aim to encode a set of strings, making them portable and transmittable across networks or computer systems that support special characters with ASCII values.
- But there exists some standard functionality among all these functions, from encoding URI() to encodingURIComponent() function in a way where the function uses the characters but with exceptions of characters which can be reserved characters, Unescaped characters, and Score.
- Although it can be said that the working flow is the same as other functions, some differences still exist with the JavaScript encodingURI() and encodingURI() components.
- The parameter URI is standard for all the encoding functionality, including the encodeURI() function. The encoded string is a crucial component or parameter in manipulating and obtaining the return value of the encoded URI. It represents the URI pattern that requires encoding using the encodeURI() function or a related function.
Examples of JavaScript encodeURI()
Following are the examples given below:
Example #1
The following program demonstrates the usage of the JavaScript encodeURI() function. When the button is clicked, the program will execute the necessary code. The input string provided by the user will undergo encoding using the encodeURI() function.
Code:
<!DOCTYPE html>
<html>
<body>
<p>Press on button to get insight for the URI.</p>
<button onclick="Func_p()">Run</button>
<p id="demo_o"></p>
<script>
function Func_p() {
varur_i = "anusua@dutt56!meet@sometime";
var res_9 = encodeURI(ur_i);
document.getElementById("demo_o").innerHTML = res_9;
}
</script>
</body>
</html>
Output:
Example #2
This program demonstrates the comparison or minute differences existing when compared with the JavaScript encodeURI() function and JavaScript encodeURIComponent() function.
Code:
<!DOCTYPE html>
<html>
<body>
<p>Press on the button to encode an URI.</p>
<button onclick="Func_k()">Run</button>
<p id="demo_8"></p>
<script>
function Func_k() {
varur_i = "https://jhuthigh.test.98.ghty.com";
varr_l = encodeURIComponent(ur_i);
document.getElementById("demo_8").innerHTML = r_l;
}
</script>
</body>
</html>
Output:
Example #3
This program demonstrates the clear distinction and difference between the JavaScript encode URI() and JavaScript escape() functions, as shown in the output.
Code:
<!DOCTYPE html>
<html>
<body>
<script>
document.write(escape("Access help in . Get help from www.educba.com !"));
</script>
</body>
</html>
Output:
Example #4
This program demonstrates the decode URI function in corporation to encode URI function and the functionality difference between the two as shown in the output.
Code:
<!DOCTYPE html>
<html>
<body>
<p>Press the button to decode a URI once it is encoded.</p>
<button onclick="Func_g()">Run</button>
<p id="demo_7"></p>
<script>
function Func_g() {
varur_i = "www.khit.asp?ger89383_))))^./";
varen_c = encodeURI(ur_i);
varde_c = decodeURI(en_c);
var res_0 = "Encoded URI: " + en_c + "<br>" + "Decoded URI: " + de_c;
document.getElementById("demo_7").innerHTML = res_0;
}
</script>
</body>
</html>
Output:
Advantages
Every functionality has some advantages associated with it so does encodeURI functionality which is as follows :
- The encodeURI() function provides programmers with the ability to encode URIs (Uniform Resource Identifiers) easily and conveniently. It helps encode the entire set of characters in the URI and returns the encoded value as a string.
- It provides a lot of browsers compatible with a different version of the encoding URI() function.
Conclusion
Unlike other functions of encoding the sequence of characters, the encodeURI() function easily encodes the URI with the help of the function and then provides the user the end output, which helps make the overall method of character reading a bit simple and easy to implement with the user. Also, the other methods present are quite compatible and behave similarly with mere and very less changes for encoding URI.
Recommended Articles
We hope that this EDUCBA information on “JavaScript encodeURI()” was beneficial to you. You can view EDUCBA’s recommended articles for more information.