Windowの処理をオブジェクトにラッピングする

createWindowしたときにurlで指定して呼び出すファイルの書き方について。

サンプルなどでは処理をべた書きしていくが、実際はひとつオブジェクトを定義して、そこにプロパティや処理をくっつけて行った方が収まりがいいんじゃないかと。

オブジェクトにするとよいこと

メソッド分割がやりやすい

長い処理を適当なサイズのメソッドに分割すると処理が追いやすい。
しかしメソッド間での変数の共有を引数やクロージャのみで行っている場合、その取り回しの関係でメソッド分割が思うようにできないことがある。

オブジェクトにすることで変数にオブジェクトのプロパティとしてアクセスできるようになるので、定義の順番を気にせず変数やメソッドを使えるようになる。
それによりメソッドが分割しやすくなる。

名前空間ができる

一応そういう用途にも使える。
Ti.includeではなくurl指定で呼び出すとコンテキストが別になるため、実のところそこまで名前空間欲しいわけじゃないけども。

サンプルコード

実際に作っているアプリのブックマーク機能のページを作り途中のコードを例に出してみる。

var BookmarkViewController = {
  // プロパティの初期化
  window: Ti.UI.currentWindow,
  view: Ti.UI.createView(),
  tableView: Ti.UI.createTableView({data: [], editable: true, moveable: true}),
  buttonEdit: Ti.UI.createButton({systemButton: Ti.UI.iPhone.SystemButton.EDIT}),
  buttonDone: Ti.UI.createButton({systemButton: Ti.UI.iPhone.SystemButton.DONE}),
  bookmarks: Ti.App.Properties.getList("bookmarks"),

  // 実行
  run: function() {
    this.initControls();
    this.initEvents();
  },

  // コントロールの配置
  initControls: function() {
    this.window.setRightNavButton(this.buttonEdit);
    this.view.add(this.tableView);
    this.window.add(this.view);
  },

  // イベントの設定
  initEvents: function() {
    var that = this;
    this.window.addEventListener("focus", function(e) {
      rows = that.bookmarks.map(function(e){ return {title: e.name} })
      that.tableView.setData(rows);
    });
    this.buttonEdit.addEventListener('click', function(e) {
      that.tableView.moving = true;
      that.tableView.editing = true;
      that.window.setRightNavButton(that.buttonDone);
    });
    this.buttonDone.addEventListener('click', function(e) {
      that.tableView.moving = false;
      that.tableView.editing = false;
      that.window.setRightNavButton(that.buttonEdit);
    });
  }
};
BookmarkViewController.run();

そんなに長いコードじゃないのでありがたみが伝わらない気がするけど、こんなかんじですよ。
処理が増えてコードが長くなるにつれありがたみがわかるはず。

いっそクラスにする

JavaScriptだとちょっとおっくうだけど、CoffeeScriptだとそれも楽ちん。
コードをDRYにしやすくなるし、テスト容易性も上がるのでクラス化オススメ。

だから実はもうこの記事に載せたサンプルコードみたいな書き方はしてなかったりするんですけどね。