将URL参数转换为JavaScript对象

给定带有参数的URL，任务是使用JavaScript将这些参数转换为JavaScript对象。我们将讨论几种技术。

以下是将URL参数转换为JavaScript对象的方法：

使用replace()方法
使用split()方法
使用for … of循环

方法1：使用replace()方法

此方法在字符串中搜索一个定义的值或正则表达式，并返回一个带有替换定义值的新字符串。

语法：

string.replace(searchVal, newvalue)

示例： 这个示例首先获取URL的参数部分，然后使用 replace() 方法 来形成一个对象。

let search = 'https://www.geeksforgeeks.org/?param_1=val_1&x=7&y=9';
console.log(search);
search = search.split('?')[1];
 
function GFG_Fun() {
    console.log('{"' + decodeURI(search)
        .replace(/"/g, '\\"').replace(/&/g, '","')
        .replace(/=/g, '":"') + '"}');
}
GFG_Fun()

输出

https://www.geeksforgeeks.org/?param_1=val_1&x=7&y=9
{"param_1":"val_1","x":"7","y":"9"}

方法2：使用split()方法

此方法用于将字符串拆分为子字符串数组，并返回新的数组。

语法：

string.split(separator, limit)

示例： 这个示例使用了不同的方法来实现相同的功能。它先获取URL的参数部分，然后使用 replace()方法 来形成一个对象。

let search = 'https://www.geeksforgeeks.org/?param_1=val_1&x=7&y=9';
console.log(search);
search = search.split('?')[1];
 
function GFG_Fun() {
    console.log('{"' + search.replace(/&/g, '", "')
        .replace(/=/g, '":"') + '"}',
        function (key, value) {
            return key === "" ? value : decodeURIComponent(value)
        });
}
GFG_Fun()

输出

https://www.geeksforgeeks.org/?param_1=val_1&x=7&y=9
{"param_1":"val_1", "x":"7", "y":"9"} [Function (anonymous)]

方法3：使用for … of循环

在这种方法中，我们使用Url.search来获取参数
现在，将其作为参数传递给函数
现在使用for … of循环来访问所有键和值

示例：

function paramsToObject(params) {
    const obj = {};
    const para = new URLSearchParams(params);
 
    for (const [key, value] of para) {
         
        if (obj.hasOwnProperty(key)) {
            if (Array.isArray(obj[key])) {
                obj[key].push(value);
            } else {
                obj[key] = [obj[key], value];
            }
        } else {
            obj[key] = value;
        }
    }
 
    return obj;
}
let search = 'https://www.geeksforgeeks.org/?param_1=val_1&x=7&y=9';
const url = new URL(search);
const params = paramsToObject(url.search);
console.log(params);

输出