如何使用JS 的模板字符串的拼接来获取对象某个属性的值，如拼接出 obj[a][b][c] 这种？

Question

如何使用JS 的模板字符串来获取对象某个属性的值，如拼接出 obj[a][b][c] 这种，其中 a/b/c 的个数是不定的，所以 obj后面该如何拼接呢？

如果直接是

const obj = {
    a: {
        b: {
            c: 1
        }
    }
}
const str = 'a.b.c';
const tpl = obj`${str.split('.')}` ;

这时候会报错 obj 不是一个 function
那该怎么来拼接呢，能够直接使用模板函数来直接得到 obj.a.b.c 的值
注：不使用循环来获取obj 的值，比如使用 map / reduce / while 来获取，也就是不使用 lodash 中 get 的方式，现在想的是如何来根据模板字符串来获取，想探讨一下这种形式

Answer 1

一种不太推荐的写法with(obj){eval(str)}，就是在with中让str以代码的形式运行，eval还可以换成new Function

纯模板字符串实现不了，语言特性如此，最好使用循环来获取值

Answer 2

其实正确的是 obj["a"]["b"]["c"]
所以

const obj = {
    a: {
        b: {
            c: 1
        }
    }
}
const str = 'a.b.c';
a=str.split('.');
t=obj;
for( i in a){
  t=t[a[i]];
}
const tpl=t;

Answer 3

const obj = {
  a: {
      b: {
          c: 1
      }
  }
}
const str = 'a.b.c'
const fn = new Function('obj','str',`return obj.${str}`)
console.log('🚀 ~ fn', fn(obj,str))

Answer 4

我写过一个正适合：https://github.com/hungtcs/pi...
另外可以用： https://lodash.com/docs/4.17....

如果用上面我写的 pico-sandbox 的话

import { Sandbox } from 'pico-sandbox';

function get(object: any, path: string) {
  return Sandbox.compile(path)(object);
}

const result = get({ a: { b: { c: 1 } } }, 'a.b.c');
// or
const result = get({ a: { b: { c: 1 } } }, 'a["b"]["c"]');

Answer 5

直接用 lodash 吧，哈哈

const obj = {
    a: {
        b: {
            c: 'hello'
        }
    }
}

_.get(object, 'a.b.c');