lodash实践之依据规则处理对象
一.要解决的问题
在实际开发中，如果你遇到需要对一个比较复杂的对象删除某些变量，或者替换某些变量的场景，你会怎么处理呢？
比如：
const target = {
a: 1,
b: {
n: 2,
m: 3
},
c: 1,
d: {
n: 2,
m: 3
}
}
你需要对target对象做以下处理：
- 删除a和b.n参数，并且b.m如果小于2的话进行删除
- 替换c值和d.n值为9，并且替换d.m的值为(a+c)
你是否采用了下面的方式处理：
target.c = 9
target.d.n = 9
target.d.m = target.a + target.c
delete target.a
delete target.b.n
if (target.b.m < 2) delete target.b.m
如果规则简单，可能用上面的方式就足够了，但如果需要要处理的规则越来越多的话，这样写一是不好维护，别的童鞋可能要看半天，二是写的时候也麻烦。那么，如果把规则定义为一个变量，丢给一个工具函数来执行，这样会不会比较直观和好处理呢？
二.希望的使用方式
希望实现一个executor函数
/***
* executor 根据匹配规则处理对象的执行器
* @param targets 处理的对象列表
* @param rules 处理规则列表
* @return 规范化的对象列表
*/
const executor = (targets: Partial<object>[], rules: Record<string, Record<string, any>>): any[] => {}
然后书写规则，执行该函数
const rules = {
delete: {
'[a,b.n]': true,
'b.m': (obj) => obj.b.m > 2
},
replace: {
'[c,d.n]': () => [9, 9],
'd.m': (obj) => obj.a + obj.c
}
}
const [result] = executor([target], rules)
console.log('处理结果：', result)
规则定义有两种，一种的delete删除，一种是replace替换。
- delete规则:
- key表示单变量如'b.m'，也可以是用[]中括号括起来的多变量如'[a,b.n]'
- value值可以是布尔值或者函数（参数为处理的对象），结果是true表示删除，如果是[]中括号括起来的多变量，会批量处理。
- replace规则：
- key表示单变量如'd.m'，也可以是用[]中括号括起来的多变量如'[c,d.n]'
- value值可以是某个类型值，或处理函数（参数为处理的对象，如果key为多变量，则需要返回多变量对应的值的数组集合）
三.实现方法
首先，我们要写一个函数，类似如可以将参数路径'd.m'的值为v这个信息，转为一个对象类型{d: {m: v}}
/***
* converter 将字符串参数路径转为对象
* @param path 字符串形式的对象参数路径
* @param val 参数的值
* @return 对象
*/
const converter = (path: string, val: any) => {
const keys = path.split(/\.|\[|\]/).filter(i => i)
const obj: Record<string, any> = {}
keys.reduce((pre: Record<string, any>, cur: string) => {
const index = keys.indexOf(cur)
pre[cur] = index === keys.length - 1 ? val : {}
if (!Object.keys(obj).length) {
obj[cur] = pre[cur]
}
return pre[cur]
}, {})
return obj
}
converter函数主要用reduce实现，converter用法是：
const obj = converter('d.m', 9)
console.log(obj)
// {
// d: {
// m: 9
// }
// }
接下来，重点来了：
import omit from 'lodash/omit'
import merge from 'lodash/merge'
/***
* executor 根据匹配规则处理对象的执行器
* @param targets 处理的对象列表
* @param rules 处理规则列表
* @return 规范化的对象列表
*/
const executor = (targets: Partial<object>[], rules: Record<string, Record<string, any>>): any[] => {
const isMultkeys: Function = (k: string): boolean => /^\[.+\,.+\]$/.test(k)
const isArray: Function = (r: any): boolean => Array.isArray(r)
const getMultkeys: Function = (k: string): string[] => k.replace(/^\[(.*)\]$/, ($1, $2) => $2).split(',')
const orders: string[] = ['replace', 'delete'] // 严格控制执行顺序
return targets.map(target => {
orders.forEach((method: string) => {
const params: Record<string, any> = rules[method]
if (!params) return
switch (method) {
case 'delete':
const keys: string[] = Object.entries(params).reduce((p: string[], [k, v]: any) => {
v = typeof v === 'function' ? v(target) : v
if (!v) return p
if (isMultkeys(k)) {
let ks = getMultkeys(k)
ks =
(isArray(v) &&
v.reduce((r: string[], c: boolean, i: number) => {
c && r.push(ks[i])
return r
}, [])) ||
ks
p = p.concat(ks)
} else {
p.push(k)
}
return p
}, [])
target = omit(target, keys)
break
case 'replace':
target = Object.entries(params).reduce((p: Record<string, any>, [k, v]: any) => {
v = typeof v === 'function' ? v(target) : v
if (isMultkeys(k) && isArray(v)) {
const ks = getMultkeys(k)
const o = v.reduce((r: Record<string, any>, c: any, i: number) => {
r = merge(r, converter(ks[i], c))
return r
}, {})
p = merge(p, o)
} else {
p = merge(p, converter(k, v))
}
return p
}, target)
break
}
})
return target
})
}
有几个实现注意点：
- delete和replace都需要对value进行类型判断，如果是函数的话，取函数执行结果。replace还需要额外处理多变量的key-value情况。
- delete主要是用lodash/omit实现的，比较方便，omit可以这样使用：
const object = { a: 1, b: {n: 9, m: 9} }; omit(object, ['a', 'b.n']); console.log(object) // { b: {m: 9} } - replace主要是用lodash/merge实现的，merge好在合并多个对象的时候，如果参数是引用类型的，不会完全被覆盖，如：
const result = merge({} , {b: {n: 1, m: 2}}, {b: {n: 9}}) console.log(result) // {b: {n: 9, m: 2}} - replace处理key值为'd.m'的多路径变量，就是先计算出值，然后使用刚刚实现的converter方法来转化为对象，再将该对象merge到原来的target中。
- 执行顺序需要控制先replace后delete。
四.总结
- 在实践中，会发现lodash越来越多这好用的小函数，建议大家有空可以逛逛lodash的文档
- reduce函数也挺好用的，现在用上瘾了
- 在处理实际问题的时候，可以多思考怎么处理更好维护，别人一看就明白，定制使用感不错的工具函数，造福大家，哈哈哈哈
