javascript - 将对象树输出为字符串

Question

我正在做一个小项目，我偶然发现了一个特定的点。疯狂的是，它看起来很简单，但我现在已经花了一个多小时来抨击我的脑袋。

我有一个示例对象，例如:

{
  l1_1: {
    l2_1: {
      l3_1: 'l1_1_l2_1_l3_1',
      l3_2: 'l1_1_l2_1_l3_2'
    },
    l2_2: {
      l3_1: 'l1_1_l2_2_l3_1',
      l3_2: 'l1_1_l2_2_l3_2'
    },
    l2_3: {
      l3_1: 'l1_1_l2_3_l3_1',
      l3_2: 'l1_1_l2_3_l3_2'
    }
  },
  l1_2: {
    l2_1: 'l1_2.l2_1',
    l2_2: 'l1_2.l2_2'
  }
}

我需要将每条路径输出到对象最深的子对象，就像这样(作为一个单独的字符串):

l1_1.l2_1.l3_1
l1_1.l2_1.l3_2
l1_1.l2_2.l3_1
l1_1.l2_2.l3_2
l1_1.l2_3.l3_1
l1_1.l2_3.l3_2
l1_2.l2_1
l1_2.l2_2

问题是每个 child 的对象可能不具有相同的深度。就像提供的例子一样。 (它可能有 2、3、4 甚至 5 个级别)

我的想法是，我将使用这些字符串来检查对象是否在特定的液体文件中使用，它们使用以下语法 {{ 'l1_1.l2_1.l3_1' | }}

这是我目前的想法。

const obj = {
  l1_1: {
    l2_1: {
      l3_1: 'l1_1_l2_1_l3_1',
      l3_2: 'l1_1_l2_1_l3_2'
    },
    l2_2: {
      l3_1: 'l1_1_l2_2_l3_1',
      l3_2: 'l1_1_l2_2_l3_2'
    },
    l2_3: {
      l3_1: 'l1_1_l2_2_l3_1',
      l3_2: 'l1_1_l2_2_l3_2'
    }
  },
  l1_2: {
    l2_1: 'l1_2.l2_1',
    l2_2: 'l1_2.l2_2'
  }
}

function iter(obj, keyTarget){
  Object.keys(obj).forEach(function(key) {
    const val = obj[key];
    if(typeof val == 'object'){
      keyTarget = keyTarget ? `${keyTarget}.${key}` : key;
      iter(val, keyTarget)
    } else {
      keyTarget = `${keyTarget}.${key}`;
      console.log(keyTarget)
    }
  });
}

iter(obj, false)

我知道为什么代码不起作用，因为循环在同一个对象上多次传递，值在它们之间传递和共享，我得到了错误的值，但我只是想不出一个解决方法清除字符串，同时为下一个对象保留它。

任何见解将不胜感激。

Answer 1

您可以收集路径，如果找到叶子，则将此路径添加到结果集中。

function getPathes(object, path = []) {
    return Object
        .entries(object)
        .reduce((r, [k, v]) => r.concat(!v || typeof v !== 'object'
            ? path.concat(k).join('.')
            : getPathes(v, path.concat(k))),
            []
        );
}

var data = { l1_1: { l2_1: { l3_1: 'l1_1_l2_1_l3_1', l3_2: 'l1_1_l2_1_l3_2' }, l2_2: { l3_1: 'l1_1_l2_2_l3_1', l3_2: 'l1_1_l2_2_l3_2' }, l2_3: { l3_1: 'l1_1_l2_3_l3_1', l3_2: 'l1_1_l2_3_l3_2' } }, l1_2: { l2_1: 'l1_2.l2_1', l2_2: 'l1_2.l2_2' } },
    pathes = getPathes(data);
    
console.log(pathes);

.as-console-wrapper { max-height: 100% !important; top: 0; }

另一种不存储路径的方法。

function getPathes(object, path = []) {
    return Object
        .entries(object)
        .reduce(
            (r, [k, v]) => r.concat(v && typeof v === 'object'
                ? getPathes(v).map(v => k + '.' + v)
                : v
            ),
            []
        );
}

var data = { l1_1: { l2_1: { l3_1: 'l1_1_l2_1_l3_1', l3_2: 'l1_1_l2_1_l3_2' }, l2_2: { l3_1: 'l1_1_l2_2_l3_1', l3_2: 'l1_1_l2_2_l3_2' }, l2_3: { l3_1: 'l1_1_l2_3_l3_1', l3_2: 'l1_1_l2_3_l3_2' } }, l1_2: { l2_1: 'l1_2.l2_1', l2_2: 'l1_2.l2_2' } },
    pathes = getPathes(data);
    
console.log(pathes);

.as-console-wrapper { max-height: 100% !important; top: 0; }