Javascript继承:从超类的方法设置子类的属性

Javascript Inheritance: Setting property of sub-class from method of super class

本文关键字：方法 设置 子类 属性 超类 继承 Javascript      更新时间：2023-09-26

如果以前有人问过这个问题，我很抱歉，但经过大量搜索，我似乎找不到一个明确解决我的问题的答案。

我有一个我们称之为Form的超级类，它有一些通用方法。我只关注两种特殊的方法。show_form()显示表单，load_token()从服务器获取令牌。

表单

function Form() {
  // Event handler for form submission
  this.submit_button.bind('click', jQuery.proxy(function(){
    this.submit();
  }, this));
}
Form.prototype.show_form = function() {
  // Some other stuff happens here, but this is the relevant part. 
  // We load the token
  this.load_token();
}
Form.prototype.load_token = function(){
  // Contains a synchronous ajax request that fetches the token from the server 
  // and sets it. So we end up with
  this.token = 'some-token';
};

然后我有一个名为EmailForm的子类，它继承了Form。我还为这个类定义了一个自定义的submit()方法，该方法由Form()的构造函数中的事件处理程序调用。所以我有：

电子邮件窗体

function EmailForm() {};
EmailForm.prototype = new Form();
EmailForm.prototype.submit = function() {
  console.log(this.token); // Returns undefined
};

最后，以下是如何将其整合在一起

$('#email_form_link').bind('click', function(){
  var email_form = new EmailForm();
  email_form.show_form();
});

问题

所以我需要令牌来向服务器发出请求。由于有几个表单需要load_token()方法，我在超类中定义了它，并让子类继承它。由于我调用了email_form.show_form()，我希望email_form的token属性会被设置，但事实并非如此。

那么，我如何调用从超类继承的方法，并让它更改调用它的子类的属性呢？

您可以尝试使用this关键字而不是使用对象的prototype来定义方法。当然，这意味着每个新对象都将获得自己的方法实例（更多内存），而不是"继承"或共享同一实例，但通过这种方式，每个对象（子类EmailForm）都将设置自己的属性token。

Ex。

http://jsfiddle.net/64RRY/1/

http://api.jquery.com/bind/

从jQuery 1.7开始，.on（）方法是将事件处理程序附加到文档。

如果你想要每个表单都有一个令牌，那么问题可能是由异步请求在请求值时没有返回值引起的（我没有看到异步代码，也没有看到请求令牌值的代码）

Form.prototype.load_token = function(){
  var me = this;
  $.get("ur").then(function(data){
    me.token = 'some-token';
  }//,fail function here
  );
};

如果您希望令牌设置一次，并为之后创建的每个EmailForm或Form项目共享其值：

$.get("url")then(function(data){
  Form.prototype.token = data.token;
});
相关文章：