通常情况下使用框架也好, 类库也好, 在处理表单提交时, 可能需要对参数做些处理, 比如原本为数组转换为字符串逗号分隔

需求代码

  1. const params = {
  2.     name: 'name',
  3.   age: 10,
  4.   list: [1, 2, 3, 4, 5]
  5. };
  7. // 最终结果需要是 { name: 'name', age: 10, list: '1,2,3,4,5'}

解决方法

方案一

使用 JSON.stringify 的过滤方案

  1. function formatParams(params) {
  2.   const newParams = JSON.stringify(params, (key, val) => {
  3.     // 此处可以判断 key 值批量处理, 当然应该使用 if else 的方法, 不应该使用 switch
  4.     switch (true) {
  5.       case (key === 'list' && Array.isArray(val)):
  6.         return val.join(',');
  7.       default:
  8.         return val;
  9.     }
  10.   });
  11.   return JSON.parse(newParams);
  12. }

方案二

使用 Object.keys + Array.prototype.reduce 做循环

  1. function formatParams(params) {
  2.   return Object.keys(params).reduce((a, b) => {
  3.     if (b === 'list' && Array.isArray(params[b])) {
  4.       a[b] = params[b].join(',');
  5.       return a;
  6.     }
  7.     a[b] = params[b];
  8.     return a;
  9.   }, {});
  10. }

方案三

使用 for in 遍历对象

  1. function formatParams(params) {
  2.   let newParams = {};
  3.   for (const key in params) {
  4.     if (key === 'list' && Array.isArray(params[key])) {
  5.       newParams[key] = params[key].join(',');
  6.       break;
  7.     }
  8.     newParams[key] = params[key];
  9.   }
  10.   return newParams;
  11. }

方案四

直接利用对象 key 的唯一性进行覆盖, 最简单直接

  1. function formatParams(params) {
  2.   return {
  3.     ...params,
  4.     list: Array.isArray(params.list) ? params.list.join(',') : params.list,
  5.   }
  6. }

其他方案

待研究

总结

当然每种方法都有利有弊, 使用循环的做法效率比较低, 但可以批量执行, 直接转换的方案效率比较高, 但必须要明确知道要转换的 key 值