实现lodash.get方法

lodash.get 参考 lodash中文文档

get功能如下示例

var object = { 'a': [{ 'b': { 'c': 3 } }] };
 
get(object, 'a[0].b.c');
// => 3
 
get(object, ['a', '0', 'b', 'c']);
// => 3
 
get(object, 'a.b.c', 'default');
// => 'default'

可以看到,不管是使用下标[0]方法还是使用连续字符串['a', '0', 'b', 'c'],get都能正确返回结果

解析:这里可以预先处理,先把所有输入的 path路径,统一转成 ['a', '0', 'b', 'c'] 形式的数组,然后再迭代取值,

get实现如下:

/**
* object: 对象
* path: 输入的路径
* defaultVal: 默认值
**/

function get(object, path, defaultVal='undefined') {
    // 先将path处理成统一格式
    let newPath = [];
    if (Array.isArray(path)) {
        newPath = path;
    } else {
        // 先将字符串中的'['、']'去除替换为'.',split分割成数组形式
        newPath = path.replace(/\[/g,'.').replace(/\]/g,'').split('.');
    }

    // 递归处理,返回最后结果
    return newPath.reduce((o, k) => {
        return (o || {})[k]
    }, object) || defaultVal;   
}

值得注意的是 reduce的用法

参考:JavaScript reduce() 方法

reduce接收两个参数,

第一个是回调函数,这个函数接收四个参数:初始值/计算结束的返回值(必选),当前元素(必选),当前元素索引值(可选), 当前元素所属数组对象(可选)

第二个是 传递给函数的初始值(可选),

关于reduce等迭代用法可参考 数组遍历forEach、map、filter、find、some、every、reduce等区别

猜你喜欢

转载自blog.csdn.net/RedaTao/article/details/108119230