的Javascript：轉換代碼串和背部

假設我有這樣的代碼：的Javascript：轉換代碼串和背部

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當值是一個字符串，函數或數字是可能性，任何其他的想法？

來源

2016-08-17 teone

你真的需要：

用戶編輯它後，它與執行你的用戶編輯功能？ – Bergi

是的，我需要的是，它是一個關於如何使用和合成UI組件的教程，所以我需要用戶編寫一些代碼並執行它。 – teone

然後，您應該從一個字符串開始，而不是一個對象。不要來回轉換，只能在字符串上使用'eval'。對於初始代碼，將其放入字符串文字中或從文件中加載它。 – Bergi

可以遍歷周圍的物體，並設置爲輸入要素，這樣

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]+'">') 
}

來源

2016-08-17 18:21:26

是的，這是我遵循的方式......它實際上有點複雜，因爲我們不知道結構，但遞歸函數發揮了作用。我會盡快發佈。 – teone

的Function構造函數採用代碼串，所以不eval和一對夫婦等。但是，如果以任何方式避免，請不要將代碼轉換爲字符串，也不要將代碼轉換回來，因爲存在安全問題，調試能力以及在執行此操作時可能遇到的許多其他問題。

將代碼轉換爲字符串有點煩人，因爲您需要確保不重新聲明變量，並且新環境中的所有內容在語法上都是正確的，例如，請注意0的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參數可用於定製過程。

我將再次高度建議，以避免從字符串轉換任何代碼/可能的，在一切正常的情況下，這是不需要的時候，不應該做的。

來源

2016-08-17 18:21:58 ASDFGerte

在我們的案例中是受控環境中的教程，所以沒有安全問題 – teone

這是我想出瞭解決方案：

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

來源

2016-08-18 17:28:09 teone

的Javascript：轉換代碼串和背部

回答

相關問題