decodeURIComponent()

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since 2015年7月.

decodeURIComponent() 関数は、encodeURIComponent() 関数あるいは同様のルーチンによって事前に作成された URI (Uniform Resource Identifier; 統一資源識別子) の構成要素をデコードします。

試してみましょう

function containsEncodedComponents(x) {
  // ie ?,=,&,/ etc
  return decodeURI(x) !== decodeURIComponent(x);
}

console.log(containsEncodedComponents("%3Fx%3Dtest")); // ?x=test
// 予想される結果: true

console.log(containsEncodedComponents("%D1%88%D0%B5%D0%BB%D0%BB%D1%8B")); // шеллы
// 予想される結果: false

構文

decodeURIComponent(encodedURI)

引数

encodedURI

エンコードされた URI の構成要素です。

返値

エンコードされた統一資源識別子 (URI) の構成要素をデコードしたものを表す新しい文字列です。

例外

URIError

encodedURI に 2 桁の 16 進数字が続かない % が含まれている場合、またはエスケープシーケンスが有効な UTF-8 文字をエンコードしていない場合に発生します。

解説

decodeURIComponent() は、グローバルオブジェクトの関数プロパティです。

decodeURIComponent() は、 decodeURI() で記述されているのと同じデコードアルゴリズムを使用します。これは、-.!~*'() など、 encodeURIComponent によって生成されていないエスケープシーケンスも、すべてデコードします。

例

キリル文字の URL の構成要素をデコード

js
decodeURIComponent("JavaScript_%D1%88%D0%B5%D0%BB%D0%BB%D1%8B");
// "JavaScript_шеллы"

エラーの捕捉

js
try {
  const a = decodeURIComponent("%E0%A4%A");
} catch (e) {
  console.error(e);
}

// URIError: malformed URI sequence

URL からのクエリー引数のデコード

decodeURIComponent() は、URL からのクエリー引数を解析するために直接使用することはできません。少し準備が必要です。

js
function decodeQueryParam(p) {
  return decodeURIComponent(p.replace(/\+/g, " "));
}

decodeQueryParam("search+query%20%28correct%29");
// 'search query (correct)'