简化Javascript对象

Question

我使用面向对象的javascript来显示/隐藏视图＆＃39;单击导航链接以及用于转到下一个视图的按钮。我觉得这绝对可以简化，但我不确定最好的办法是什么。我的HTML如下：

<div id="sidebar">
        <a href="/"><svg width="261" height="70"><use xlink:href="#logo"></use></svg></a>
        <nav>
            <ol>
                <li><a href="#"><span>1</span>Run your business</a></li>
                <li><a href="#"><span>2</span>Let us work for you</a></li>
                <li><a href="#"><span>3</span>Check your books</a></li>
            </ol>
        </nav>
        <a class="progress-btn main-btn visible" href="#">Start the demo</a>
        <a class="progress-btn main-btn" href="#">Next</a>
        <a class="progress-btn main-btn" href="#">Next</a>
        <a class="progress-btn main-btn" href="#">30-day free trial</a>
    </div><!--end sidebar-->

    <div id="content">
        <div class="page page1">
            <h2>Page 1</h2>
        </div><!--end page1-->
        <div class="page page2">
            <h2>Page 2</h2>
        </div><!--end page2-->
        <div class="page page3">
            <h2>Page 3</h2>
        </div><!--end page3-->
        <div class="page page4">
            <h2>Page 4</h2>
        </div><!--end page4-->
    </div><!--end content-->

我的对象看起来像这样：

View = {
  page: '.page',
  mainLink: '#sidebar li a',
  progressButton: '.progress-btn',
  init: function() {
    $(this.mainLink).click(this.showView.bind(this));
    $(this.mainLink).click(this.activeNav.bind(this));
    $(this.progressButton).click(this.sidebarButton.bind(this));
  },
  showView: function(e) {
    e.preventDefault();
    var target = $(e.target),
      targetIndex = target.index(this.mainLink),
      pageToTarget = targetIndex + 2;
    $(this.page).removeClass("current").fadeOut('fast').promise().done(function() {
      $('.page' + pageToTarget).fadeIn().addClass("current");
    });
  },
  activeNav: function(e) {
    $(this.mainLink).removeClass("active");
    e.preventDefault();
    $(e.target).addClass("active");
    var targetIndex = $(e.target).index(this.mainLink)
    $(".progress-btn").removeClass("visible");
    $(".progress-btn").eq(targetIndex + 1).addClass("visible");
  },
  sidebarButton: function(e) {
    e.preventDefault();
    var target = $(e.target);
    targetIndex = target.index(this.progressButton);
    pageToTarget = targetIndex + 2;
    if (target.text() == "30-day free trial") {
      window.open("http://google.com");
    } else {
      target.removeClass("visible");
      target.next().addClass("visible");
      $(this.page).removeClass("current").fadeOut('fast').promise().done(function() {
        $('.page' + pageToTarget).fadeIn().addClass("current");
      });
      $(this.mainLink).removeClass("active");
      $("#sidebar li a").eq(targetIndex).addClass("active");
    }
    console.log(targetIndex);
    // pageRoute(targetIndex);
  }
}

View.init();

这是一个小提琴https://jsfiddle.net/rsgLbgg3/4/。如何简化此操作以使用导航和按钮而不会如此重复。

只是学习一点点学习。提前谢谢！