How to get nested value from within an object using a string without using multiple brackets?

You can do this very easily with some clever usage of split() and reduce():

const obj = { data : { users: { admins: { dashboard: [1, 2, 3, 4] } } } };
const path = 'data.users.admins.dashboard[3]';

const result = path.replace(/\[/g,'.').replace(/\]/g,'').split('.')
                   .reduce((obj,key) => obj && obj[key], obj);

console.log(result);

How?

1. Replace array accessors like [3] with just .3 -> data.users.admins.dashboard.3
2. Split string on periods -> ['data', 'users', 'admins', 'dashboard', '3']
3. reduce over the array accessing each key if the previous one was valid

Here's the snippet in a helper function:

function getByPath(obj, path) {
  return path.replace(/\[/g, '.').replace(/\]/g, '').split('.').reduce((obj, key) => obj && obj[key], obj);
}

//sample usage
console.log(getByPath({thing: [1, 2]}, "thing[0]"))

It is possible by using eval, but eval is EVIL. Use it at your own risk!

const data = { users: { admins: { dashboard: [1, 2, 3, 4] } } };

eval('data.users.admins.dashboard[3]');

You can use Proxy:

const obj = new Proxy({
  data: {
    users: {
      admins: {
        dashboard: [10, 21, 31, 41],
      }
    }
  },
}, {
  get: function (map, key, receiver) {
    try {
      return eval(`map.${key}`)
    } catch (error) {
      return undefined;
    };
  },
});


obj['data.users.admins.dashboard[3]'] // 41
obj['erter.sdfdsfds.admins.sdfsdf[3]'] // undefined 

In normal objects it would throw an error can't read property of undefined == better than regular objects in js :)

Updated:

https://repl.it/repls/HarmlessMessyCommas

const obj = new Proxy({
  data: {
    users: {
      admins: {
        dashboard: [10, 21, 31, 41, {
          hi: 'I am hi'
        }],
      }
    }
  },
}, {
  get: function (map, key, receiver) {

    try {

      let splitedKey = key.split(".");
      let current = map;

      while (splitedKey.length > 0) {
        let newValue = splitedKey.shift();

        let openingBracketIndex = newValue.lastIndexOf("[");
        let arrIndex = Number(newValue.slice(openingBracketIndex + 1, newValue.length - 1));
        let isArr = !isNaN(arrIndex)

        if (openingBracketIndex > -1 && newValue[newValue.length - 1] === "]" && isArr) {
          let arrName = newValue.slice(0, openingBracketIndex);
          current = current[arrName][arrIndex];
        } else {
          current = current[newValue];
        }

      }

      return current;
    } catch (error) {
      return undefined;
    };
  },
});


console.log(obj['data.users.admins.dashboard[3]'] == 41);
console.log(obj['data.users.admins.dashboard[0]'] == 10);
console.log(obj["data.users.admins.dashboard[4].hi"] === "I am hi");
console.log(obj['erter.sdfdsfds.admins.sdfsdf[3]'] === undefined)

It works but not perfectly, especially with nested arrays are not going to work b/c even a human wouldn't know if someone is trying to access a property name or array, ex:

const map = {
  "dashboard[1]": 'i am string',
  "dashboard": [1, 2],
}

So if someone wrote map.dashboard[1] so it is going to return "2" instead of "i am string" b/c if condition for array is above the else condition (else condition = if not array)

I hope it helps :)