0

我希望能够运行在我的变量“表”中声明的函数。原因是为了避免基于字符串的解析来运行函数......

        var Table = function( params ){  
            var rowTemplate = params.rowTemplate;
            var table = params.table;

            function GetRow()
            {
                return $( rowTemplate ).html();
            }

            function AddRow()
            {
                $( table ).append( GetRow() );
            }

            function BindEvents()
            {    
                for( a in params.bind )
                {
                    params.bind[ a ].action();
                }
            }

            function Construct()
            {
                BindEvents();
            }

            Construct();

            return {
                AddRow: function() { AddRow(); }
            }
        };

        var ProductsTable = new Table( {
            table: "#ProductsTable tbody",
            rowTemplate: "#ProductsTable_TemplateRow",
            bind: [ 
                { action: AddRow, element: "#productsAddRowButton" }
            ]  
        } );

你能看到我的 ProductsTable 传递给我的 Construct 一个对象，该对象具有一个名为“bind”的属性，该属性是一个动作数组和实例化它们的元素。

AddRow 显然尚未声明。所以它会抛出一个错误。我不想做的是传入一个字符串“AddRow”，因为那时我将解析一个字符串......然后从 Table 范围内运行该函数，这很难看。

有什么解决办法吗？

这是我的解决方案，这要归功于“不，它无法完成”的回答，这让我走上了 switch 语句的轨道:( ... :)：

        var Table = function( params ){  
            var rowTemplate = params.rowTemplate;
            var table = params.table;

            function GetRow()
            {
                return $( rowTemplate ).html();
            }

            function AddRow()
            {
                $( table ).append( GetRow() );
            }

            function BindEvents()
            {    
                for( a in params.bind )
                {
                    switch( params.bind[ a ].action )
                    {
                        case "AddRow":     
                            $( params.bind[ a ].element ).click( function(){ 
                                AddRow(); 
                            } );
                        break;
                    }
                }
            }

            function Construct()
            {
                BindEvents();
            }

            Construct();

            return {
                AddRow: function() { AddRow(); }
            }
        };

        var ProductsTable = new Table( {
            table: "#ProductsTable tbody",
            rowTemplate: "#ProductsTable_TemplateRow",
            bind: [ 
                { action: "AddRow", element: "#productsAddRowButton" }
            ]  
        } );
4

2 回答 2

0

这是在黑暗中拍摄，但我猜你的实际代码不会bind从构造函数同步调用动作。如果它们例如绑定到事件，那么您可以简单地使用闭包来描述尚未创建的方法：

var ProductsTable = new Table({
    table: "#ProductsTable tbody",
    rowTemplate: "#ProductsTable_TemplateRow",
    bind: [ 
        { 
            action: function() {
                ProductsTable.AddRow();
            },
            element: "#productsAddRowButton"
        }
    ]  
});
于 2013-08-17T12:55:13.557 回答
0

我认为您无法绕过将函数名称作为字符串传递，因为在创建对象之前实际函数不存在。

由于范围界定，即使将它们作为字符串传递似乎也存在问题。所以这就是我会这样做的方式：

var Table = function( params ){  
    var rowTemplate = params.rowTemplate;
    var table = params.table;
    // add any additional functions to this object
    var functions = {
        AddRow: function() {
            $( table ).append( GetRow() );
        }
    };

    function GetRow()
    {
        return $( rowTemplate ).html();
    }

    function BindEvents()
    {    
        for(var a in params.bind )
        {
            var action = params.bind[a].action;
            if (functions.hasOwnProperty(action)) {
                functions[action]();
            }
        }
    }

    BindEvents();
};

var ProductsTable = new Table({
    table: "#ProductsTable tbody",
    rowTemplate: "#ProductsTable_TemplateRow",
    bind: [ 
        { action: "AddRow", element: "#productsAddRowButton" }
    ]  
});

将函数名称作为字符串传递在 JavaScript 中非常普遍，所以我不会担心这样做。

示例 - http://jsfiddle.net/4uxAX/

于 2013-08-16T15:05:26.593 回答