JavaScript
 Computer >> コンピューター >  >> プログラミング >> JavaScript

JavaScriptでエンコードされた文字列をデコードする方法【unescape()の使い方を解説】

デコード（Decoding）とは

JavaScriptでは、escape()メソッドによってエンコードされた文字列を元の状態に戻す（デコードする）際に、unescape()メソッドを使用します。このメソッドは、エンコード済みの文字列を引数として受け取り、その中に含まれる16進数表記の文字（例：%21など）を、対応する実際の文字へと置き換えて返します。

構文

unescape(string)

引数には、escape()でエンコードした文字列を指定します。

使用例1：特殊文字（!）のデコード

次の例では、まずescape()メソッドを使って2つの感嘆符「!!」を16進数表記に変換しています。続けて、unescape()メソッドでそれらを元の自然な文字に復元しています。

<html>
<body>
<script type="text/javascript">
    // escape関数で特殊文字をエンコード
    var str = escape("Tutorialspoint!!");
    document.write("</br>");
    document.write("Encoded : " + str);
    // unescape()関数でデコード
    document.write("Decoded : " + unescape(str));
</script>
</body>
</html>

出力結果

Encoded : Tutorialspoint%21%21
Decoded : Tutorialspoint!!


使用例2：「.（ドット）」と「@（アットマーク）」の扱い

ここで注意すべき点として、「.（ドット）」と「@（アットマーク）」の2文字は例外であり、16進数には変換されません。次のコードでは、escape()メソッドを実行しても、メールアドレス内のドットと@はそのままの形で残ります。

<html>
<body>
<script type="text/javascript">
    str = escape("My gmail address is robbinhood@rocketmail.com");
    document.write("Encoded : " + str);
    document.write("</br>");
    // unescape()関数でデコード
    document.write("Decoded : " + unescape(str));
</script>
</body>
</html>

出力結果

Encoded : My%20gmail%20address%20is%20robbinhood@rocketmail.com
Decoded : My gmail address is robbinhood@rocketmail.com


補足：非推奨APIについての注意点

なお、escape()およびunescape()は現在では非推奨（deprecated）とされており、最新のJavaScript環境ではencodeURIComponent()およびdecodeURIComponent()の使用が推奨されています。後者の組み合わせは、日本語などのマルチバイト文字も正しくエンコード・デコードできるため、実務での開発においてはこちらを採用することをおすすめします。既存コードでescape()／unescape()を見かけた場合は、置き換えを検討するとよいでしょう。

  1. JavaScriptで文字列を検索する方法【search()メソッドの使い方を解説】

    JavaScriptで文字列を検索する方法 JavaScriptで文字列の中から特定の文字列を探すには、search()メソッドを使用します。このメソッドは、引数に渡した文字列（または正規表現）が対象の文字列内で最初に一致した位置（インデックス）を返し、見つからなかった場合は -1 を返します。 以下は、JavaScriptで文字列を検索するサンプルコードです。 サンプルコード <!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8" />

  2. 文字列をJavaScriptオブジェクトに変換する方法【JSON.parse()の使い方】

    JavaScriptでJSON形式の文字列をオブジェクトに変換するには、JSON.parse()メソッドを使用します。このメソッドは、引数に渡された文字列を解析（パース）し、対応するJavaScriptオブジェクトを返します。 サンプルコード <!DOCTYPE html> <html lang=ja> <head> <meta charset=UTF-8 /> <meta name=viewport content=width=device-width, initial-scale=1.0 /> <title>Docum