Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationEventAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
153
Help us understand the problem. What are the problem?

More than 5 years have passed since last update.

posted at

updated at

最近のJavaScriptのテンプレ

最近下のように書いてる。変遷としては、若干サーバーサイドJavaScriptを意識しつつ徐々に離れていった感じ。

  1. 即時関数を2重にして、トップには何も書かない
  2. 外側の即時関数の中には、'use strict'を書く
    • 非strictモードのコードが含まれているとどっちのモードになるかわからないため。負の遺産が含まれ(ry
    • だいたいjQuery使うので、外側の即時関数の書き方はjQuery boilerplateのを参考にしている(jQuery使わない場合は、第二引数を抜かす)
  3. 内側の即時関数に実際の宣言を書く
    • app.jsか何か設定用のスクリプトでアプリケーション用名前空間としてグローバルオブジェクトを宣言しておく(window.App = {};など)
    • 即時関数内で宣言されたプロパティやメソッド、関数などを返り値にして、グローバルオブジェクトに展開する
functions.js
/**
 * functions.js - Utility functions.
 */

;(function(global, $, undefined) {
  'use strict';

  var App = global.App;  // 名前空間は宣言済み(app.jsのような設定用のスクリプトか何かで宣言する)

  App.functions = (function() {
    // プライベートな関数や変数が必要な場合は、返り値(module)に含まない様に、この辺に書く
    // […]

    var module = {
      /**
       * compact array by removing 0, false, null, '' and undefined.
       *
       * @param {Array} array An source array.
       * @return {Array} The compacted array.
       */
      compact: function(array) {
        var arr = $.isArray(array) ? array : [array];
        return $.grep(arr, function(val, i) {
          return !!val;
        });
      }
    };

    return module;  // この例ではオブジェクトリテラルだが、コンストラクタを使っている場合は、コンストラクタを返すようにする。
  }());
}(this, jQuery));
app.js
/*!
 * app.js - Application root.
 */

;(function(global, undefined) {
 'use strict';

 global.App = {
  DEFAULT_KEYWORD: '@iphone_dev_jp'
 };

}(this));
bootstrap.js
/*!
 * bootstrap.js - Setup and Load application.
 */

;(function(global, $, undefined) {
  'use strict';

  var App = global.App;

  // Mixin helper functions to View.
  $.extend(App.View.prototype, App.viewHelpers);

  $(function() {
    var view = App.View.getInstance();
    view.initialize({collection: new App.Tweets()});
    view.registerEvents().search(App.DEFAULT_KEYWORD);
  });
}(this, jQuery));

参考

Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
153
Help us understand the problem. What are the problem?