Encode a value for use inside a URL.

encode-component `encodeURIComponent` escapes spaces and punctuation that have special meaning inside URLs.

Encoding Components

label
encode_component.js
Replay: real traced execution (multi-file project)
const label = "red blue";
const encoded = encodeURIComponent(label);
const decoded = decodeURIComponent(encoded);

console.log("label=" + label);
console.log("encoded=" + encoded);
console.log("decoded=" + decoded);
const label = "a+b";
const encoded = encodeURIComponent(label);
const decoded = decodeURIComponent(encoded);

console.log("label=" + label);
console.log("encoded=" + encoded);
console.log("decoded=" + decoded);
const label = "x y";
const encoded = encodeURIComponent(label);
const decoded = decodeURIComponent(encoded);

console.log("label=" + label);
console.log("encoded=" + encoded);
console.log("decoded=" + decoded);
  1. label ← red blue, encoded ← red%20blue, decoded ← red blue

    1const label→ red blue = "red blue"; //@label="a+b", "x y"2const encoded→ red%20blue = encodeURIComponent(labelred blue);3const decoded→ red blue = decodeURIComponent(encodedred%20blue);45console.log("label=" + labelred blue);6console.log("encoded=" + encodedred%20blue);7console.log("decoded=" + decodedred blue);
    outputlabel=red blue
    encoded=red%20blue
    decoded=red blue
  1. label ← a+b, encoded ← a%2Bb, decoded ← a+b

    1const label→ a+b = "a+b";2const encoded→ a%2Bb = encodeURIComponent(labela+b);3const decoded→ a+b = decodeURIComponent(encodeda%2Bb);45console.log("label=" + labela+b);6console.log("encoded=" + encodeda%2Bb);7console.log("decoded=" + decodeda+b);
    outputlabel=a+b
    encoded=a%2Bb
    decoded=a+b
  1. label ← x y, encoded ← x%20y, decoded ← x y

    1const label→ x y = "x y";2const encoded→ x%20y = encodeURIComponent(labelx y);3const decoded→ x y = decodeURIComponent(encodedx%20y);45console.log("label=" + labelx y);6console.log("encoded=" + encodedx%20y);7console.log("decoded=" + decodedx y);
    outputlabel=x y
    encoded=x%20y
    decoded=x y