SlideShare a Scribd company logo
1 of 4
Download to read offline
JS NUGGETS
encodeURI()
Used to encode a URI by replacing URL
reserved characters with their UTF-8 encoding.
const url = 'https://jsnuggets.com?todays #post';
encodeURI(url);
// "https://jsnuggets.com?todays%20#post"
decodeURI()
Used to decode the URI encoded by
encodeURI().
const url = 'https://jsnuggets.com?todays%20#post';
decodeURI(url);
// 'https://jsnuggets.com?todays #post';
encodeURIComponent()
encodeURIComponent is designed to encode
everything, where encodeURI ignores a URL's
domain related roots. In addition, it encodes
the following characters as well: , / ? : @ & =
+ $ #
const url = 'https://jsnuggets.com?todays #post';
encodeURIComponent(url);
// https%3A%2F%2Fjsnuggets.com%3Ftodays%20%23post
decodeURIComponent()
To decode the URI encoded by
encodeURIComponent().
const url =
'https%3A%2F%2Fjsnuggets.com%3Ftodays%20%23post';
decodeURIComponent(url);
// https://jsnuggets.com?todays #post
Works effectively on browser console too!!
const emoji = encodeURI('😉');
// %F0%9F%98%89
decodeURI(emoji);
// 😉

More Related Content

What's hot

Phantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on HerokuPhantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on HerokuShinichi Tomita
 
Integração contínua com Hudson CI
Integração contínua com Hudson CIIntegração contínua com Hudson CI
Integração contínua com Hudson CIAlmir Mendes
 
Beyond Golden Containers: Complementing Docker with Puppet
Beyond Golden Containers: Complementing Docker with PuppetBeyond Golden Containers: Complementing Docker with Puppet
Beyond Golden Containers: Complementing Docker with Puppetlutter
 
الجيل الثاني من شبكات المعلومات
الجيل الثاني من شبكات المعلوماتالجيل الثاني من شبكات المعلومات
الجيل الثاني من شبكات المعلوماتabedelaziz benzine
 
新建 文本文档
新建 文本文档新建 文本文档
新建 文本文档mytwice
 
Secure Payments Over Mixed Communication Media
Secure Payments Over Mixed Communication MediaSecure Payments Over Mixed Communication Media
Secure Payments Over Mixed Communication MediaJonathan LeBlanc
 
SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon
 SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon
SSH I/O Streaming via Redis-based Persistent Message Queue -Mani TadayonRedis Labs
 
Implementing JMS Integration Solutions with WSO2 ESB
Implementing JMS Integration Solutions with WSO2 ESBImplementing JMS Integration Solutions with WSO2 ESB
Implementing JMS Integration Solutions with WSO2 ESBWSO2
 

What's hot (11)

Embedding perl
Embedding perlEmbedding perl
Embedding perl
 
Phantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on HerokuPhantomjs Screenshot Server on Heroku
Phantomjs Screenshot Server on Heroku
 
Integração contínua com Hudson CI
Integração contínua com Hudson CIIntegração contínua com Hudson CI
Integração contínua com Hudson CI
 
CGI.pm - 3ло?!
CGI.pm - 3ло?!CGI.pm - 3ло?!
CGI.pm - 3ло?!
 
Token based-oauth2
Token based-oauth2Token based-oauth2
Token based-oauth2
 
Beyond Golden Containers: Complementing Docker with Puppet
Beyond Golden Containers: Complementing Docker with PuppetBeyond Golden Containers: Complementing Docker with Puppet
Beyond Golden Containers: Complementing Docker with Puppet
 
الجيل الثاني من شبكات المعلومات
الجيل الثاني من شبكات المعلوماتالجيل الثاني من شبكات المعلومات
الجيل الثاني من شبكات المعلومات
 
新建 文本文档
新建 文本文档新建 文本文档
新建 文本文档
 
Secure Payments Over Mixed Communication Media
Secure Payments Over Mixed Communication MediaSecure Payments Over Mixed Communication Media
Secure Payments Over Mixed Communication Media
 
SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon
 SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon
SSH I/O Streaming via Redis-based Persistent Message Queue -Mani Tadayon
 
Implementing JMS Integration Solutions with WSO2 ESB
Implementing JMS Integration Solutions with WSO2 ESBImplementing JMS Integration Solutions with WSO2 ESB
Implementing JMS Integration Solutions with WSO2 ESB
 

More from Ideas2IT Technologies

Iterables and Iterators in JavaScript
Iterables and Iterators in JavaScriptIterables and Iterators in JavaScript
Iterables and Iterators in JavaScriptIdeas2IT Technologies
 
Performance analysis in merging arrays - JavaScript
Performance analysis in merging arrays - JavaScriptPerformance analysis in merging arrays - JavaScript
Performance analysis in merging arrays - JavaScriptIdeas2IT Technologies
 
Conditionally add keys in JavaScript
Conditionally add keys in JavaScriptConditionally add keys in JavaScript
Conditionally add keys in JavaScriptIdeas2IT Technologies
 
What is Big O in JavaScript - Part-1
What is Big O in JavaScript - Part-1What is Big O in JavaScript - Part-1
What is Big O in JavaScript - Part-1Ideas2IT Technologies
 
Formidable ES6 spread operator in JavaScript
Formidable ES6 spread operator in JavaScriptFormidable ES6 spread operator in JavaScript
Formidable ES6 spread operator in JavaScriptIdeas2IT Technologies
 

More from Ideas2IT Technologies (20)

Version comaparison in JavaScript
Version comaparison in JavaScriptVersion comaparison in JavaScript
Version comaparison in JavaScript
 
Currying in JavaScript
Currying in JavaScriptCurrying in JavaScript
Currying in JavaScript
 
JS Testing Frameworks
JS Testing FrameworksJS Testing Frameworks
JS Testing Frameworks
 
Iterables and Iterators in JavaScript
Iterables and Iterators in JavaScriptIterables and Iterators in JavaScript
Iterables and Iterators in JavaScript
 
String comparison in javascript
String comparison in javascriptString comparison in javascript
String comparison in javascript
 
JavaScript symbols
JavaScript symbolsJavaScript symbols
JavaScript symbols
 
Json.parse() in JavaScript
Json.parse() in JavaScriptJson.parse() in JavaScript
Json.parse() in JavaScript
 
Bubble sort in Java Script
Bubble sort in Java ScriptBubble sort in Java Script
Bubble sort in Java Script
 
Performance analysis in merging arrays - JavaScript
Performance analysis in merging arrays - JavaScriptPerformance analysis in merging arrays - JavaScript
Performance analysis in merging arrays - JavaScript
 
Nullish coalescing in JavaScript
Nullish coalescing in JavaScriptNullish coalescing in JavaScript
Nullish coalescing in JavaScript
 
Conditionally add keys in JavaScript
Conditionally add keys in JavaScriptConditionally add keys in JavaScript
Conditionally add keys in JavaScript
 
What is Big O in JavaScript - Part-1
What is Big O in JavaScript - Part-1What is Big O in JavaScript - Part-1
What is Big O in JavaScript - Part-1
 
Variable hoisting in JavaScript
Variable hoisting in JavaScriptVariable hoisting in JavaScript
Variable hoisting in JavaScript
 
Formidable ES6 spread operator in JavaScript
Formidable ES6 spread operator in JavaScriptFormidable ES6 spread operator in JavaScript
Formidable ES6 spread operator in JavaScript
 
Logging in JavaScript - Part-5
Logging in JavaScript - Part-5Logging in JavaScript - Part-5
Logging in JavaScript - Part-5
 
Logging in JavaScript - Part-4
Logging in JavaScript - Part-4Logging in JavaScript - Part-4
Logging in JavaScript - Part-4
 
Logging in JavaScript - Part-3
Logging in JavaScript - Part-3Logging in JavaScript - Part-3
Logging in JavaScript - Part-3
 
Logging in JavaScript - part-2
Logging in JavaScript - part-2Logging in JavaScript - part-2
Logging in JavaScript - part-2
 
Logging in JavaScript - part-1
Logging in JavaScript - part-1Logging in JavaScript - part-1
Logging in JavaScript - part-1
 
Array vs set in JavaScript
Array vs set in JavaScriptArray vs set in JavaScript
Array vs set in JavaScript
 

Recently uploaded

The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfPower Karaoke
 
MYjobs Presentation Django-based project
MYjobs Presentation Django-based projectMYjobs Presentation Django-based project
MYjobs Presentation Django-based projectAnoyGreter
 
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...OnePlan Solutions
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...OnePlan Solutions
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsAhmed Mohamed
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio, Inc.
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...gurkirankumar98700
 
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024StefanoLambiase
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataBradBedford3
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantAxelRicardoTrocheRiq
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...Christina Lin
 
chapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptchapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptkotipi9215
 
英国UN学位证,北安普顿大学毕业证书1:1制作
英国UN学位证,北安普顿大学毕业证书1:1制作英国UN学位证,北安普顿大学毕业证书1:1制作
英国UN学位证,北安普顿大学毕业证书1:1制作qr0udbr0
 
Intelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmIntelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmSujith Sukumaran
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaHanief Utama
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)OPEN KNOWLEDGE GmbH
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideChristina Lin
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureDinusha Kumarasiri
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - InfographicHr365.us smith
 

Recently uploaded (20)

The Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdfThe Evolution of Karaoke From Analog to App.pdf
The Evolution of Karaoke From Analog to App.pdf
 
MYjobs Presentation Django-based project
MYjobs Presentation Django-based projectMYjobs Presentation Django-based project
MYjobs Presentation Django-based project
 
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...
Maximizing Efficiency and Profitability with OnePlan’s Professional Service A...
 
Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...Advancing Engineering with AI through the Next Generation of Strategic Projec...
Advancing Engineering with AI through the Next Generation of Strategic Projec...
 
Unveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML DiagramsUnveiling Design Patterns: A Visual Guide with UML Diagrams
Unveiling Design Patterns: A Visual Guide with UML Diagrams
 
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed DataAlluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
Alluxio Monthly Webinar | Cloud-Native Model Training on Distributed Data
 
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
(Genuine) Escort Service Lucknow | Starting ₹,5K To @25k with A/C 🧑🏽‍❤️‍🧑🏻 89...
 
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024
Dealing with Cultural Dispersion — Stefano Lambiase — ICSE-SEIS 2024
 
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer DataAdobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
Adobe Marketo Engage Deep Dives: Using Webhooks to Transfer Data
 
Salesforce Certified Field Service Consultant
Salesforce Certified Field Service ConsultantSalesforce Certified Field Service Consultant
Salesforce Certified Field Service Consultant
 
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
ODSC - Batch to Stream workshop - integration of Apache Spark, Cassandra, Pos...
 
chapter--4-software-project-planning.ppt
chapter--4-software-project-planning.pptchapter--4-software-project-planning.ppt
chapter--4-software-project-planning.ppt
 
英国UN学位证,北安普顿大学毕业证书1:1制作
英国UN学位证,北安普顿大学毕业证书1:1制作英国UN学位证,北安普顿大学毕业证书1:1制作
英国UN学位证,北安普顿大学毕业证书1:1制作
 
Intelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalmIntelligent Home Wi-Fi Solutions | ThinkPalm
Intelligent Home Wi-Fi Solutions | ThinkPalm
 
React Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief UtamaReact Server Component in Next.js by Hanief Utama
React Server Component in Next.js by Hanief Utama
 
Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)Der Spagat zwischen BIAS und FAIRNESS (2024)
Der Spagat zwischen BIAS und FAIRNESS (2024)
 
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop SlideBuilding Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
Building Real-Time Data Pipelines: Stream & Batch Processing workshop Slide
 
Implementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with AzureImplementing Zero Trust strategy with Azure
Implementing Zero Trust strategy with Azure
 
Asset Management Software - Infographic
Asset Management Software - InfographicAsset Management Software - Infographic
Asset Management Software - Infographic
 
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort ServiceHot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
Hot Sexy call girls in Patel Nagar🔝 9953056974 🔝 escort Service
 

Cool usage of Encoding and Decoding a URI in Javascript

  • 2. encodeURI() Used to encode a URI by replacing URL reserved characters with their UTF-8 encoding. const url = 'https://jsnuggets.com?todays #post'; encodeURI(url); // "https://jsnuggets.com?todays%20#post" decodeURI() Used to decode the URI encoded by encodeURI(). const url = 'https://jsnuggets.com?todays%20#post'; decodeURI(url); // 'https://jsnuggets.com?todays #post';
  • 3. encodeURIComponent() encodeURIComponent is designed to encode everything, where encodeURI ignores a URL's domain related roots. In addition, it encodes the following characters as well: , / ? : @ & = + $ # const url = 'https://jsnuggets.com?todays #post'; encodeURIComponent(url); // https%3A%2F%2Fjsnuggets.com%3Ftodays%20%23post decodeURIComponent() To decode the URI encoded by encodeURIComponent(). const url = 'https%3A%2F%2Fjsnuggets.com%3Ftodays%20%23post'; decodeURIComponent(url); // https://jsnuggets.com?todays #post
  • 4. Works effectively on browser console too!! const emoji = encodeURI('😉'); // %F0%9F%98%89 decodeURI(emoji); // 😉