Bagaimana AngularJS berbeda dari jQuery

388

Saya hanya tahu satu perpustakaan js dan itu adalah jQuery .
Tapi coders saya yang lain di grup mengubah AngularJS sebagai pustaka default mereka dalam proyek baru.

Saya tidak tahu apa-apa tentang itu. Apa bedanya dengan jQuery?
Saya sudah memiliki satu set fungsi yang dilakukan untuk tugas-tugas serupa di jQuery. Masih bisakah saya menggunakan hal-hal jQuery dengan AngularJS?

Fatamorgana
sumber

Jawaban:

414
  1. Sementara Angular 1 adalah kerangka kerja, Angular 2 adalah platform . ( ref )

Untuk pengembang, Angular2 menyediakan beberapa fitur selain menampilkan data di layar. Misalnya, menggunakan alat angular2 cli dapat membantu Anda "melakukan pra-kompilasi" kode Anda dan menghasilkan kode javascript yang diperlukan ( pohon-gemetar ) untuk mengecilkan ukuran unduhan ke 35Kish.

  1. Angular2 meniru Shadow DOM. ( ref )

Ini membuka pintu untuk rendering server yang dapat mengatasi masalah SEO dan bekerja dengan Nativescript dll yang tidak berfungsi pada browser.

  • Situs dokumen resmi

  • Hari pertama, kunci dari ng-conf 2016

  • Tautan sumber daya Asli: Pada dasarnya, jQuery adalah alat yang hebat bagi Anda untuk memanipulasi dan mengontrol elemen DOM. Jika Anda hanya fokus pada elemen DOM dan tidak ada Data CRUD, seperti membangun situs web bukan aplikasi web, jQuery adalah salah satu alat teratas. (Anda dapat menggunakan AngularJS untuk tujuan ini juga.)

AngularJS adalah sebuah kerangka kerja . Ini memiliki fitur berikut

  1. Pengikatan data dua arah
  2. Pola MVW (MVC-ish)
  3. Templat
  4. Arahan khusus (komponen yang dapat digunakan kembali, markup kustom)
  5. Ramah-REST
  6. Deep Linking (mengatur tautan untuk halaman dinamis apa saja)
  7. Form Validasi
  8. Komunikasi Server
  9. Lokalisasi
  10. Ketergantungan injeksi
  11. Lingkungan pengujian penuh (kedua unit, e2e)

periksa presentasi ini dan pengantar yang bagus ini

Jangan lupa membaca panduan pengembang resmi

Atau pelajari dari tutorial video yang luar biasa ini

Jika Anda ingin menonton lebih banyak video tutorial, lihat posting ini, Kumpulan 60+ tutorial AngularJS terbaik .

Anda dapat menggunakan jQuery dengan AngularJS tanpa masalah.

Bahkan, AngularJS menggunakan jQuery lite di dalamnya, yang merupakan alat yang hebat.

Dari FAQ

Apakah Angular menggunakan perpustakaan jQuery?

Ya, Angular dapat menggunakan jQuery jika itu ada di aplikasi Anda saat aplikasi sedang bootstrap. Jika jQuery tidak ada di jalur skrip Anda, Angular kembali ke implementasi sendiri dari subset jQuery yang kita sebut jQLite.

Namun, jangan mencoba menggunakan jQuery untuk memodifikasi DOM di pengontrol AngularJS, lakukan di arahan Anda.

Memperbarui:

Angular2 dirilis. Berikut adalah daftar sumber daya yang bagus untuk pemula

maxisam
sumber
8
Apakah saya harus mengembangkan aplikasi lengkap dalam Angular js atau saya dapat menggunakannya pada beberapa halaman dan pada beberapa apges saya menggunakan jquery sederhana
Mirage
8
+1 Jawaban bagus. Saya akan mengatakan bahwa Angular mendekati pola MVVM.
GFoley83
8
Saya cukup yakin Angular adalah MVW
iConnor
2
Selama beberapa tahun, itu dekat dengan MVC. Tapi sekarang sedang memperbaiki faktor dan api, lebih dekat ke MVVM. Dalam lingkup $ Angular, berfungsi seperti VM (Model tampilan).
Invincible
14
Untuk setiap orang di masa depan yang bertanya-tanya (seperti saya), MVW == Model-View-Apapun , seperti dalam " m odel- v iew- w hthing-works-for-you" . Dengan kata lain, MV * .
David Frye
40

Saya ingin menambahkan sesuatu tentang perbedaan AngularJS dengan jQuery dari perspektif pengembang.

Di AngularJS Anda harus memiliki pandangan dan pendekatan yang sangat terstruktur tentang apa yang ingin Anda capai. Ini hampir tidak mengikuti mode linier untuk menyelesaikan tugas, tetapi lebih tepatnya, pertukaran antara berbagai objek mengurus permintaan dan tindakan, yang, kemudian, diperlukan karena sudut adalah kerangka kerja Berbasis-MVC . Ini juga memerlukan setidaknya cetak biru umum dari aplikasi yang diselesaikan, karena pengkodean sangat tergantung pada bagaimana Anda ingin interaksi diselesaikan.

jQuery seperti puisi gratis , Anda menulis baris dan menjaga beberapa hubungan dan momentum yang sesuai untuk tugas Anda untuk diselesaikan.

Meskipun, dalam Angular JS, Anda harus mengikuti beberapa aturan serta menjaga momentum dan hubungan tetap baik, mungkin itu lebih seperti soneta klasik Spencerian (penyair klasik terkenal) yang puisinya struktural dan terikat dengan banyak aturan.

Dibandingkan dengan AngularJS, jQuery lebih seperti kumpulan kode dan fungsi (yang, seperti telah disebutkan, bagus untuk manipulasi DOM dan pencapaian efek cepat), sementara AngularJS adalah kerangka kerja nyata yang memberikan pengembang kemampuan untuk membangun web perusahaan -Aplikasi dengan banyak data-binding dan pertukaran dalam routing dan manajemen yang luar biasa.

Lebih jauh, AngularJS tidak memiliki ketergantungan pada jQuery untuk menyelesaikan tugasnya. Ini memiliki dua fitur yang sangat luar biasa yang tidak ditemukan di jQuery dalam arti apa pun:

1- JS Angular mengajarkan Anda cara KODE dan mencapai tujuan, bukan hanya mencapai tujuan dengan cara apa pun. Patut disebutkan bahwa AngularJS sepenuhnya memanfaatkan inti dan jantung Javascripts dan membuka jalan bagi Anda untuk memasukkan dalam aplikasi Anda, teknik-teknik seperti DI (dependensi-injeksi). Untuk bekerja dengan angularJS Anda harus (atau harus) mempelajari lebih banyak teknik pengkodean dengan Javascript.

2- Angular JS sepenuhnya independen untuk menangani arahan dan struktur aplikasi Anda; Anda kemudian dapat mengklaim bahwa jQuery dapat melakukan hal yang sama (independensi), tetapi, memang, AngularJS, sebagaimana beberapa kali disebutkan dalam baris di atas, memiliki independensi dalam cara struktural berbasis MVC yang paling baik.

Catatan terakhir adalah bahwa, tidak ada perang Nama, karena jauh mengganggu untuk menjadi bias, atau subyektif. Besar dan kehebatan jQuery telah terbukti, tetapi penggunaan dan batasannya (dari kerangka kerja atau perangkat lunak apa pun) adalah masalah diskusi dan debat serupa di sekitarnya.

Memperbarui:

Menggunakan AngularJS sangat menentukan karena mahal dalam hal implementasi, tetapi menemukan dasar yang kuat untuk ekspansi, transformasi, dan pemeliharaan aplikasi di masa depan. AngularJS adalah untuk Dunia Baru Web. Ini ditargetkan untuk membangun aplikasi yang ditandai dengan konsumsi sumber daya yang paling sedikit (hanya memuat sumber daya yang diperlukan dari server), waktu respons yang cepat, dan tingkat pemeliharaan yang tinggi dan perpanjangan yang dibungkus dengan sistem terstruktur.

Mostafa Talebi
sumber
"Untuk bekerja dengan angularJS, Anda harus (atau harus) belajar lebih banyak teknik pengkodean dengan Javascript" - tolong beri saya contoh apa yang Anda maksudkan teknik yang ditinggikan?
antew
@MostafaTalebi, saya hanya bercanda, tetapi tidak benar-benar mengerti bahwa "JavaScript lebih merupakan konsep ??" Apa artinya ini?? Bisakah Anda menjelaskan lebih banyak? ehh adakah kita tetap berhubungan ??
azerafati
Maksud saya ini adalah naskah :)))
Mostafa Talebi
Saya mencampur satu hal! misalnya kita menggunakan php untuk sisi server dan kami mengambil kerangka kerja kami berdasarkan konsep MVC dan dalam template yang kami gunakan javascript kami menggunakan Angular js juga jadi di sini angular js MVC tidak berguna, bukan?
Farhad
28

AngularJS: AngularJS adalah untuk mengembangkan aplikasi web yang berat. AngularJS dapat menggunakan jQuery jika itu ada di aplikasi web ketika aplikasi sedang bootstrap. Jika tidak ada di jalur skrip, maka AngularJS kembali ke implementasi sendiri dari subset dari jQuery.

JQuery: jQuery adalah pustaka JavaScript yang kecil, cepat, dan kaya fitur. Itu membuat hal-hal seperti traversal dan manipulasi dokumen HTML, penanganan acara, animasi, dan Ajax jauh lebih sederhana. jQuery menyederhanakan banyak hal rumit dari JavaScript, seperti panggilan AJAX dan manipulasi DOM.

Baca lebih lanjut di sini: angularjs-vs-jquery

kmario23
sumber
20

Saya pikir ini adalah bagan yang sangat bagus menggambarkan perbedaan singkatnya. Pandangan sekilas tentang hal itu menunjukkan sebagian besar perbedaan.

masukkan deskripsi gambar di sini

Satu hal yang ingin saya tambahkan adalah bahwa, AngularJS dapat dibuat untuk mengikuti pola desain MVVM sementara jQuery tidak mengikuti salah satu pola standar Berorientasi Objek.

Pritam Banerjee
sumber
12

Mereka bekerja di level yang berbeda.

Cara paling sederhana untuk melihat perbedaannya, dari perspektif pemula adalah bahwa jQuery pada dasarnya adalah abstrak dari JavaScript, jadi cara kami mendesain halaman untuk JavaScript cukup banyak bagaimana kami akan melakukannya untuk jQuery . Mulailah dengan DOM kemudian bangun lapisan perilaku di atasnya. Tidak demikian halnya dengan Angular . J. Prosesnya benar-benar dimulai dari bawah ke atas, sehingga hasil akhirnya adalah tampilan yang diinginkan.

Dengan jQuery Anda melakukan dom-manipulasi, dengan Angular.Js Anda membuat seluruh aplikasi web.


jQuery dibangun untuk mengabstraksi berbagai keanehan browser, dan bekerja dengan DOM tanpa harus menambahkan pemeriksaan IE6 dan sebagainya. Seiring waktu, itu mengembangkan API yang bagus dan kuat yang memungkinkan kami untuk melakukan banyak hal, tetapi pada intinya, itu dimaksudkan untuk berurusan dengan DOM, menemukan elemen, mengubah UI, dan sebagainya. Anggap saja bekerja langsung dengan mur dan baut.

Angular.Js dibangun sebagai layer di atas jQuery , untuk menambahkan konsep MVC ke front end engineering. Alih-alih memberi Anda API untuk bekerja dengan DOM, Angular.Js memberi Anda komponen yang mengikat data, templating, khusus (mirip dengan jQuery UI , tetapi deklaratif alih-alih memicu melalui JS) dan banyak lagi. Anggap saja ini berfungsi pada level yang lebih tinggi, dengan komponen yang dapat Anda kaitkan bersama, alih-alih langsung pada level mur dan baut.

Selain itu , Angular.Js memberi Anda struktur dan konsep yang berlaku untuk berbagai proyek, seperti Pengontrol, Layanan, dan Arahan. jQuery sendiri dapat digunakan dalam banyak (trilyun) cara untuk melakukan hal yang sama. Untungnya, itu jauh lebih sedikit dengan Angular.Js , yang membuatnya lebih mudah untuk masuk dan keluar dari proyek. Ini menawarkan cara yang waras bagi banyak orang untuk berkontribusi pada proyek yang sama, tanpa harus mempelajari kembali sistem dari awal.


Sebuah perbandingan singkat dapat berupa ini-

jQuery

  • Dapat dengan mudah digunakan oleh mereka yang memiliki pengetahuan yang memadai tentang penyeleksi CSS
  • Ini adalah perpustakaan yang digunakan untuk Manipulasi DOM
  • Tidak ada hubungannya dengan model
  • Mudah memanipulasi konten halaman web
  • Terapkan gaya untuk membuat UI lebih menarik
  • Traversal DOM mudah
  • Efek dan animasi
  • Sederhana untuk melakukan panggilan AJAX dan
  • Kegunaan utilitas
  • tidak memiliki fitur pengikatan dua arah
  • menjadi kompleks dan sulit untuk dipertahankan ketika ukuran proyek meningkat
  • Terkadang Anda harus menulis lebih banyak kode untuk mencapai fungsi yang sama seperti di Angular.Js

Angular.Js

  • Ini adalah Kerangka MVVM
  • Digunakan untuk membuat SPA (Aplikasi Halaman Tunggal)
  • Ini memiliki fitur utama seperti perutean, arahan, pengikatan data dua arah, model, injeksi ketergantungan, tes unit dll
  • bersifat modular
  • Dapat dipertahankan, ketika ukuran proyek meningkat
  • cepat
  • Pengikatan data dua arah Pola berbasis REST ramah-MVC
  • Menghubungkan Jauh
  • Templating
  • Validasi formulir bawaan
  • Injeksi Ketergantungan
  • Lokalisasi
  • Lingkungan Pengujian Penuh
  • Komunikasi Server

Dan banyak lagi

masukkan deskripsi gambar di sini

Pikirkan ini membantu.

Lebih banyak dapat ditemukan -

Abrar Jahin
sumber
3

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 its 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 its 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. Its
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
Jamshaid Kamran
sumber