Question

假设我有这段代码：

var cfg = {
  config: {
    fields: {
      name: {
        type: 'text'
      },
      age: {
        type: 'number'
      }
    },
    actions: [
      {
        label: 'Print',
        cb: (model) => {
          console.log(model);
        }
     }
   ]
  },
  data: {name: 'Jhon', age: 23}
}

我想将它转换为字符串（让用户编辑它），然后将其转换回可执行代码，任何想法如何实现？

我尝试使用JSON.stringify和JSON.parse，但这当然会删除功能。 .toString返回"[object Object]"，迭代对象并在值为字符串时调用.toString，函数或数字是可能的，还有其他想法吗？

Answer 1

Function构造函数将代码作为字符串，eval和其他几个构造函数也是如此。但是，如果以任何方式避免，请不要将代码转换为字符串和向后，因为存在安全问题，调试能力以及执行此操作时可能遇到的许多其他问题。

将代码转换为字符串有点令人讨厌，因为您需要确保不重新声明变量，并且新上下文中的所有内容在语法上都是正确的，例如请注意，obj的{{1}}属性在声明中再次命名，因为它稍后被赋予f，它将它放在需要名称的全局范围内。

eval

请注意，JSON.stringify有一个可选的let obj = { f: function f() { let stuff = "hi"; console.log("hi"); } }; let code = obj.f.toString(); console.log(code); eval(code); f();参数，可用于自定义流程。

我将再次强烈建议尽可能避免使用任何代码进行字符串转换，在所有正常情况下都不需要这样做，也不应该这样做。

Answer 2

您可以遍历该对象并将其设置为输入元素，如此

jpeg

Answer 3

这是我提出的解决方案：

const toString = (code) => {
  if(Array.isArray(code)){
    return code.map(item => toString(item));
  }
  else if(typeof code == 'object'){
    let tmp = {};
    Object.keys(code).forEach(key => {
      tmp[key] = toString(code[key])
    });
    return tmp;
  }
  else{
    return code.toString().split('\n').join('').replace(/ +(?= )/gmi, '');
  }
};

这将在一个随机JS结构（包含对象和数组的对象）中递归遍历所有属性，并返回包含字符串的相应结构，然后可以使用JSON.stringify来获取实际字符串。

用户编辑后，执行：

eval(`(${string})`);

正如其他人所指出的，小心使用eval，它可能很危险（一篇有趣的文章是https://www.nczonline.net/blog/2013/06/25/eval-isnt-evil-just-misunderstood/）

Javascript：转换代码字符串并返回

3 个答案: