SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

「Dojo道場」~実用アプリ構築のためのベストプラクティス

Dojo道場 ~ 第11回「Dojo 最新動向 - Asynchronous Module Definition」

「Dojo道場」~実用アプリ構築のためのベストプラクティス

  • X ポスト
  • このエントリーをはてなブックマークに追加

require() API(AMDローダー)

 AMDモジュールのロードを開始するには、AMDローダーのAPIであるrequire()関数を使います。require()関数は次の形をとります:

リスト5 require()関数の書式
require(modules, callback);
  • modules(文字列の配列, 必須): ロードするモジュールのID。
  • callback(関数, 任意): モジュールが読み終わったときに呼ばれる関数。その引数は読み込まれたモジュールとなる。

 require()関数を使うと、先ほどの価格引き合わせモジュール(my/price)は次の形でロードすることができます。このときmy/pricelistモジュールとmy/discountモジュールはrequire()関数の内部コードがmy/priceに定義された依存モジュールのリストをみることにより、自動的に読み込まれます:

リスト6 require()関数でmy/priceモジュールをロードする
require(["my/price"], function(price){
    // オレンジの本日価格をアラートボックスに出力
    alert(price("orange"));
});

 なお、require()関数は同期的にモジュールを返す別な形も存在し、これはDojo 1.7でもサポートされています。すでに読み込まれていることが確実なモジュールを参照するのに便利で、次のように使うことができます:

リスト7 同期的にモジュールを返すrequire()関数の書式
require("my/price")("orange");

 ちなみに、my/pricelist.js、my/discount.js、my/price.jsのmyディレクトリをdojo/dijit/dojoxと同じ位置においた場合、上のrequire()関数を使ったサンプル(my/pricetest.htmlとします)は次のように書けます:

リスト8 my/pricetest.html
<!DOCTYPE html>
<html>
    <head>
        <title>Price List Test</title>
        <script type="text/javascript">
            dojoConfig = {
                async: true,
                packages: [
                    {
                        name: "my",
                        location: "../my"
                    }
                ]
            };
        </script>
        <script type="text/javascript" src="../dojo/dojo.js"></script>
        <script type="text/javascript">
            require(["my/price"], function(price){
                // オレンジの本日価格をアラートボックスに出力
                alert(price("orange"));
            });
        </script>
    </head>
    <body></body>
</html>

 Dojo 1.7以外のAMDローダーを使う場合はdojoConfig = { … }の部分をrequire = { … }に置き換える必要があります(Dojo 1.7はどちらの形もサポートしています)。dojoConfigについては後ほど詳しく説明します。

次のページ
AMDローダープラグイン

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
「Dojo道場」~実用アプリ構築のためのベストプラクティス連載記事一覧

もっと読む

この記事の著者

須藤 哲(スドウ アキラ)

2000年ロータス株式会社(現日本アイ・ビー・エム株式会社)入社, 現在ソフトウェア開発研究所に所属. Lotus iNotesおよびIBM Connections MailのUIフレームワークを中心に携わる.

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/6482 2012/04/06 14:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング