Question

请考虑以下代码：

    var table = function () {

        return {
            _init: function (tableId) {
                this.tableId = tableId;
                this.table = $("#" + tableId);
            },

            removeStripes: function() {
                this.table.find(".alt").removeClass("alt");
            },

            addStripes: function () {
                this.table.find("tbody tr:even").addClass("alt");
            },

            resetStripes: function() {
                this.removeStripes();
                this.addStripes();
            },

            sort: function (options) {
                this.table.tablesorter(options);
                this.table.bind("sortEnd", this.resetStripes);
            },

        }

    }

var newTable = new table();
newTable._init("tableId");
var options = {};
newTable.sort(options);

浏览器说this.removeStripes由this.resetStripes调用，在最后一行之一上）不是函数。我猜this有一些错误，但我无法弄清楚它在哪里。任何想法，任何人？

Answer 1

当您使用匿名函数声明方法时，this功能范围内不再有table。

您应该使用：

 removeStripes: function() {
   // ...
 }.bind(this)

关于你的所有方法。

Answer 2

尝试在声明sort函数后删除coma（，）。这可能无法解决您的问题，但它将在＆lt; 7。

下“编译”

Answer 3

您正在寻找的是构造函数方法/模式。现在，当您调用其中一个实例化对象方法（例如newTable.removeStripes（））时，上下文（this）将设置为newTable。我相信你总是可以使用newTable.removeStripes.call（someOtherTableOrObject）更改上下文，这在很多情况下都很方便。

function Table(tableId) {

    this.tableId = tableId;
    this.table = $("#" + tableId);

    this.removeStripes = function() {
        this.table.find(".alt").removeClass("alt");
    };

    this.addStripes = function () {
        this.table.find("tbody tr:even").addClass("alt");
    };

    this.resetStripes = function() {
        this.removeStripes();
        this.addStripes();
    };

    this.sort = function (options) {
        this.table.tablesorter(options);
        this.table.bind("sortEnd", this.resetStripes);
    };

}

var newTable = new Table("tableId");
var options = {};
newTable.sort(options);

Answer 4

var table = function (tableId) {

        this.tableId = tableId;
        this.table = $("#" + tableId);

        this.removeStripes= function() {
            this.table.find(".alt").removeClass("alt");
        };

        this.addStripes= function () {
            this.table.find("tbody tr:even").addClass("alt");
        };

        this.resetStripes= function() {
            this.removeStripes();
            this.addStripes();
        };

        this.sort= function (options) {
            this.table.tablesorter(options);
            this.table.bind("sortEnd", this.resetStripes);
        };
}

Javascript中的“this”关键字用法与其他语言有很大不同。上面的版本应该工作（我用jsc测试它，而不是在浏览器中使用jQuery）。现在该函数是一个合适的构造函数，使得解释器将“this”设置为要创建的对象。

Answer 5

试试这个：

var table = function () {
        var that = this;
        return {
            _init: function (tableId) {
                that.tableId = tableId;
                that.table = $("#" + tableId);
            },

            removeStripes: function() {
                that.table.find(".alt").removeClass("alt");
            },

            addStripes: function () {
                that.table.find("tbody tr:even").addClass("alt");
            },

            resetStripes: function() {
                that.removeStripes();
                that.addStripes();
            },

            sort: function (options) {
                that.table.tablesorter(options);
                that.table.bind("sortEnd", that.resetStripes);
            },

        }

    }

var newTable = new table();
newTable._init("tableId");
var options = {};
newTable.sort(options);

它是JavaScript中的一种常见模式，用于将this保存到另一个变量中，以便您可以在更深层的嵌套函数中引用它。由于javascript this总是引用全局对象或通过.call或.apply传递给函数的this对象，因此有时使用它是相当不可靠的。

JS中的“this”问题

5 个答案: