Javascript:转换代码字符串和返回

Javascript: Convert code string and back

本文关键字：返回 字符串 代码 转换 Javascript      更新时间：2023-09-26

假设我有以下代码:

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，当值是字符串，函数或数字是可能的，还有其他想法吗?

Function构造函数接受字符串形式的代码，eval和其他几个函数也是如此。但是，如果可以避免的话，请不要将代码转换为字符串或向后转换，因为考虑到安全问题、调试能力以及这样做时可能遇到的许多其他问题。

将代码转换为字符串有点烦人，因为你需要确保你没有重新声明变量，并且新上下文中的所有内容在语法上都是正确的，例如，请注意obj的f属性在声明中再次命名，因为它后来被赋予eval，这将它置于全局作用域中，它需要一个名称。

let obj = { f: function f() { let stuff = "hi"; console.log("hi"); } };
let code = obj.f.toString();
console.log(code);
eval(code);
f();

注意JSON。stringify有一个可选的replacer参数，可用于自定义进程。

我再次强烈建议尽可能避免任何代码与字符串之间的转换，在所有正常情况下，这是不需要的，也不应该这样做。

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

for (var key in cfg.config.fields) {
   console.log(key, cfg.config.fields[key].type);
   console.log(key, cfg.data[key],'data');
   console.log('<input type="'+cfg.config.fields[key].type+'" value="'+cfg.data[key]+'">')
}

这是我想到的解决方案:

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/)

相关文章：