Канонический способ определения объектов страницы в Protractor

Мы уже давно используем шаблон Page Object. Это определенно помогает организовать сквозные тесты и делает тесты более читабельными и чистыми.

Как показано на странице документации Protractor Использование объектов страницы для организации тестов, мы определяем каждый объект страницы как функцию и используйте new для его создания:

"use strict";

var HeaderPage = function () {
    this.logo = element(by.css("div.navbar-header img"));
}

module.exports = HeaderPage;

Использование:

"use strict";

var HeaderPage = require("./../po/header.po.js");

describe("Header Look and Feel", function () {
    var header;

    beforeEach(function () {
        browser.get("/#login");
        header = new HeaderPage();
    });

    it("should show logo", function () {
        expect(header.logo.isDisplayed()).toBe(true);
    });

});

Но недавно в блоге Protractor: тестирование Angular стало проще. сообщение, я заметил, что объект страницы определяется как объект:

var angularHomepage = {
    nameInput : element(by.model('yourName')),
    greeting : element(by.binding('yourName')),
    get : function() {
        browser.get('index.html');
    },
    setName : function(name) {
        this.nameInput.sendKeys(name);
    }
};

В чем разница между этими двумя способами представления объектов страницы? Должен ли я предпочесть одно другому?