在 JavaScript 中使用递归逻辑高效提取嵌套 URL 参数

设想

使用给定的搜索参数键（例如 from）从 URL 部分内的嵌套 URL 中提取目标搜索参数的值（例如 id）。

例如，对于 URL /main?from=/details?from=/more?id=456，函数 getNestedSearchParamValue 通过查找搜索参数来提取嵌套 URL。

...

const nestedUrl = new URL(urlPart, dummyUrl);

const nestedUrlPart = nestedUrl.searchParams.get(nestedParamKey) ?? "";

...

首先，提取嵌套 URL /details?from=/more?id=456。由于 URL 包含另一个 from 搜索参数，因此 getNestedSearchParamValue 函数会调用自身，将提取的 URL /details?from=/more?id=456 作为 urlPart 传递，以及相同的nestedParamKey (from) 和 targetParamKey (id)。

...

if(nestedUrlPart.includes(nestedParamKey)){
    return getNestedSearchParamValue(nestedUrlPart, nestedParamKey, targetParamKey);
}

...

在第一次递归调用中，nestedUrlPart 变为 /more?id=456。由于此 URL 不包含来自 (nestedParamKey) 的搜索参数，因此表明这是搜索 id 参数 (targetParamKey) 的目标 URL。因此，从该 url 部分中提取搜索参数 id 的值。

...

else {
    const targetUrl = new URL(nestedUrlPart, dummyUrl);
    return targetUrl.searchParams.get(targetParamKey);
}

...

功能

const dummyUrl = "http://localhost";

function getNestedSearchParamValue(urlPart: string, nestedParamKey: string, targetParamKey: string): string | null {
    const nestedUrl = new URL(urlPart, dummyUrl);

    const nestedUrlPart = nestedUrl.searchParams.get(nestedParamKey) ?? "";
    if(!nestedUrlPart){
        return null;
    }
    if(nestedUrlPart.includes(nestedParamKey)){
        return getNestedSearchParamValue(nestedUrlPart, nestedParamKey, targetParamKey);
    }
    else {
        const targetUrl = new URL(nestedUrlPart, dummyUrl);
        return targetUrl.searchParams.get(targetParamKey);
    }
}

用法

const url = "/main?from=/details?from=/more?id=456";

const value = getNestedSearchParamValue(url, "from", "id");
console.log(value);

输出

[LOG]: "456" 

替代方案：使用 URLSearchParams

使用辅助函数 getUrlPartSearchParams

const queryDelimiter = "?";

function getUrlPartSearchParams(urlPart: string):URLSearchParams | null {
    const [_, ...query] = urlPart.split(queryDelimiter);
    const queryStr = query.join(queryDelimiter);
    return new URLSearchParams(queryStr);
}

函数 getNestedSearchParamValue 变为

function getNestedSearchParamValue(urlPart: string, nestedParamKey: string, targetParamKey: string): string | null {
    let searchParams = getUrlPartSearchParams(urlPart);

    const nestedUrlPart = searchParams?.get(nestedParamKey);
    // console.log(nestedUrlPart)
    if(!nestedUrlPart) {
        return null;
    }
    if (nestedUrlPart.includes(nestedParamKey)) {
        return getNestedSearchParamValue(nestedUrlPart, nestedParamKey, targetParamKey);
    } else {
        searchParams = getUrlPartSearchParams(nestedUrlPart);
        return searchParams?.get(targetParamKey) ?? null;
    }
}

资源

• https://developer.mozilla.org/en-US/docs/Web/API/URL

• https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/rest_parameters

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String/split

• https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/join

以上是在 JavaScript 中使用递归逻辑高效提取嵌套 URL 参数的详细内容。更多信息请关注PHP中文网其他相关文章！