js中通过key查找和更新对象中指定值的方法

前言

在js中对象类型的数据取值大多使用obj.a.b.c.d…这种方式取值，但是有时候数据的层级嵌套的非常深每次取值就会非常不方便，所以简单封装两个取值和更新值的小方法。

1、通过key获取对象中的指定值

      /**
       * 通过key获取对象指定值
       * @param {*} obj 取值的对象
       * @param {*} objKey  拼接后的key数据，string ‘>’符号拼接
       * @return {*} 返回查找到的值
       */
      const getObjDataByKey = (obj, objKey) => {
        const keyList = objKey.split('>');
        return keyList.reduce((pre, item) => pre[item], obj);
      }

      const data = {
        a: {
          b: {
            c: {
              d: [1,2,3]
            }
          }
        }
      }
      console.log(getObjDataByKey(data, 'a>b>c>d'));

上述代码传入两个参数 （原始数据和通过>拼接的key值），然后通过截取>获取key的list数据，最后通过keyList的reduce方法每次获取一层obj中的数据，直至最后获取最后指定的值返回。打印效果如下：

2、通过key更新obj中的指定数据

      /**
       * 通过key更新obj中的指定数据
       * @param {*} obj 更新值的对象
       * @param {*} objKey   拼接后的key数据，string ‘>’符号拼接
       * @param {*} newValue  更新的值
       * @return {*} 返回更新后的数据
       */

      const updateObjDataByKey = (obj, objKey, newValue) => {
        const keyList = objKey.split('>');
        const lasteKey = keyList[keyList.length - 1];
        keyList.reduce((pre, item) => {
          if (item === lasteKey) pre[item] = newValue;
          return pre[item];
        }, obj);

        return obj;
      }

      const data = {
        a: {
          b: {
            c: {
              d: [1,2,3]
            }
          }
        }
      }
      
      console.log(updateObjDataByKey(data, 'a>b>c>d', [555555555555]));

上述代码传入三个参数 （原始数据、通过>拼接的key值、最新的值），首先通过截取>获取key的list数据，最后通过keyList的reduce方法每次获取一层obj中的数据，判断当循环到keyList最后一级时将newValue赋值给当前数据，最后返回传入的对象即可（中间的赋值利用了引用数据类型的特点）。打印效果如下：