web-dev-qa-db-ja.com

AngularJSとjQueryの違いは何ですか

私は1つだけのjsライブラリを知っています、そしてそれは jQuery です。
しかし、このグループの他のコーダーは、新しいプロジェクトのデフォルトライブラリとして AngularJS を変更しています。

私はそれについて何も知りません。それはjQueryとどう違うのですか?
jQueryの同様のタスクのために一連の機能を実行しました。 AngularJSでjQueryのものをまだ使用できますか?

380
user825904
  1. Angular 1はフレームワークでしたが、Angular 2は platform です。 ( ref

開発者にとって、Angular 2は画面にデータを表示する以外にもいくつかの機能を提供します。たとえば、angular2 cliツールを使用すると、コードを「プリコンパイル」して必要なJavaScriptコード( tree-shaking )を生成し、ダウンロードサイズを35Kishまで縮小することができます。

  1. Angular 2はShadow DOMをエミュレートしました。 ( ref

これは、SEOの問題に対処し、ブラウザでは動作しないNativescriptなどで動作することができるサーバレンダリングへの扉を開きます。

  • 公式文書サイト

  • ng-conf 2016の初日の基調講演

  • リソースへのリンク オリジナル: 基本的に、jQueryはDOM要素を操作したり制御したりするための素晴らしいツールです。 WebアプリケーションではなくWebサイトを構築する場合のように、DOM要素のみに注目し、Data CRUDには注目しない場合は、jQueryが最も優れたツールの1つです。 (この目的にもAngularJSを使用できます。)

AngularJSは framework です。以下の機能があります

  1. 双方向データバインディング
  2. MVWパターン(MVC風)
  3. テンプレート
  4. カスタムディレクティブ(再利用可能なコンポーネント、カスタムマークアップ)
  5. RESTにやさしい
  6. ディープリンク(動的ページへのリンクの設定)
  7. フォーム検証
  8. サーバー通信
  9. ローカライゼーション
  10. 依存性注入
  11. フルテスト環境(両ユニット、e2e)

この プレゼンテーション とこの すばらしい紹介 を確認してください

公式の 開発者ガイド を読むことを忘れないでください

または、これらの素晴らしい ビデオチュートリアル から学んでください。

もっとチュートリアルビデオを見たい場合は、この投稿 ベスト60+ AngularJSチュートリアル集 をご覧ください。

AngularJSでjQueryを使用しても問題ありません。

実際、AngularJSはその中にjQuery liteを使用しています。これは優れたツールです。

FAQ から

AngularはjQueryライブラリを使用しますか?

はい、Angularは、アプリケーションのブートストラップ時にjQueryがアプリケーションに存在する場合はjQueryを使用できます。スクリプトパスにjQueryが存在しない場合、AngularはjQLiteと呼ばれるjQueryのサブセットの独自の実装にフォールバックします。

ただし、AngularJSコントローラでDOMを変更するためにjQueryを使用するのではなく、ディレクティブで実行してください。

更新:

Angular 2がリリースされました。He​​reは初心者向けの優れたリソースリストです。

410
maxisam

開発者の観点からAngularJSjQueryとの違いに関する何かを追加したいと思います。

AngularJSでは、達成したいことに関して非常に構造化ビューとアプローチが必要です。 linearに従ってタスクを完了することはほとんどありませんが、むしろ、さまざまなオブジェクト間のやり取りがリクエストとアクションを処理します。これはangularとして必要ですMVCベースフレームワーク。また、コーディングはインタラクションの完了方法に大きく依存するため、最終的なアプリケーションの少なくとも一般的な青写真が必要です。

jQueryはfree詩のようなもので、行を書き、タスクを達成するために適切な関係と勢いを保ちます。

Angular JSでは、運動量と関係を適切に保つだけでなく、いくつかの規則に従う必要があります。おそらく、詩が構造的で多くの規則に結びついている古典的なスペンサーソネット(有名な古典詩人) 。

AngularJSと比較して、jQueryはコードと関数のコレクションに似ています(既に述べたように、DOM操作と高速効果の達成に最適です)一方で、AngularJSは開発者にエンタープライズWebを構築する機能を提供する実際のフレームワークです-見事に組織化されたルーティングと管理内での大量のデータバインディングと交換を伴うアプリケーション。

さらに、AngularJSには、タスクを完了するためのjQueryへの依存がありません。 jQueryにはない2つの非常に優れた機能があります。

1-​​= Angular JSは、何らかの方法で目標を達成するだけでなく、目標をコーディングして達成する方法を教えます。 AngularJSはJavascriptsのコアとハートを完全に活用し、アプリ(DI(dependency-injection)などの手法)に組み込む方法の道を開くことに言及する価値があります。 angularJSを使用するには、Javascriptを使用したより高度なコーディング技術を学習する必要があります(または学習する必要があります)。

2- Angular JSはディレクティブを処理し、アプリを構造化するために完全に独立しています。その後、jQueryは同じ(独立性)を行うことができると単純に主張するかもしれませんが、実際、AngularJSは、上記の行で何度も言及したように、構造的に最も優れたMVCベースの方法で独立性を持っています。

最後の注意点は、名前の戦争はないということです。なぜなら、偏見を抱いたり、主観的であったりするのは非常に不安だからです。 jQueryの大きさと偉大さは証明されていますが、その使用法と制限(フレームワークまたはソフトウェアのいずれか)は、議論と同様の議論の懸念です。

更新:

AngularJSを使用することは、実装の点で費用がかかるため決定的ですが、アプリケーションの将来の拡張、変換、および保守のための強力な基盤が見つかりました。 AngularJSは、Webの新世界向けです。最小のリソース消費(サーバーから必要なリソースのみをロードする)、高速な応答時間、構造化シ​​ステムにラップされた高度な保守性と拡張性を特徴とするアプリケーションの構築を対象としています。

39
Mostafa Talebi

AngularJS: AngularJSは、重いWebアプリケーションを開発するためのものです。アプリケーションがブートストラップされているときにWebアプリケーションに存在する場合、AngularJSはjQueryを使用できます。スクリプトパスに存在しない場合、AngularJSはjQueryのサブセットの独自の実装にフォールバックします。

JQuery: jQueryは、小さくて高速で機能豊富なJavaScriptライブラリです。 HTML文書のトラバーサルと操作、イベント処理、アニメーション、そしてAjaxなどのことがはるかに簡単になります。 jQueryは、AJAX呼び出しやDOM操作など、JavaScriptからの多くの複雑なことを単純化します。

ここで詳細を読む: angularjs-vs-jquery

27
kmario23

これ は、違いを簡単に説明した非常に優れた表です。一目でそれの違いのほとんどを示しています。

enter image description here

追加したいことの1つは、 AngularJS _ mvvm _ の設計パターンに従うようにすることができますが、 jQuery は標準オブジェクトには従わないことです指向パターン.

16
Pritam Banerjee

彼らはさまざまなレベルで働きます。

違いを見るための最も簡単な方法 初心者の観点から jQuery が基本的にJavaScriptの抽象であるため、JavaScript用にページを設計する方法はほとんどどうするかです。 jQuery の場合はDOMから始めて、その上にビヘイビアレイヤを構築します。 Angular.Js ではそうではありません。プロセスは実際にはゼロから開始されるため、最終的な結果は望ましいビューです。

jQuery を使えば、あなたはDOM操作をすることができ、 Angular.Js を使えば、Webアプリケーション全体を作成できます。


jQuery は、さまざまなブラウザの特殊性を抽象化し、IE6チェックなどを追加しなくてもDOMを処理するために作成されました。時間が経つにつれて、それは私たちが多くのことをすることを可能にする素晴らしい、堅牢なAPIを開発しました、しかしその核心で、それはDOMを扱うこと、要素を見つけること、UIを変えることなどのために意味されます。ナットとボルトで直接機能すると考えてください。

フロントエンドエンジニアリングに MVC の概念を追加するために、 Angular.JsjQuery の上にレイヤーとして構築されました。 DOMを使用するためのAPIを提供する代わりに、 Angular.Js を使用すると、データバインディング、テンプレート作成、カスタムコンポーネント( jQuery UI に似ていますが、JSによるトリガーの代わりに宣言型)もっとたくさん。ナットとボルトのレベルで直接ではなく、一緒にフックできるコンポーネントを使用して、より高いレベルで作業していると考えてください。

さらに Angular.Js は、コントローラ、サービス、ディレクティブなど、さまざまなプロジェクトに適用される構造と概念を提供します。 jQuery 自体は、同じことをするために複数の方法で使用できます。ありがたいことに、これは Angular.Js の方がはるかに少ないため、プロジェクトへの出入りが簡単になります。システムを一から学び直す必要なく、複数の人が同じプロジェクトに貢献するための賢明な方法を提供します。


簡単な比較はこれになります -

jQuery

  • CSSセレクタについて適切な知識を持っている人でも簡単に使える
  • DOM操作に使用されるライブラリです。
  • モデルとは関係ありません
  • Webページのコンテンツを簡単に操作する
  • UIをより魅力的にするためにスタイルを適用する
  • 簡単なDOMトラバーサル
  • 効果とアニメーション
  • AJAXを呼び出すのは簡単
  • ユーティリティの使いやすさ
  • 双方向バインディング機能はありません
  • プロジェクトの規模が大きくなると、複雑になり保守が困難になります。
  • Angular.Js と同じ機能を実現するために、より多くのコードを記述しなければならない場合があります。

Angular.Js

  • それはMVVMフレームワークです
  • SPA(シングルページアプリケーション)の作成に使用されます
  • ルーティング、ディレクティブ、双方向データバインディング、モデル、依存性注入、単体テストなどの主要機能があります。
  • モジュラーです
  • プロジェクトの規模が拡大しても維持可能
  • 速いです
  • 双方向データバインディングRESTフレンドリーMVCベースのパターン
  • ディープリンク
  • テンプレート作成
  • 組み込みフォームの検証
  • 依存性注入
  • ローカライゼーション
  • 完全なテスト環境
  • サーバー通信

そしてもっと

enter image description here

これが助けになると思います。

もっと見つかります -

10
Abrar Jahin

Jquery: - /

jQuery is a lightweight and feature-rich JavaScript Library that helps web developers
by simplifying the usage of client-side scripting for web applications using JavaScript.
It extensively simplifies using JavaScript on a website and it’s lightweight as well as fast.

So, using jQuery, we can:

easily manipulate the contents of a webpage
apply styles to make UI more attractive
easy DOM traversal
effects and animation
simple to make AJAX calls and
utilities and much more… 

AngularJS: -

AngularJS is a product by none other the Search Engine Giant Google and it’s an open source
MVC-based framework(considered to be the best and only next generation framework). AngularJS
is a great tool for building highly rich client-side web applications.

As being a framework, it dictates us to follow some rules and a structured approach. It’s
not just a JavaScript library but a framework that is perfectly designed (framework tools
are designed to work together in a truly interconnected way).

In comparison of features jQuery Vs AngularJS, AngularJS simply offers more features:

Two-Way data binding
REST friendly
MVC-based Pattern
Deep Linking
Template
Form Validation
Dependency Injection
Localization
Full Testing Environment
Server Communication
3
user6788628