使用 JavaScript 动态访问嵌套对象值

Question

假设我有一个对象：

var abc = {
    a: 'a',
    b: 'b',
    c: {
      x: 'c',
      y: 'd'
    }
}

现在我想根据下面数组中存在的值动态获取对象值

var arr = ['a', 'b', 'c.x']

Answer 1

您可以像这样创建一个扩展：

Object.defineProperty(Object.prototype, 'valueAt', {
  value: function (location, defaultValue) {
    const routes = location.split('.');
    const lastRoute = routes.pop();

    let value = routes.reduce(
      (current, route) => current && current[route],
      this
    );

    if (value) return value[lastRoute] || defaultValue;
    else return defaultValue;
  },
  writable: true,
  configurable: true,
  enumerable: false,
});

然后使用：

abc.valueAt("c.x");

Answer 2

您可以拆分字符串以获取数组并通过访问对象来减少键。

var getValue = (object, keys) => keys.reduce((o, k) => (o || {})[k], object),
    object = { a: 'a', b: 'b', c: { x: 'c', y: 'd' } },
    keys = ['a', 'b', 'c.x'],
    result = keys.map(s => getValue(object, s.split('.')));

console.log(result);

Answer 3

注意：以下解决方案适用于给定的场景，其中对象属性使用点表示法表示，但如果使用方括号表示法（例如 c[x]）将失败。

const abc = {
  a: 'aVal',
  b: 'bVal',
  c: {
    x: 'cxVal',
    y: 'cyVal'
  },
  d: {
    x: 'dxVal',
    y: {
      z: 'dyzVal',
      w: 'dywVal'
    }
  }
};

const arr = ['a', 'b', 'c.x', 'd.y.w'];

function getValues(obj, keysArr) {
  return keysArr.map(key => {
    return key.split('.').reduce((acc, item) => {
      return acc[item];
    }, obj);
  });
}

const values = getValues(abc, arr);

console.log(values);

使用 JavaScript 动态访问嵌套对象值

access nested object values dynamically using JavaScript

javascript

nested-loops

ecmascript-6