Javascript 对象中的函数被声明为非函数

因此，我从JSON创建了一个小型表行生成器。当我开始建造它的时候，我没有把它放在一个物体里，它工作得非常好

之后，我制作了它，这样它就可以是抽象的，只需要将参数传递给它。然后我把它放在一个对象中，这样我就可以很容易地将它用于其他数据集。但是，在将其放入对象后，我得到控制台消息：

TypeError: this.getTableRow is not a function

但是。。。它是一种功能：

getTableRow: function(data) {
    row = "<tr>";

    for (i in data) {
        row += "<td>" + data[i] + "</td>";
    }

    row += "</tr>";

    return row;
}

getTableRow:函数（数据）{
行=”；
对于（数据中的i）{
行+=“”+数据[i]+“”；
}
行+=”；
返回行；
}

以下是完整的脚本，您可以在上下文中看到它：

var dataCollector = {

    baseDataURL: 'http://tourn.dev/data/',

    displayDataTable: function(dataPath, tableIdentifier, dataKeys, dataOpts) {

        $.getJSON(this.buildPath(dataPath, dataOpts), function (dataset) {
            for (k in dataset) {

                d = dataset[k];

                data = [];

                for (i in dataKeys) {
                    data[i] = d[dataKeys[i]];
                }
                ;

                $(tableIdentifier).append(this.getTableRow(data));
            }
        })
    },

    getDataURL: function() {
        return this.baseDataURL;
    },

    buildPath: function(dataPath, dataOpts) {
        path = this.getDataURL();

        if (dataPath != null) {
            path += dataPath;
        }

        if (dataOpts != null) {
            if (dataOpts.constructor === Array) {
                for (i in dataOpts) {
                    path += '/' + dataOpts[i];
                }
            } else {
                path += '/' + dataOpts;
            }
        }

        return path;
    },

    getTableRow: function(data) {
        row = "<tr>";

        for (i in data) {
            row += "<td>" + data[i] + "</td>";
        }

        row += "</tr>";

        return row;
    }
};

var数据收集器={
baseDataURL:'http://tourn.dev/data/',
displayDataTable：函数（数据路径、表标识符、数据键、数据选项）{
$.getJSON（this.buildPath（dataPath，dataOpts），函数（dataset）{
对于（数据集中的k）{
d=数据集[k]；
数据=[]；
用于（数据键中的i）{
数据[i]=d[dataKeys[i]]；
}
;
$（tableIdentifier）.append（this.getTableRow（数据））；
}
})
},
getDataURL:函数（）{
返回此.baseDataURL；
},
buildPath：函数（dataPath，dataOpts）{
path=this.getDataURL（）；
if（数据路径！=null）{
路径+=数据路径；
}
if（dataOpts！=null）{
if（dataOpts.constructor==数组）{
用于（数据选项中的i）{
路径+='/'+dataOpts[i]；
}
}否则{
路径+='/'+dataOpts；
}
}
返回路径；
},
getTableRow:函数（数据）{
行=”；
对于（数据中的i）{
行+=“”+数据[i]+“”；
}
行+=”；
返回行；
}
};

在

$.getJSON

回调中，

此

不是指

dataCollector

，而是指jqXHR对象

请参阅以获取解决方案

---

同样相关：

此.getTableRow

不是getJSON上下文中的任何内容。将此存储在呼叫外部

displayDataTable: function(dataPath, tableIdentifier, dataKeys, dataOpts) {
    var self = this; // store this
    $.getJSON(this.buildPath(dataPath, dataOpts), function (dataset) {
        for (k in dataset) {

            d = dataset[k];

            data = [];

            for (i in dataKeys) {
                data[i] = d[dataKeys[i]];
            }
            ;

            $(tableIdentifier).append(self.getTableRow(data)); //this in correct scope
        }
    })
}

---

关于作用域的更多信息：

这是因为您创建的每个函数都有不同的

此

上下文，如果它不是对象，则它是全局窗口对象，除非您使用严格模式，否则请尝试使用

dataCollector

作为此上下文的替代

var dataCollector = {

    baseDataURL: 'http://tourn.dev/data/',

    displayDataTable: function(dataPath, tableIdentifier, dataKeys, dataOpts) {

        $.getJSON(this.buildPath(dataPath, dataOpts), function (dataset) {
            for (k in dataset) {

                d = dataset[k];

                data = [];

                for (i in dataKeys) {
                    data[i] = d[dataKeys[i]];
                }
                ;

                $(tableIdentifier).append(dataCollector.getTableRow(data));
            }
        })
    },

在这一行中：

$（tableIdentifier）.append（this.getTableRow（data））关键字
此
不是您所期望的。