JavaScript 代码优化:使用 URLSearchParams 简化 URL 参数拼接
优化后的代码如下:
const keyMap = {
'customerVisitNum': { 'followupType': 3 },
'technicalExchangeNum': { 'followupType': 1 },
'liveDemonstrationNum': { 'followupType': 2 },
'workPlanDay': { 'activeTabKey': 'day' },
'workPlanWeekly': { 'activeTabKey': 'week' },
'curCustomerNum': { 'employeeViewMy': true },
'currentCustomerLink': { 'timeType': 'current', 'employeeViewMy': true }
};
const params = keyMap[key] || {};
url && uni.navigateTo({
url: `${url}?${new URLSearchParams({ ...params, ...customParams }).toString()}`
});
其中,keyMap 对象存储了各个 key 对应的参数,如果有对应的参数,则将其加入到 URLSearchParams 对象中,再拼接到 url 中。customParams 为自定义参数,可以在调用时传入。
优化后的代码优点:
- 代码更简洁: 使用 URLSearchParams 对象可以有效减少代码量,使代码更简洁易懂。
- 可读性更高: 使用 key-value 的形式存储参数,更易于理解和维护。
- 可扩展性强: 可以方便地添加新的参数,无需修改原有代码逻辑。
使用 URLSearchParams 对象的步骤:
- 创建 URLSearchParams 对象:
new URLSearchParams() - 使用
set()方法添加参数:URLSearchParams.set('key', 'value') - 使用
toString()方法获取参数字符串:URLSearchParams.toString()
示例:
const params = new URLSearchParams();
params.set('name', 'John Doe');
params.set('age', 30);
const url = 'https://www.example.com';
const finalUrl = `${url}?${params.toString()}`;
console.log(finalUrl); // https://www.example.com?name=John%20Doe&age=30
使用 URLSearchParams 对象可以使代码更加优雅和高效,建议在开发中使用此方法来处理 URL 参数。
原文地址: https://www.cveoy.top/t/topic/mhCA 著作权归作者所有。请勿转载和采集!