AngularJS とは何ですか? 概要、アーキテクチャ、機能

AngularJS とは何ですか?

AngularJS は、オープンソースの Model-View-Controller フレームワークであり、 JavaScriptを フレームワーク。 AngularJS はおそらく、現在利用できる最新の Web フレームワークの中で最も人気のあるものの XNUMX つです。 このフレームワークは、主に単一ページ アプリケーションの開発に使用されます。 このフレームワークは、Google 自体の開発者グループによって開発されました。

Google の全面的なサポートと幅広いコミュニティ フォーラムからのアイデアにより、フレームワークは常に最新の状態に保たれます。 また、常に市場の最新の開発トレンドを取り入れています。

AngularJS アーキテクチャ

Angular.js は MVC アーキテクチャに従っており、以下に示す MVC フレームワークの図は次のとおりです。

AngularJS アーキテクチャ
Angularjs アーキテクチャ図
  • コントローラーはビジネス ロジックを持つレイヤーを表します。 ユーザー イベントは、コントローラー内に保存されている関数をトリガーします。 ユーザー イベントはコントローラーの一部です。
  • ビューは、エンドユーザーに提供されるプレゼンテーション層を表すために使用されます。
  • モデルはデータを表すために使用されます。 モデル内のデータは、プリミティブ宣言だけを含めた単純なものにすることができます。 たとえば、学生のアプリケーションを管理している場合、データ モデルには学生 ID と名前だけを含めることができます。 または、comでも可能ですplex 構造化されたデータモデルを持つことによって。 車の所有権アプリケーションを管理している場合は、エンジン容量や乗車定員などの観点から車両自体を定義する構造を作成できます。

AngularJSの特徴

Angular には次のようなものがありますwing 市場で強力なフレームワークの XNUMX つとなる重要な機能:

  1. MVC – このフレームワークは、次のような有名な概念に基づいて構築されています。 MVC (モデル-ビュー-コントローラー)。 これは、現代のすべての Web アプリケーションで使用されているデザイン パターンです。 このパターンは、ビジネス ロジック層、データ層、およびプレゼンテーション層を個別のセクションに分割することに基づいています。 さまざまなセクションへの分割は、それぞれをより簡単に管理できるようにするために行われます。
  2. データモデルバインディング – データを HTML コントロールにバインドするための特別なコードを記述する必要はありません。 これは、Angular でコードの一部を追加するだけで実行できます。
  3. 書くコードが少なくなる – DOM操作を大量に実行する場合 JavaScriptを アプリケーションを設計するには、これを記述する必要がありました。 しかし、Angular を使用すると、DOM 操作のために記述する必要があるコードの量が驚くほど少なくなるでしょう。
  4. ユニット テスト 準備完了 – Google のデザイナーは Angular を開発しただけでなく、AngularJS アプリケーションの単体テストの設計に役立つ「Karma」と呼ばれるテスト フレームワークも開発しました。

AngularJS の利点

AngularJS の利点は次のとおりです。

  • オープンソース フレームワークであるため、エラーや問題の数は最小限であることが期待できます。
  • 双方向バインディング – Angular.js はデータ層とプレゼンテーション層の同期を維持します。 これで、HTML コード内のデータと後でデータの同期を保つために追加の JavaScript コードを作成する必要がなくなります。 Angular.js がこれを自動的に実行します。 どのコントロールをモデルのどの部分にバインドするかを指定するだけです。
AngularJS の利点

AngularJS の利点
  • ルーティング – Angular は、あるビューから別のビューに移動することを意味するルーティングを処理できます。 これはシングルページアプリケーションの重要な基本です。 ユーザーの操作に基づいて Web アプリケーションのさまざまな機能に移動できますが、同じページに留まったままになります。
  • Angular は両方のテストをサポートします 単体テスト統合テスト.
  • ディレクティブと呼ばれる独自の要素を提供することで HTML を拡張します。 大まかに言うと、ディレクティブは DOM 要素 (属性、要素名、コメントや CSS クラスなど) 上のマーカーであり、指定された動作をその DOM 要素に付加するように AngularJS の HTML コンパイラーに指示します。 これらのディレクティブは、既存の HTML 要素の機能を拡張して、Web アプリケーションにさらなる機能を与えるのに役立ちます。