decodeURIComponent() function in JavaScript

The decodeURIComponent() function accepts a string value representing an encoded URI (Uniform Resource Identifier), decodes it, and returns the result. It reverses the encoding done by encodeURIComponent().

Syntax

decodeURIComponent(encodedURI)

Parameters

encodedURI: A string representing an encoded URI component that you want to decode.

Return Value

Returns a new string representing the decoded version of the given encoded URI component.

Example

<html>
<head>
    <title>JavaScript Example</title>
</head>
<body>
    <script type="text/javascript">
        var encodedData = encodeURIComponent('http://www.qries.com/?x=?????');
        document.write("Encoded Data: " + encodedData);
        document.write("<br>");
        var decodedData = decodeURIComponent(encodedData);
        document.write("Decoded Data: " + decodedData);
    </script>
</body>
</html>

Output

Encoded Data: http%3A%2F%2Fwww.qries.com%2F%3Fx%3D%D1%88%D0%B5%D0%BB%D0%BB%D1%8B
Decoded Data: http://www.qries.com/?x=?????

Common Use Cases

<html>
<head>
    <title>decodeURIComponent Examples</title>
</head>
<body>
    <script type="text/javascript">
        // Decoding special characters
        var encoded1 = "Hello%20World%21";
        document.write("Decoded: " + decodeURIComponent(encoded1));
        document.write("<br>");
        
        // Decoding email addresses
        var encoded2 = "user%40example.com";
        document.write("Email: " + decodeURIComponent(encoded2));
        document.write("<br>");
        
        // Decoding query parameters
        var encoded3 = "name%3DJohn%26age%3D25";
        document.write("Query: " + decodeURIComponent(encoded3));
    </script>
</body>
</html>

Output

Decoded: Hello World!
Email: user@example.com
Query: name=John&age=25

Error Handling

If the input contains invalid percent-encoded sequences, decodeURIComponent() throws a URIError:

<html>
<head>
    <title>Error Handling Example</title>
</head>
<body>
    <script type="text/javascript">
        try {
            var result = decodeURIComponent("%E0%A4%A");  // Invalid sequence
            document.write("Result: " + result);
        } catch (error) {
            document.write("Error: " + error.name + " - " + error.message);
        }
    </script>
</body>
</html>

Output

Error: URIError - URI malformed

Conclusion

The decodeURIComponent() function is essential for processing URL-encoded data in web applications. Always use try-catch blocks when decoding untrusted input to handle potential URIError exceptions.

Updated on: 2026-03-15T23:18:59+05:30

340 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements