js中如何实现类似lodash中的get方法

30 阅读1分钟

在日常开发中,您是不是有这种苦恼,遇到需要取层级特别深的数据结构,心里是不是很没底?不管是服务端返回的数据,还是咱们客户端自己的数据,自己各种判断?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,谢谢~