Javascript对象 - 访问父级的父级

时间:2014-03-26 16:34:54

标签: javascript class oop

让我们说代码:

var MyConstructor = (function() {
  var constructor = function(name, type) {
    this.name = name;
    this.type = type;
  };

  constructor.prototype: {
    init: function() {
      console.log(this.name);
      console.log(this.type);
    },
    errors: {
      message: function() {
        return "error";
      },
      presence: function() {
        // how do I access the each method off of the prototype in a clean manner?
        ?.each(function() {
          console.log('iteration');
        }); 
      }
    },
    each: function(cb) {
      this.type.forEach(function(t) {
        cb();
      });
    };
  };

  return {
    constructor: constructor
  };
}); 

我有一个带有一些方法的构造函数,但是还有一个对象errors,其中包含属于该对象的方法。 errors如何访问构造函数的方法?

2 个答案:

答案 0 :(得分:1)

errors对象无法直接知道其“父”。它是一个不同的对象,从技术上讲,你可以获取它的引用并使其成为其他对象的属性。

有几种方法可以解决问题。

您可以将errors的声明移动到构造函数中,并使用闭包来保持对父级的引用。这种方式errors仍然是您可以引用的独特对象。你不能使用prototype,因为你需要封闭范围。

var constructor = function(name, type) {
  var errorParent = this;
  this.name = name;
  this.type = type;
  this.errors = {
    message: function() {
      return "error";
    },
    presence: function() {
      // access the parent's each() method
      errorParent.each(function() {
        console.log('iteration');
      }); 
    }
  },
};

第二种方法是使messagepresence方法成为构造函数原型的成员。现在您可以保留prototype结构,但没有errors对象。

constructor.prototype: {
  init: function() {
    console.log(this.name);
    console.log(this.type);
  },
  errors_message: function() {
      return "error";
  },
  errors_presence: function() {
      this.each(function() {
        console.log('iteration');
      }); 
  },
  each: function(cb) {
    this.type.forEach(function(t) {
      cb();
    });
  };
};

第三种方法是使Errors成为一个完全独立的类,并在构造函数中创建一个实例errors。然后errors对象将明确引用它负责管理的对象。

var constructor = function(name, type) {
  this.name = name;
  this.type = type;
  this.errors = new Errors(this);
};

......以及代码中的其他地方......

function Errors(object) {
  this.object = object;
};
Errors.prototype.message = function() {
  return "error";
};
Errors.prototype.presence = function() {
  this.object.each(function() {
    console.log('iteration');
  }; 
};

第三种方法对我来说似乎最干净,但你必须决定哪种方法最适合你的应用。

P.S。顺便说一句,我知道JavaScript对象文字对于声明整个类都很流行,但很多时候(如本例所示)使用它们实际上限制了开发人员思考代码而不是启发它们的方式。 IMHO。

答案 1 :(得分:0)

您可以绑定方法,以便this始终是对构造函数的引用,而不是对调用者的引用。

var MyConstructor = (function() {
  var constructor = function(name, type) {
    this.name = name;
    this.type = type;
  };

  constructor.prototype: {
    errors: {
      presence: (function() {
        // this is the constructor.
        this.each(function() {
          console.log('iteration');
        }); 
      }).bind(this)
    }
  };

  return {
    constructor: constructor
  };
});