Question

当我调用printData时，我有下面的课，我得到了这个。收集是未定义的。

如何从printData（）中的原型访问this.collection？或者我需要更改类结构。实际上，对象返回实际返回层次结构中对象的函数。

提前致谢！

样本类：

var DbProvider = (function () {
    function DbProvider(db) {
        var that = this; // create a reference to "this" object
        that.collection = db;
    }
    DbProvider.prototype.create = function () {
        return {
            action: function () {
                var y = {
                    printData: function () {
                        alert('Hello ' + this.collection.Name);
                    }
                };
                return y;
            }
        };
    };
    return DbProvider;
})();

用法：

var a = new DbProvider({ "Name": "John" });
a.create().action().printData();

Answer 1

保持ES5语法和调用结构的解决方案是：

var DbProvider = (function () {
    function DbProvider(db) {
        var that = this; // create a reference to "this" object
        that.collection = db;
    }
    DbProvider.prototype.create = function () {
        var that = this;
        return {
            action: function() {
                var y = {
                    printData: function () {
                        console.log('Hello ' + that.collection.Name);
                    }
                };
                return y;
            }
        };
    };
    return DbProvider;
})();

绝对不优雅，但它有效：）

如果您不想更改结构，如果将功能更改为arrow functions，则可以实现此行为。

var DbProvider = (function () {
    function DbProvider(db) {
        var that = this; // create a reference to "this" object
        that.collection = db;
    }
    DbProvider.prototype.create = function() {
        return {
            action: () => {
                var y = {
                    printData: () => {
                        alert('Hello ' + this.collection.Name);
                    }
                };
                return y;
            }
        };
    };
    return DbProvider;
})();

你创建这个“类”的方式绝对不是标准的。如果您想要一个如何更好地构建它的示例，请告诉我。

Answer 2

只需要正确跟踪此指针，就像这样

var DbProvider = (function() {
  function DbProvider(db) {
    this.collection = db;
  }
  DbProvider.prototype.create = function() {
    var self = this;
    return {
      action: function() {
        var y = {
          printData: function() {
            alert('Hello ' + self.collection.Name);
          }
        };
        return y;
      }
    };
  };
  return DbProvider;
})();



let dbProvider = new DbProvider({
  Name: "test"
});
dbProvider.create().action().printData();

Answer 3

您可以保存this引用并将其绑定到printData函数

＆＃13;

var DbProvider = (function () {
    function DbProvider(db) {
        var that = this; // create a reference to "this" object
        that.collection = db;
    }
    DbProvider.prototype.create = function () {
        var self = this;
        return {
            action: function () {
                var y = {
                    printData: function () {
                        alert('Hello ' + this.collection.Name);
                    }.bind(self)
                };
                return y;
            }
        };
    };
    return DbProvider;
})();

var a = new DbProvider({ "Name": "John" });
a.create().action().printData();

＆＃13;

或者你可以稍微重构并将that移到DbProvider的外部范围并使用that中的printData

＆＃13;

var DbProvider = (function () {
    var that;
    function DbProvider(db) {
        that = this; // create a reference to "this" object
        that.collection = db;
    }
    DbProvider.prototype.create = function () {
        return {
            action: function () {
                var y = {
                    printData: function () {
                        alert('Hello ' + that.collection.Name);
                    }
                };
                return y;
            }
        };
    };
    return DbProvider;
})();

var a = new DbProvider({ "Name": "John" });
a.create().action().printData();

＆＃13;

如何在javascript中从原型访问对象属性？

3 个答案: