Dojo - XMind - Mind Mapping Software

概念
1. Base
  1. Dojo Toolkit の中核
  2. 基本機能一式
    1. DOMへのクエリ
    2. DOM操作
    3. クロスブラウザAjax
    4. イベント処理
    5. データAPI
    6. など
2. Core
  1. Baseに含まれていない関数
    1. 一般にBaseに含まれるものほど多用されない
    2. 高度なアニメーション
    3. ドラッグ・アンド・ドロップ
    4. I/O
    5. データ管理
    6. 国際化対応など
3. Dijit
  1. Dojo Toolkit の最も際立った特色の一つ
  2. コンポーネントライブラリ
    1. レイアウト
    2. メニュー
    3. ツリー
    4. ダイアログ
    5. フォーム
  3. 強力なUIを最小限の手間と作業で作成
  4. JavaScriptコンポーネントを宣言型で作成可能
  5. 利用方法
    1. 1.JavaScript によるプログラムで使用
    2. 2.HTML要素に dojyoType 属性を指定
4. DojoX
  1. Base および Dijit に含まれない機能
  2. コミュニティ主導の実験的拡張ライブラリ
基本
1. ユーティリティ関数
  1. dojo.byId
    1. document.getElementByIdの別名
  2. dojo.query
    1. CSS3のセレクタを引数にとりオブジェクトを返す
  3. dojo.create
    1. 新規要素を作成
  4. dojo.body
    1. <body>への参照を返す
  5. dojo.empty
    1. DOM要素の中身を空に
  6. dojo.destroy
    1. ノードと子要素を一緒に除去
  7. dojo.place
    1. 要素を文書の任意の場所に配置
2. 配列とNodeList
  1. ヘルパー関数により拡張された配列があり、NodeListと呼ぶ
  2. dojo.query の戻り値はNodeList
  3. NodeListで利用できる関数
    1. dojo.forEach
      1. dojo.forEach(dojo.query(".hoge"),function(item,i){})
    2. dojo.indexOf
      1. 特定の値が配列内のどの位置にあるかを調べる
      2. dojo.indexOf(list,"hoge);
    3. dojo.filter
      1. 別の配列をフィルタして、新しい配列をつくる
    4. dojo.map
      1. 既存の配列を変更して新しい配列をつくる
    5. dojo.some
      1. 指定された基準を満たす要素が1つ以上含まれているか
    6. dojo.every
      1. すべての要素が指定された基準を満たすか
3. イベント処理
  1. イベントトリガー時に呼ぶ関数をアタッチできる様にクロスブラウザのイベント処理
    1. dojo.connect
4. トピックのパブリッシュとサブスクライブ
  1. Dojoコンポーネントは互いの存在を意識せずとも相互に対話できる
    1. dojo.subscribe
    2. dojo.publish
5. dojo.xhr*によるAjaxの実現
  1. xhrGet
  2. xhrPost
  3. xhrPut
  4. xhrDelete
  5. 引数
    1. url
    2. handleAs
    3. form
    4. content
オブジェクト指向
1. プロトタイプベースのOOP
  1. 必要に応じてオブジェクトを宣言
  2. 継承が必要な場合、プロトタイプオブジェクトの機能を単純に複製
  3. オブジェクトプロトタイプを実行時に変更できる
  4. クラスベースのOOPをシミュレートした機能を提供
    1. dojo.declare
      1. クラスを作成
      2. dojo.declare("Car",null,{});
      3. 引数
      4. 1.クラス名
      5. 2.スーパークラス
      6. 3.プロパティ、メソッドからなるオブジェクト
2. パッケージ化、およびモジュール開発
  1. Dojoクラスのパッケージ化
    1. dojo.provide("info.typea.dojo.Car"); dojo.declare("info.typea.dojo.Car",null,{});
    2. クラスの完全なパッケージパスを指定
    3. dojo.require を使用してクラスをロードするときに、場所を決定するのもパッケージパス
    4. 上記例は、info/typea/dojo/Car.js に保管されるはず
  2. ビルドシステムを使用して、パッケージ化する
    1. クラスをそれぞれのファイルに区別するが、多数の小さなファイルをロードするとパフォーマンスに深刻な影響
    2. 1つのファイルの方がパフォーマンスは良いが、不要なコードが大量に含まれたり、バージョン管理やコード編成が複雑になってしまう
    3. 縮小化プロセス
      1. 不要なホワイトスペース、コメントの削除
      2. ローカル変数を短縮名に変更
      3. ローカル変数の使い方をリファクタリング
Dijit
1. 最大の特徴は、リッチなインターフェースコンポーネントが揃っている
2. DoojoX拡張ライブラリには追加コンポーネントがある
3. 基本的な使用方法法
  1. 1.HTML文書のbody要素にDojoライブラリそのものと、使用するテーマのCSSファイル、テーマへの参照を含める
  2. 2.アプリケーションに組み込むDijitコンポーネントをdojo.require 関数でロード
  3. Dijitをインクルードするためには、基本のDojo Toolkit の他に一覧のJavaScriptファイルをインクルードする必要は無い
  4. Dojo のロードシステムを使用して、動的にロード可能
    1. Dojoをロードするタグに djConfig="parseOnLoad:true" 属性を追加
      1. Dojo のHTMLパーサーを使用して、dojoType属性を持つHTML要素を検索するように指示
4. コンポーネントの操作
  1. 2つの方法
    1. 1.宣言型で追加
      1. Dijitの便利な特徴の一つ
      2. 通常のHTML要素を使ってウィジェットを操作できる
    2. 2.JavaScriptwo使用