javascript - 如何在js中使用javascript中的外部值创建循环中的对象？

Question

我想动态制作一个 jqgrid 列。但我面临一个问题“在外部作用域循环中修改的变量的闭包”。这是我返回 jqgrid 的 colModel 的函数。

 var getJqgridColModel = function () {
            var colModel = [
            ];
           //Here i am making the column
            if (args && args.colModel) {

                for (var i = 0; i < args.colModel.length; i++) {

                    var col = {
                        name: "action",
                        width: "100",
                        sortable: false,
                        hidden: false,

                        formatter: function(cellValue, options, rowObject) {
                            var markup = "<a class=\"jqGrid-Column-Text\" title=\"%ToolTip%\" href=%Href%;>%Text%</a>";
                            var replacements = {
//Here is problem
                                "%Text%": args.colModel[i].actionLink,//Problem occures here.This "args.colModel[i].actionLink" is not recoginize.It shows "closure on a variable modified in loop of outer scope"
                                "%ToolTip%": "//",
                                "%Href%": "javascript:PersonSearch.perfomeActionOnSelect(" + rowObject.PersonLog.PersonId + ")"
                            };

                            markup = markup.replace(/%\w+%/g, function(all) {
                                return replacements[all];
                            });
                            return markup;
                        }
                    };
                    colModel.push(col);
                }

            }

            return colModel;
        }

我该如何解决这个问题？

Answer 1

您原来的示例不起作用的原因是您在循环中创建的所有闭包都引用了同一帧。

    var getJqgridColModel = function () {
    var colModel = [];
    //Here i am making the column
    if (args && args.colModel) {
                for (var i = 0; i < args.colModel.length; i++) {

                    var col = {
                        name: "action",
                        width: "100",
                        sortable: false,
                        hidden: false,

                        formatter: (function(i){
                            return function(cellValue, options, rowObject) {
                                var markup = "<a class=\"jqGrid-Column-Text\" title=\"%ToolTip%\" href=%Href%;>%Text%</a>";
                                var replacements = {
                                    //Here is problem
                                    "%Text%": args.colModel[i].actionLink,//Problem occures here.This "args.colModel[i].actionLink" is not recoginize.It shows "closure on a variable modified in loop of outer scope"
                                    "%ToolTip%": "//",
                                    "%Href%": "javascript:PersonSearch.perfomeActionOnSelect(" + rowObject.PersonLog.PersonId + ")"
                                };

                                markup = markup.replace(/%\w+%/g, function(all) {
                                        return replacements[all];
                                });
                                return markup;
                            }
                        }(i));
                    };
                    colModel.push(col);
                }

        }

        return colModel;
}