如何创建一个值是函数的对象？

debugcn 发表于 Dev

拉德克

我需要以编程方式创建一个具有一对property的对象：value就像tmpCol["formatter"]=color定义了color的地方一样

var colors = function backgroundColor(cell, formatterParams){}

在jsFiddle上一切正常

但是我需要在JavaScript之外即时创建对象。我使用Google Script在其中基于数据创建列标题的定义。我试图var colors = function backgroundColor(cell, formatterParams){}在服务器端定义一个虚拟函数，以便该定义甚至可以通过运行。但是，当我在浏览器中运行页面时，对我来说，函数定义似乎是文本而不是函数。浏览器进行调用，以使用google.script.runGAS返回的定义获取数据。

类型定义 tmpCol["formatter"]=colors;有效，但由GAS处理时则无效

服务器端的html代码看起来像

  <script>
  var colors = function backgroundColor(cell, formatterParams){
    var value = cell.getValue();
    if ("color" in formatterParams) {
      var color = cell.getRow().getData()[formatterParams["color"]];
      if (color){
        cell.getElement().style.backgroundColor = cell.getRow().getData()[formatterParams["color"]];
      }
    }
  return value;
  }
      var initialTableData = [{id:0,name:"nahrávají se data"}];
      var table = new Tabulator("#zz-test", {
          layout:"fitColumns",
          responsiveLayout:"hide",
          data:initialTableData,
          dataTree:true,    
          selectable:true,
          columns:[
            {title:"",
              field:"name",
              headerSort:false,
            },
          ],
      });
google.script.run.withSuccessHandler(updateTable).callLibraryFunction("zzlib.getTabulatorData",'A87J8HRS1');
      
  function updateTable(data){
    table.deleteColumn("name");
    for ( var c = 0; c < data.tableColumns.length; c++){
      table.addColumn(data.tableColumns[c]);
    }
//test
      var tmpCol = {};
    tmpCol["title"]="test 1";
    tmpCol["field"]="test1";
    tmpCol["headerSort"]=false;
    tmpCol["formatter"]=colors;
    tmpCol["formatterParams"]={color:"color1"};    
  
  columns = [
        {title:"", field:"name", width:200},
        tmpCol,
        {title:"Test2", field:"test2", width:200,formatter:colors,formatterParams:{color:"color2"}}
        ];

  //  table.deleteColumn("name");
  //  table.deleteColumn("test1");
  //  table.deleteColumn("test2");

    for ( var c = 0; c < columns.length; c++){
     // table.addColumn(columns[c]);
    }
console.log(columns);
// test
    table.setData(data.tableData); 
  }
    </script>

我需要formatter为两列定义。所以到目前为止，我在for循环中尝试了这些。

for ( var c = 0; c < data.tableColumns.length; c++){
  if ("formatter" in data.tableColumns[c]) {
    //console.log(eval(data.tableColumns[c]["formatter"]));
    //data.tableColumns[c]["formatter"]= new Function("return " +   data.tableColumns[c]["formatter"]);
    data.tableColumns[c]["formatter"]= var colors = new Function("return " + data.tableColumns[c]["formatter"]);
    //eval(data.tableColumns[c]["formatter"]);
    //eval("var colors = " + data.tableColumns[c]["formatter"]);
   console.log("eval");
  }
}

知道如何在服务器端创建对象值并将其正确传递给浏览器吗？

扎克

假设您有：

var functionString = "function backgroundColor(cell, formatterParams){}";

您可以使用Function构造函数：＃推荐

var colors = new Function("return " + functionString)()

这会将我们的函数解析为一个匿名函数，然后我们return通过调用匿名函数来获取目标函数，最后添加调用()

例：

var functionString = "function backgroundColor(cell, formatterParams){ return 'Hey!'}";

var anonymousFunction = new Function("return " + functionString);
var targetFunction = anonymousFunction();


console.log(anonymousFunction);
console.log(anonymousFunction());

console.log(targetFunction);
console.log(targetFunction());

在这里阅读更多

或者您可以使用eval：＃不推荐