JavaScript でクエリ文字列パラメータをエレガントに削除する

URL を操作する場合、多くの場合、クエリ文字列パラメータを操作する必要があります。一般的なタスクの 1 つは、特定のパラメータを削除することです。正規表現は解決策にはなりますが、エラーが発生しやすく柔軟性に欠ける可能性があります。

より良いアプローチ: 解析と操作

正規表現を使用する代わりに、クエリ文字列をオブジェクトに取り込んで操作し、URL を再構築します。このアプローチにはいくつかの利点があります。

• シンプルさ: 読み取りと書き込みが簡単。
• 柔軟性: 複雑なパラメータ名と値を処理できる。 .
• 安全性: 無関係なファイルの不注意な変更を防ぎます。 parameters.

実装

このアプローチを使用する JavaScript 関数の例を次に示します。

function removeURLParameter(url, parameter) {
    // Split the URL into parts
    var urlparts = url.split('?');

    // Check if the URL has a query string
    if (urlparts.length >= 2) {
        var prefix = encodeURIComponent(parameter)   '=';
        var pars = urlparts[1].split(/[&;]/g);

        // Iterate over the parameters
        for (var i = pars.length; i-- > 0;) {
            // Remove the parameter if it matches the prefix
            if (pars[i].lastIndexOf(prefix, 0) !== -1) {
                pars.splice(i, 1);
            }
        }

        // Reconstruct the URL
        return urlparts[0]   (pars.length > 0 ? '?'   pars.join('&') : '');
    }

    // Return the original URL if no query string
    return url;
}

使用法:

この関数を使用するには、元の URL と削除するパラメータを渡すだけです。例:

const updatedURL = removeURLParameter('https://example.com?foo=bar&baz=qux', 'foo');

これは、 「foo」パラメータを含まない URL:

https://example.com?baz=qux

このアプローチを使用すると、クエリ文字列パラメータをより簡単かつ確実に操作できます。これにより、意図したパラメータのみが変更されるようになり、コードを壊す可能性のある誤った変更が防止されます。