Code has been added to clipboard!

decodeURIComponent

Reading time 2 min
Published Sep 8, 2017
Updated Oct 2, 2019

decodeURIComponent: Main Tips

  • This function is used to decode URI components.
  • The decodeURIComponent() function is useful when you want a URL encoded using encodeURIComponent() to become functional again.

What decodeURIComponent Is

The decodeURIComponent() function is used to decode URI components. In other words, it is useful when you want a quick function for a URL decode. The abbreviation URI refers to a URI.js library used to manage URLs.

As you can see from the example below, once the JavaScript URL decode is applied, the URI is no longer encoded:

Example
var encode = encodeURIComponent(string);
var decode = decodeURIComponent(encode);

Tip: To encode URI components, use encodeURIComponent() function.

Correct Syntax

The standard syntax for JavaScript decodeURIComponent function is not complicated. It is easy to understand even for those who are only starting to learn to code. Nevertheless, you should remember the set capitalization of it if you want your code to work and be less difficult to manage:

decodeURIComponent(uri)

As you can see, you should not have any issues when handling decodeURIComponent parameters. The only feature to bear in mind is that the URI parameter must be included. In other words, the function won't know which URI to decode if you won't specify the previous URI, created with encodeURIComponent.

Return Value

As most JavaScript functions, decodeURIComponent() has a return value. To put it simply, it is represents the decoded URI. This value contains textual data, therefore it is classified as a string.

In the example provided above, you have seen the same URI, both encoded and decoded. Review it again to see and understand the differences. Grasp them, memorize the syntax, and you're good to go!

What Is JavaScript Used For?
Tutorial
Introduction
Output
Syntax
Comment
Commands
Operators
Comparison and Logical Operators
Data Types
Math.random()
Type Conversion
Function Definitions
Events
Objects
Object Properties
Prototype
Array
Sorting Arrays
Strings
Numbers
Number Format
Math Object
Onclick Event
Date
Date Formats
Scope
Regular Expressions
Reserved Words
Common Mistakes
Performance
Forms
Form Validation
Window: The Browser Object Model
Popup Boxes
Cookies
JSON
AJAX Introduction
AJAX Form
Automatic File Download
Functions
Array Methods
String Methods
Date Methods
Timing Events
Cheat Sheet
JavaScript in HTML
HTML DOM Methods
HTML DOM Changing HTML
HTML DOM Animation
HTML DOM EventListener
HTML DOM Navigation
HTML DOM NodeList
HTML DOM Element Nodes
Array Functions
Boolean
Calling a Function
Date Functions
Global Objects
Input Text
Operator
Statements
String Functions
Math
Math.random
Number
RegEx
alert
array.filter
array.length
array.map
array.reduce
array.push
array.sort
break and continue
className
confirm
decodeURIComponent
for
forEach
if
indexOf
innerHTML
location.reload
number.toString
onclick
onload
parseInt
prompt
replace
setAttribute
setInterval
setTimeout
slice
splice
string.includes
string.indexOf
string.split
style.display
submit
substr
substring
switch
test
throw, try and catch
toLowerCase
toUpperCase
use strict
while
window.history
window.location
window.navigator
window.screen