【问题标题】:Converting Tree Like File Directory to a JSON object将树状文件目录转换为 JSON 对象
【发布时间】:2018-07-08 04:13:26
【问题描述】:

我正在尝试将文件目录响应转换为 JSON 对象。 这是文件目录函数的响应副本。

[ 'C:/Users/Freddy/System/storage/Objects/Users/1',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email/FreddyMcGee@Gmail.com',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password/123123123213',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username/Freddy1337' ]

这是我正在尝试/旨在实现的输出:

1 : {
    email: "FreddyMcGee@Gmail.com",
    etc: etc,
    password: "12313123",
    username: "Freddy1337"
}

只是目录中的最短路径是 JSON 对象的开始。所有以前的“文件夹目录”都被剪掉了。

我已经尝试自己编写一个函数来执行此操作,但是由于文件夹“用户”出现了两次,所以我遇到了一些麻烦。此外,该功能不会正确遍历节点,它只是在设定的部分切割它并将它们粘合在一起。太可怕了,我有点惭愧。

function TreeToJson(directory, cutAfter){
    for (var i = directory.length - 1; i >= 0; i--) {
        directory[i] = directory[i].substr(directory[i].indexOf(cutAfter) + cutAfter.length, directory[i].length - 1);
        directory[i] = directory[i].split("/");
        directory[i].shift();
    };
    jsonA = {}; jsonB = {}; jsonC = {};
    for (var i = 0; i < directory.length; i++) {
        if(directory[i][2] != undefined){
        jsonB[directory[i][2]] = directory[i][3]
        }
    };
    jsonC[Number([directory[0][1]])] = jsonB;
    jsonA[directory[0][0]] = jsonC;
    return jsonA;
}
TreeToJson(files, 'Objects');

如果有人可以向我展示将“树视图模型”转换为“JSON 对象”的更好方法,我将不胜感激。我很好奇其他开发人员会采用什么方法,以及最简单的解决方案是什么。

【问题讨论】:

  • 输入中的“值”(例如123123123213)是否总是紧跟在“键”(例如password)之后?
  • 是的,但是看到一个没有那些“键”是最深入的属性限制的函数会很酷。

标签: javascript json treeview


【解决方案1】:

一个非常常见的操作是在最后一个斜杠之后提取字符串的一部分,所以我会为此创建一个正则表达式函数。从数组中的第一个元素识别起始目录名称,然后使用简单的for 循环以两两的方式遍历数组的其余部分,提取键和值:

const input = [
  'C:/Users/Freddy/System/storage/Objects/Users/1',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email/FreddyMcGee@Gmail.com',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password/123123123213',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username/Freddy1337'
];
const lastPart = str => str.match(/\/([^\/]+)$/)[1];
const [baseDirectory, ...keysVals] = input;
const dirName = lastPart(baseDirectory);
const dirObj = {};
for (let i = 0; i < keysVals.length; i += 2) {
  const key = lastPart(keysVals[i]);
  const val = lastPart(keysVals[i + 1]);
  dirObj[key] = val;
}
const output = { [dirName]: dirObj };
console.log(output);

【讨论】:

【解决方案2】:

您可以按“用户”和.reduce() 拆分结果数组:

const data = ['C:/Users/Freddy/System/storage/Objects/Users/1',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email/FreddyMcGee@Gmail.com',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password/123123123213',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username/Freddy1337'
];

const objects = data
  .map(e => {
    return e.split('Users')[2];
  })
  .reduce((all, curr) => {
    let elems = curr.split('/');
    all[elems[1]] = all[elems[1]] || {};

    if ([elems[2]] && elems[3]) {
      Object.assign(all[elems[1]], {
        [elems[2]]: elems[3]
      })
    }
    
    // elems[1] is : 1
    // elems[2] is the key ( username, password .. )
    // elems[3] is the value ( Freddy1337 ... )
    
    return all;
  }, {})

console.log(objects)

编辑:上面的相同代码包装在一个函数中:

const tree = ['C:/Users/Freddy/System/storage/Objects/Users/1',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email',
  'C:/Users/Freddy/System/storage/Objects/Users/1/email/FreddyMcGee@Gmail.com',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/etc/etc',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password',
  'C:/Users/Freddy/System/storage/Objects/Users/1/password/123123123213',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username',
  'C:/Users/Freddy/System/storage/Objects/Users/1/username/Freddy1337'
];

function TreeToJson(data, cutAfter){
  const objects = data
    .map(e => {
      return e.split(cutAfter)[1];
    })
    .reduce((all, curr) => {
      let elems = curr.split('/');
      all[elems[2]] = all[elems[2]] || {};

      if([elems[3]] && elems[4]){
        Object.assign(all[elems[2]], {
          [elems[3]] : elems[4]
        })
      }

      return all;
    }, {})
    
	return objects;
}

console.log(TreeToJson(tree, 'Objects'))

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2021-12-26
    • 1970-01-01
    • 1970-01-01
    • 2017-10-25
    • 2014-03-19
    • 1970-01-01
    • 1970-01-01
    • 2021-08-21
    相关资源
    最近更新 更多