問題
この記事では、jQueryを使用してWebアプリケーションを開発した経験を共有したいと考えました。
Webアプリケーションのビジネスロジックを記述するプロセス中に、プロジェクトのさらなる開発とリファクタリングのためにコードを正しく構築する必要が生じました。 これは「ウェブ業界」での最初の経験であったため、先に進むことが決定されました。 しばらくして、開発よりも必要なフラグメントの検索に時間がかかることが明らかになりました。 次に、jQueryコードの正しい編成と構造化に関するビジョンを提供したいと思います。
解決策
既存のファッショントレンドを研究した結果、パターンを最大限に活用することが明らかになりました。 それらの組織は、他のプログラミング言語で見られるものと類似しており、次のようになります。
-「コンストラクター」（必要なオブジェクトを作成または返すことができるメソッド）
-基本クラス（基本メソッドを含む構造）
-継承クラス（基本的なメソッドに加えて、追加のメソッドを含む構造）。
したがって、少なくともポリモーフィズムが存在するため、jQueryをOOPとして分類できます。
上記の構造をより詳細に検討してください。 まず、「コンストラクター」を検討します。 これは、オブジェクトのインスタンスを作成または受信して、さらに処理するための関数です。 次のコードはその構造を示しています。
$ .widget = function（name、object）{
$ .fn [name] = function（options）{
this.each（関数（）{
var instance = $ .data（this、name）; //作成された場合はオブジェクトを取得し、それ以外の場合は空のオブジェクトを取得します
if（！インスタンス）{
instance = $ .data（this、name、Object.create（object））; //オブジェクトを作成します
instance。（options、this）;} //初期化
}）;
};
};
コードからわかるように、メカニズムは単純です。 タスクは、キー（名前）によってアクセスされるオブジェクトのいわゆるキャッシュに要約されます。 また、オブジェクトが作成されると初期化されますが、遅延初期化が可能であるため、このアクションは必要ありません。
次に、クラスがどのように見えるかを検討します。 基本クラスから始めましょう：
var BaseCl = {
init：関数（オプション、要素）{
this.options = $ .extend（{}、this.options、options）; // "options"オプションoptions
this.element = $（element）; //参照をベースオブジェクトに保存します
}、
オプション：{
名前： ''
}、
func1：関数（val）{
...
}、
func2：関数（val）{
...
}
};
このクラスには、必要なパラメーターを初期化するためのinitメソッドと、追加のメソッドと構造体のセットが含まれています。
そして、ベースの拡張である最後のクラスが継承されます：
var ChildCl = BaseCl.extend（{
init：関数（オプション、要素）{
this.options = $ .extend（{}、this.options、options）; // "options"オプションoptions
this.element = $（element）; //参照をベースオブジェクトに保存します
}、
オプション：{
名前： ''
}、
func3：function（）{
...
}、
func4：function（）{
...
}
}）;
ご覧のとおり、このクラスはベースと統合されています。 継承されるクラスの定義に初期化メソッドの定義があるため、指定されたメソッドが再定義されます。 さらに、ChildClでは、本体で定義されたメソッドと継承クラスのメソッドの両方を呼び出すことができます。
最後に、作成されたオブジェクトにアクセスできるメソッドを提供します。
$ .widget（ 'child'、ChildCl）;
$（ドキュメント）.ready（関数（）{
//そのように呼び出します
$（ '＃div'）。child（{name： 'hello world'}）;
var chld = $（ '＃div'）。data（ 'child'）;
chld.func1（ ''）;
chld.func3（）;
//どちらか
$（ '＃div'）。child（{name： 'hell'}）;
$（ '＃div'）。child（ 'func1'、 ''）;
}）;
おわりに
この構造化は、アプリケーションオブジェクトの相互作用をより完全に整理し、コードの検索とリファクタリングに費やす時間を削減するのに役立ちました。