在 Javascript 中扩展（继承）class（或对象）

Question

我正在做一个 UI 自动化项目，我想从另一个页面对象扩展一个页面对象。我在谷歌上搜索了实现这一目标的方法，但找不到我正在寻找的确切内容。基本上我有一个类似这样的代码设置。

BasePage.js

    define([],
         function () {

            function BasePage(remote) {
             this.remote = remote;

            }

            BasePage.prototype = {
              constructor: BasePage,
             // common methods to interact with page

             commonMethodToIntreactWithPage : function{
               return doSomething;
             }
    };

    return BasePage;
});

LoginPage.js

    define([],
         function () {

            function LoginPage(remote) {
             this.remote = remote;

            }

            LoginPage.prototype = {
              constructor: BasePage,
             // Login Page related Methods

             loginPageRelatedMethod: function{
               return doSomething;
             }
    };

    return LoginPage;
});

我想继承LoginPage中BasePage的方法，只需这样做：

var loginPage = new LoginPage(remote);
loginPage.commonMethodToIntreactWithPage();

仅供参考，我使用 Intern.js 进行测试。

Answer 1

你需要这样定义。第一行将使用 BasePage.prototype 中的属性和方法创建一个新对象，并将原型引用设置为此，因此每个 LoginPage 对象都将具有这些属性和对象。毕竟我添加了仅与 LoginPage (loginPageRelatedMethod) 相关的所有特定数据。并且设置正确的 constructor.

也很重要

LoginPage.prototype = Object.create(BasePage.prototype);

LoginPage.prototype.constructor = LoginPage;

LoginPage.prototype.loginPageRelatedMethod = function(){
    return doSomething;
}

已更新

function LoginPage(remote) {
   BasePage.call(this, remote);
}

例子

function BasePage(remote) {
   this.remote = remote;
}

BasePage.prototype = {
   constructor: BasePage,    
   commonMethodToIntreactWithPage : function() {
      return 'From Base Page';
   }
};

function LoginPage(remote) {
   BasePage.call(this, remote);
}

LoginPage.prototype = Object.create(BasePage.prototype);

LoginPage.prototype.constructor = LoginPage;

LoginPage.prototype.loginPageRelatedMethod = function () {
   return 'From Login Page';
}

var loginPage = new LoginPage('Test');
console.log(loginPage.commonMethodToIntreactWithPage());

在 Javascript 中扩展（继承）class（或对象）

Extending (inherit) class (or object ) in Javascript

javascript

object

inheritance

intern

ui-testing