使用__proto__在Protractor中扩展基页对象

Question

以下代码完美无缺......但似乎使用__proto__被认为是有争议的。在Protractor / Nodejs的范围内这是真的吗？如果是这样，我怎么能完成同样的事情呢？

给定一个basePage：

var BasePage = function() {
  this.to = function() {
    browser.get(this.url);
  };
};
module.exports = new BasePage;

一个扩展BasePage的页面：

var basePage = require('../pages/basePage.js');

var MyPage = function() {
  this.__proto__ = basePage; // extend basePage...
  this.url = 'http://myPage.com';
};
module.exports = new MyPage;

当测试呼叫时：

var myPage = require('../pages/myPage.js');

it('should go to page', function() {
  myPage.to();
}; 

然后赢了？

Answer 1

  

但似乎使用__proto__被认为是有争议的。

Yes

  

在Protractor / Nodejs的范围内这是真的吗？

是的，即使至少在已知环境中你可以确定它有效。

  

如果是这样，我怎么能完成同样的事情？

没有理由像你一样在构造函数中设置__proto__。这就是.prototype财产的用途！这将与您的代码完全相同：

var basePage = require('../pages/basePage.js');

var MyPage = function() {
  this.url = 'http://myPage.com';
};
MyPage.prototype = basePage; // extend basePage...
module.exports = new MyPage;

但是，导出构造函数的实例有点奇怪。如果您的目标是创建单个对象，don't use constructors and new。如果您的目标是创建＆＃34;类＆＃34;，则应导出构造函数（并执行inheritance a bit different）。

Answer 2

在下面的代码段中，您可以使用涉及原型继承的不同想法。我个人认为，在子类构造函数中调用基类构造函数更常规。这样，您就可以在任何浏览器和Node中使用您的代码。

＆＃13;

＆＃13;

var baseDiv = document.getElementById("base");
var subDiv = document.getElementById("sub");

var BaseClass = function BaseClassConstructor(div) {
    this.div  = div;
};

BaseClass.prototype.text = "I'm the base class!";

BaseClass.prototype.to = function BaseClassTo() {
  this.div.innerHTML = this.text;
}

// This SubClass calls the base class constructor on its "this" context.
var SubClass = function SubClassConstructor(div) {
  BaseClass.call(this, div);
};

// The prototype is then constructed by cloning the base class prototype.
SubClass.prototype = Object.create(BaseClass.prototype);

SubClass.prototype.text = "I'm the sub class!";

var b = new BaseClass(baseDiv);
var s = new SubClass(subDiv);

s.to();
b.to();

＆＃13;

<div id="base"></div>
<div id="sub"></div>

＆＃13;

＆＃13;

＆＃13;