モヒカンとは何ですか？
Mohawk（MohawkまたはMohawk）は、Iroquois CMS用に作成され、使用されるJSフレームワークです。 当初、このフレームワークは、クロスブラウザースクリプトを作成するためのjs-functionのセットとして作成されましたが、後にスタンドアロンフレームワークに開発されました。
jQueryまたは他の一般的なフレームワークを使用しないのはなぜですか？
実際、イロコイが作成されたとき、jQueryはまだ存在していませんでした。 当時、プロトタイプは非常に人気があり、jQueryは勢いを増してきました。 しかし、プロトタイプはRoRコミュニティでより人気があったため、実際には使用したくありませんでした:)
モヒカンは何ができますか？
今日、Mohawkは次の機能を備えた完全なクロスブラウザjsフレームワークです。
-オブジェクトの作成（オブジェクトモデル）
-DOMの操作（ツリーのナビゲート、CSSクラスとイベントの管理、DOMの操作の簡素化）
-Ajaxインターフェース（フォームの簡略化された作業を含む）
-オブジェクトのドラッグとサイズ変更
-視覚効果の小さなセット
-テンプレートエンジン（jsテンプレート）
-UIコンポーネント（WYSIWYG、リスト、タブ、入力フィールドなど）
この記事では、オブジェクトモデルの説明から始めたいと思います。
オブジェクトモデル
モホーク族のオブジェクトモデルの主な目的は、クラス継承メカニズムの存在でした。 その時点でフレームワークを作成するとき、jsには基本的に2つの人気のあるOOPの実装がありました。
-関数としてのクラスの定義、および関数のプロトタイプの拡張による後続の継承（およそ、次のように： www.kevlindev.com/tutorials/javascript/inheritance ）
-Dean Edwardsのbase2フレームワークのメソッド（http://code.google.com/p/base2/）
最初の方法は適合しませんでした、なぜなら 継承されたクラスから継承すると、親への参照で不幸が始まりました。 Dean Edwardsのメソッドは完全に機能しましたが、2つのことが忘れられませんでした。1。基本クラスとして「klass」、2。親を参照する方法がなく、書き換えられた親メソッドのみを参照する方法。 ただし、ニーズに合わせてコードを変更しようと何度か試みましたが、継承メソッドを解析するときに頭脳が沸騰しました:)私が間違っていなければ、MooToolsはまだコードでこのメソッドを使用しています。
それで、モヒカンでオブジェクトモデルはどのように機能しますか。
クラス作成
クラスはClass関数を介して作成され、その唯一の引数はクラスのオブジェクト（本体）になります。
var A = new Class({ /* */ });
* This source code was highlighted with Source Code Highlighter .
nameプロパティ、名前を受け入れるコンストラクター、およびhelloメソッドを使用してPersonクラスを作成しましょう。
var Person = new Class({
//
name: 'anonoymous' ,
//
__construct: function (name) {
self.name = name; //
},
//
hello: function () {
Console.log( 'Hello, my name is ' + self.name);
}
});
* This source code was highlighted with Source Code Highlighter .
コードからわかるように、コンストラクターは、渡されたオブジェクトの__constructフィールドを介して設定されます（明らかに、名前はPHPの影響を受けました）。 もう1つ注意してください。クラスメソッド内では、クラス参照は通常のthisではなく自己変数です。 その理由は、 これが環境に依存することが多く、変数selfが一定になるためです。 helloメソッドでは、Mohawkコンソールにメッセージを書き込んで、例でその動作を確認できるようにします。 ご覧のとおり、メソッドでは、nameプロパティはself変数を介してアクセスされます。
こちらの実際の動作をご覧ください： demo.irokez.org/mohawk
サンプルフレームワークをここからダウンロードします： irokez.org/download/mohawk
オブジェクトをテストします。
var alice = new Person( 'Alice' );
alice.hello();
* This source code was highlighted with Source Code Highlighter .
コンソールには、「こんにちは、私の名前はアリスです」と表示されます。
継承
ここで、 Personから派生したクラスを作成します。 追加の学校フィールド、新しいenterメソッド、オーバーロードされたhelloメソッドを備えたStudentとします。 継承は、作成されたPersonクラスのextendsメソッドを介して実行されます。 パラメータは、 クラスと同様に、継承されたクラスの「本体」を渡します。
var Student = Person.extend({
school: '' ,
enters: function (school) {
self.school = school;
},
//
hello: function () {
// ""
parent.hello();
if (self.school) {
Console.log( 'I study at ' + self.school);
} else {
Console.log( 'I don\'t study yet' );
}
}
});
* This source code was highlighted with Source Code Highlighter .
この例からわかるように、 親変数を介して親へのリンクを取得できます。
新しいクラスのテスト：
var bob = new Student( 'Bob' );
bob.enters( 'MIT' );
bob.hello();
* This source code was highlighted with Source Code Highlighter .
コンソール出力：
こんにちは、ボブです
私はMITで勉強しています
静的プロパティとメソッド
最近のバージョンでは、静的プロパティとメソッドがモホーク語に追加されました。 それらへのアクセスは、 静的変数を介して行われます。 例を見てみましょう：
var Phd = Student.extend({
hi: function () {
self.hello();
Console.log( 'My degree is ' + static .degree);
}
})
Phd.degree = 'PhD' ; // ( ) degree
//
var carol = new Phd( 'Carol' );
carol.enters( 'MIT' );
carol.hi();
* This source code was highlighted with Source Code Highlighter .
コンソールには以下が表示されます。
こんにちは、私の名前はキャロルです
私はMITで勉強します
私の学位は博士号です
シングルトン
1つのインスタンスでのみクラスが必要な場合があります。これには、既製のシングルトーン関数を使用できます。
var ProfSmith = new Singletone({
hello: function () {
Console.log( 'Hello, I am Prof. Smith' );
}
});
ProfSmith.hello(); // Hello, I am Prof. Smith
* This source code was highlighted with Source Code Highlighter .
例からわかるように、ProfSmithオブジェクトは定義されるとすぐに作成されます。
構文糖
そして最後に、少し構文的な砂糖。 次のコードがコンソールに出力する内容を推測します。
var sugar = new Singletone({
a: function () {
Console.log( 'I am called from method ' + __function__);
},
b: function () {
Console.log( 'I am called from method ' + __function__);
}
});
sugar.a();
sugar.b();
* This source code was highlighted with Source Code Highlighter .
次の記事では、興味があればフレームワークの説明を続けます。 ご清聴ありがとうございました。
PS：フレームワークをダウンロードしてIE7を使用している場合、MohawkはIE7に不一致があるかもしれません。 したがって、可能であれば、アドレスが少なくともlocalhostになるようにローカルWebサーバーを介して実行します。