CodeBlooded
CodeBlooded

Reputation: 175

Extending (inherit) class (or object ) in Javascript

I'm working on a UI automation project where i want to extend one page object from another page object. I googled for the way to achieve this but couldn't find exactly what i am searching for. Basically i have a code setup something like this.

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;
});

I want to inherit the method of BasePage in LoginPage by just doing this:

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

Just for information I'm using Intern.js for testing.

Upvotes: 0

Views: 142

Answers (1)

Suren Srapyan
Suren Srapyan

Reputation: 68685

You need to define something like this. The first row will create a new object with the properties and methods, which are in BasePage.prototype and set the prototype reference to this, so every LoginPage object will have those properties and objects. After all I add all specific data which is related only to LoginPage (loginPageRelatedMethod). And also it is important to set the proper constructor.

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

LoginPage.prototype.constructor = LoginPage;

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

UPDATED

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

Example

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());

Upvotes: 1

Related Questions