在日常开发中,您是不是有这种苦恼,遇到需要取层级特别深的数据结构,心里是不是很没底?不管是服务端返回的数据,还是咱们客户端自己的数据,自己各种判断?a ? : (a.b ? a.b : null) : null;
1.方法
/**
* 数据可选链获取
* @param {*} data 数据源
* @param {string|array} path 路径
* @param {*} defaultValue 默认值,取不到值得时候用
*/
const dGet = (data, path, defaultValue) => {
const pathList = typeof path === 'string' ? path.split('.') : path;
let result = data;
try {
while(pathList.length) {
const key = pathList.shift()
result = Object.prototype.hasOwnProperty.call(result, key) ? result[key] : defaultValue;
}
return result;
} catch(err) {
return defaultValue;
}
}
2.使用
const user = [
{ name: '张三', job: {name: 'java开发', level: 't-3'} },
{ name: '王五', job: {name: 'web前端开发', level: 't-2'} },
];
// 第二个参数为字符串
const userJobName = dGet(user, '0.job.name'); // java开发
// 第二个参数为数组
const userJobLevel = dGet(user, [1, 'job', 'level']); // t-2
// 设置默认值
const defaultName = dGet(user, '3.job.name', 'default'); // default
3.结束
觉得可以的,欢迎大家给个star,谢谢~