每天一点前端知识 - 通过字符串获取对象属性值

实现

const getValue = (object = {}, keys) => {
  keys = keys.replace(/\[['"]?(.*?)['"]?\]/g, '.$1')?.split('.');
  const checkValue = (obj, key) => {
    if (!key?.[0]) {
      return obj;
    }
    if (typeof obj[key[0]] === 'object') {
      return checkValue(obj[key[0]], key.slice(1));
    }
    if (key.length > 1) {
      return undefined;
    }
    return obj[key[0]];
  };
  return checkValue(object, keys);
};

通过 keys 描述获取 object 对象里对应值。

使用

getValue(object, keys);

- object：对象
- keys：属性描述，如：'a.b.c, a["b"]["d"]'

示例

const obj = {
  num: 12,
  str: 'hello',
  nul: null,
  arr: [
    {
      name: 'a1',
      children: [1, 'hi'],
    },
  ],
  obj: {
    name: 'obj',
    age: 22,
    oa1: [2, null, 'oa1'],
    oa2: {
      name: 'test',
    },
  },
};

getValue(obj, 'str'); // hello
// getValue(obj, 'a.b'); // undefined
// getValue(obj, 'arr[0]'); // {name: 'a1', children: [1, hi]}
// getValue(obj, 'arr[0].children[1]'); // hi
// getValue(obj, 'obj.name'); // obj
// getValue(obj, 'obj["oa2"].name'); // test
// getValue(obj, 'obj.oa2.age'); // undefined

演示地址：ihuxy.com/play?utils=…