Saat Anda baru mulai mempelajari pengembangan web, Anda melihat bahwa semakin banyak pintu untuk opsi baru dan interaktif mulai terbuka. Ketika kurva pembelajaran mulai menjadi lebih merata, berbagai elemen interaktif, optimisasi, dan segala sesuatu di antaranya tampaknya merupakan kejadian alami. Apa pun pilihan Anda mempelajari pengembangan web adalah - apakah dengan guru, daring atau otodidak - Anda mungkin pernah mendengar bahwa pilihan Anda yang terlalu besar dalam skenario ini harus selalu berupa JavaScript. Bagaimanapun, ini adalah bahasa internet! Tetapi bagaimana jika saya memberi tahu Anda bahwa ada pilihan lain? Dalam tutorial ini, kita akan mengeksplorasi konfrontasi berkelanjutan dari perbedaan jQuery dan Javascript, dan semua yang disediakan konfrontasi ini.
Saya akan memberi tahu Anda semua tentang kedua bahasa - untuk apa mereka digunakan, pro dan kontra, dan sebagainya. Kemudian dalam tutorial, ketika kami sudah menemukan keduanya, kami akan membandingkan dan membedakan mereka dari berbagai perspektif - aksesibilitas kode, peluang karier, dan sebagainya. Jadi, tanpa basa-basi lagi, mari kita lompat langsung ke dalamnya!
Daftar Isi
- 1. Dilema Perbedaan jQuery dan Javascript
- 2. jQuery adalah JavaScript
- 2.1. JavaScript
- 2.2. Apa itu jQuery?
- 3. jQuery vs JavaScript Dalam Kode
- 3.1. Kesimpulan Prematur
- 3.2. Kembali ke Bar
- 3.3. Kesimpulan Prematir Kedua
- 3.4. Tujuan Karir
- 4.
- 5. Fungsi Spesifik
- 5.1. Kompabilitas Lintas Browser
- 5.2. Manipulasi DOM
- 5.3. Efek dan Animasi
- 5.4. APIs
- 6. Kesimpulan
Dilema Perbedaan jQuery dan Javascript
Namun, ketika Anda mencari beberapa jawaban untuk masalah JavaScript online, Anda menemukan jawaban yang hanya mengatakan, "lakukan dengan jQuery".
Penawaran Terakhir yang Aktif Saat Ini:Unlock a year of unlimited data and AI learning at half the price! This is your final call to save big on expertise for 2025. Act fast and secure your 50% discount with DataCamp's End of Year Sale – the clock is ticking!
Reaksi Anda mungkin ‘apa itu jQuery?’ Anda pikir Anda benar-benar harus tahu JavaScript, tetapi sekarang ada alternatif? Anda tidak siap untuk dilema perbedaan jQuery dan Javascript ini ...
Atau mungkin Anda mendekati dilema dari sudut pandang yang berbeda. jQuery adalah metode yang disarankan untuk Anda untuk situs web Anda, tetapi sekarang Anda telah membaca secara online bahwa JavaScript dapat melakukan apa saja yang dapat dilakukan jQuery dan lebih banyak lagi sementara mengode dalam vanilla JavaScript juga membuat Anda menjadi pengembang yang lebih baik.
Sekarang Anda bertanya kepada diri sendiri, 'apa itu JavaScript? Mengapa segalanya tidak sederhana? Tidak bisakah saya menggunakan jQuery?
Tapi tunggu, tahan pikiran itu sejenak - apakah itu akan menambah kebingungan Anda jika Anda mengetahui bahwa Javascript & jQuery bukan dua pilihan yang berbeda?
jQuery adalah JavaScript
Kami mungkin telah menyajikan dilema perbedaan jQuery dan Javascript seolah-olah itu adalah pertarungan antara dua teknologi yang bersaing, tetapi sebenarnya, perbedaan antara JavaScript dan jQuery adalah bahwa jQuery benar-benar hanya cara yang berbeda dalam menggunakan JavaScript.
jQuery umumnya disebut sebagai framework atau library. Sebelum kita membahas apa arti istilah-istilah itu, mari kita cepat memastikan tidak ada yang bertanya-tanya, 'apa itu JavaScript?'
JavaScript
JavaScript adalah bahasa pemrograman peramban, atau setidaknya, hanya itu yang terjadi hingga saat ini - jangkauannya kini telah menyebar di luar batas jendela peramban ke penggunaan lain seperti kode sisi server.
Dalam tujuan utamanya sebagai bahasa pemrograman sisi klien yang ditulis ke dalam setiap browser internet, ia bertanggung jawab atas elemen interaktif dan dinamis pada halaman web, seperti mendengarkan dan bereaksi terhadap input pengguna.
Sekarang, bagaimana dengan jQuery?
Apa itu jQuery?
Seperti yang telah kami tentukan, jQuery adalah perpustakaan JavaScript. Itu pada dasarnya berarti bahwa itu adalah kumpulan kode JavaScript yang dipaket bersama yang dapat diakses oleh garis kode yang lebih sederhana, sehingga memudahkan pengembang untuk mengimplementasikan JavaScript tanpa harus menulis kode JavaScript yang rumit, berkat kode pra-tertulis yang dikemas di jQuery.
Jika Anda sudah terbiasa dengan Bootstrap, analogi yang baik mungkin hubungan antara CSS dan Bootstrap. Bootstrap hanyalah kumpulan perintah CSS yang membuatnya lebih mudah dan lebih cepat untuk menata halaman web. jQuery untuk JavaScript apa itu Bootstrap untuk CSS.
Bagi mereka yang tidak mengenal Bootstrap, mari kita coba analogi dunia nyata dengan pertanyaan perbedaan jQuery dan Javascript.
Misalkan Anda berada di sebuah bar dengan teman Anda Dave. Dave minum bir terlalu banyak dan berbicara terlalu keras. Anda ingin Dave berhenti mempermalukan Anda dan berhenti berbicara begitu keras.
Tindakan Anda adalah menjelaskan kepada Dave bahwa Anda telah memperhatikan para wanita di bagian belakang bar membuat wajah kesal ke arahnya.
Anda menjelaskan bahwa pria yang duduk di meja sebelah Anda telah pindah untuk mendapatkan kedamaian. Anda memberi tahu Dave bahwa istrinya tidak akan menghargai beberapa detail hubungan mereka yang dibagikan dengan seluruh bar.
Dave berhenti bicara. Ini adalah cara JavaScript untuk membuat Dave berhenti bicara.
Pendekatan jQuery akan dengan sederhana mengatakan:
‘Berhenti bicara, Dave’.
Dave berhenti bicara. Anda telah mencapai hal yang sama dengan kata-kata yang jauh lebih sedikit dan itu jauh lebih mudah.
jQuery vs JavaScript Dalam Kode
Pelajaran Satu di BitDegree ‘Tutorial jQuery Interaktif: Pelajari Cara Menggunakan Efek & Acara jQuery‘ membuat perbedaan antara JavaScript dan jQuery sangat jelas dalam kode.
Contohnya adalah tombol HTML yang membuka dan menutup formulir masuk.
Ini adalah kode JavaScript:
const login = document.getElementById("login");
const loginMenu = document.getElementById("loginMenu");
login.addEventListener("click", () => {
if(loginMenu.style.display === "none"){
loginMenu.style.display = "inline";
} else {
loginMenu.style.display = "none";
}
});
Sementara di sini adalah kode jQuery:
$("#login").click(() => {
$("#loginMenu").toggle()
});
Apa yang mengambil sembilan baris kode dalam JavaScript hanya membutuhkan tiga baris kode untuk dicapai dalam jQuery.
Kesimpulan Prematur
Jadi itu sepertinya bukan-bukan-bukan? Gunakan jQuery.
Mungkin semudah itu satu dekade yang lalu, tetapi pada tahun 2018 relevansi jQuery dalam pengembangan web menurun, dan contoh-contoh seperti kode di atas menjadi langka.
Masih ada alasan bagus untuk belajar dan menggunakan jQuery, tetapi jika itu adalah pertanyaan tentang perbedaan jQuery dan Javascript, kebutuhan untuk memahami dan dapat menggunakan JavaScript semakin cepat, dengan beberapa kekuatan barunya membuat banyak fungsi jQuery mubazir.
Kembali ke Bar
Untuk menunjukkan argumen lain dalam debat perbedaan jQuery dan Javascript, mari kembali ke bar untuk merentangkan analogi kita sedikit lebih jauh. Anda telah memutuskan untuk memberi tahu Dave agar diam. Sementara strategi yang efektif untuk mencapai tujuan Anda, Dave kesal dan dalam suasana hati yang buruk di taksi yang Anda bagikan di rumah.
Seandainya Anda menggunakan strategi JavaScript untuk menjelaskan kepada Dave bahwa ia harus mengurangi suaranya, Anda mungkin bisa mengampuni perasaannya dan membuatnya dalam suasana hati yang baik. Kekuatan persuasi Anda bisa jauh lebih besar dengan strategi JavaScript, bahkan jika itu membutuhkan lebih banyak usaha.
Demikian pula, jika Anda mempelajari JavaScript, kekuatan pengembangan web Anda akan jauh lebih besar daripada apa yang akan terjadi jika Anda hanya belajar jQuery. Mungkin mengatakan pada Dave untuk tutup mulut tidak akan membuatnya kesal, tetapi itu bisa tidak terduga.
Dibandingkan, perilaku perintah jQuery mungkin persis seperti yang Anda butuhkan, tetapi sulit untuk memastikan tanpa memahami kode yang membuat jQuery berfungsi. Dan tentu saja, karena jQuery terdiri dari kode JavaScript, Anda harus memahami JavaScript untuk memahami sepenuhnya bagaimana setiap perintah jQuery bekerja.
Secara logis, JavaScript dapat melakukan semua yang dapat dilakukan jQuery, dan lebih banyak lagi, karena, mengulangi lagi untuk penekanan, jQuery hanyalah JavaScript.
Kesimpulan Prematir Kedua
Jadi begitu ya? Perbedaan antara jQuery dan JavaScript adalah bahwa jQuery lebih sederhana dan lebih mudah tetapi JavaScript lebih kuat dan tidak mengecewakan Dave. Jadi jawaban untuk pertanyaan JavaScript vs jQuery adalah mempelajari JavaScript?
Ya tidak, tidak cukup. Sayangnya, tidak ada satu ukuran yang cocok untuk semua jawaban atas pertanyaan perbedaan jQuery dan Javascript. Apakah Anda memerlukan jQuery atau JavaScript tergantung pada tujuan karir Anda dan fungsi yang diperlukan dalam proyek Anda.
Tujuan Karir
Jika tujuan Anda adalah menjadi Pengembang Front-End, jawaban untuk pertanyaan perbedaan jQuery dan Javascript sederhana: pelajari JavaScript. Iklan lowongan kerja mungkin meminta jQuery, tetapi pertanyaan JavaScript vs jQuery adalah pertanyaan sederhana untuk setiap manajer perekrutan: mereka hampir pasti akan lebih menyukai kandidat yang mengetahui JavaScript daripada mereka yang tahu jQuery.
Bahkan jika sebuah perusahaan menggunakan jQuery secara luas, diasumsikan seorang kandidat yang dapat memahami JavaScript dapat mempelajari jQuery dengan cepat dan mudah. Mempelajari JavaScript jauh lebih sulit, bahkan jika Anda seorang master jQuery.
Namun, jika tujuan Anda adalah menjadi perancang web lepas, JavaScript mungkin tidak terlalu diperlukan. Jika Anda membangun situs web untuk klien di sistem manajemen konten seperti WordPress, banyak kebutuhan untuk JavaScript dapat ditangani oleh jQuery atau plugin yang tersedia secara bebas yang menambah fungsionalitas ke situs Anda.
Sebagian besar situs web online dapat dibangun tanpa memerlukan kode JavaScript khusus. Selama Anda mengenali jenis fungsi situs web yang mengharuskan Anda menulis kode JavaScript khusus dan apa yang tidak, ada banyak pekerjaan di luar sana untuk perancang web dengan keterampilan HTML, CSS, dan jQuery.
Pada titik ini, saya telah menjawab pertanyaan apa itu JavaScript dan apa itu jQuery. Seharusnya jelas apa perbedaan antara JavaScript dan jQuery, tetapi jawaban untuk JavaScript vs jQuery masih belum jelas bagi banyak orang.
Jika Anda sudah memutuskan dan ingin mulai belajar, Anda dapat mengikuti tautan ke salah satu dari dua kursus yang digambarkan untuk memulai langsung. Jika Anda tertarik dengan perbandingan yang lebih terperinci di antara bahasa-bahasa tersebut, teruskan membaca.
Fungsi Spesifik
Jadi sekarang Anda memiliki gagasan tentang apa itu JavaScript dan apa itu jQuery, dan nilai dari masing-masing di jalur karier yang Anda pilih, mari kita menggali lebih dalam ke dalam kasus penggunaan tertentu.
JavaScript dapat melakukan apa saja yang dapat dilakukan jQuery, jadi apa contoh spesifik yang mungkin lebih baik menggunakan kode jQuery?
Kompabilitas Lintas Browser
Sebutkan Internet Explorer ke pengembang yang berpengalaman dan Anda dapat menyaksikan wajah mereka memerah, mata bengkak, pembuluh darah mengepal dan mengepalkan ketika mereka merenungkan masa kelam dalam karier mereka ketika banyak orang menggunakan peramban terkenal Microsoft. Sebutkan IE8 dan kepala pengembang mungkin akan meledak.
Banyak pertumbuhan jQuery dapat dikaitkan dengan fakta bahwa ia menyumbat celah di antara browser. Sebagian besar browser hari ini menafsirkan JavaScript dengan cara yang sama, tetapi sepuluh tahun yang lalu ada perbedaan besar antara browser. Anda harus menulis kode Anda dengan berbagai cara yang berbeda sehingga dapat dipahami oleh masing-masing dan setiap browser.
Atau, Anda bisa menggunakan jQuery, yang melakukan kerja keras untuk Anda. Satu baris kode jQuery akan ditafsirkan oleh perpustakaan jQuery ke dalam berbagai baris kode JavaScript yang diperlukan untuk menyenangkan setiap browser. Untuk pengembang, menggunakan jQuery dalam situasi ini benar-benar tidak perlu dipikirkan lagi.
Namun saat ini, perbedaan browser itu kecil. Dan jika Anda menemukan perbedaan, misalnya ketika menggunakan beberapa fitur pembaruan terbaru ke bahasa JavaScript ES6, disarankan untuk menggunakan polyfill sebagai gantinya. Polyfill hanyalah pustaka yang menangani perbedaan-perbedaan antara browser dan dapat diimplementasikan hanya dengan URL yang mereferensikan CDN polyfill dalam tag skrip.
Polyfill modern akan mendeteksi browser apa yang digunakan pengguna akhir dan hanya menyajikan kode yang diperlukan untuk mengadaptasi kode Anda ke browser pengguna. Itu menghemat waktu pemuatan, seolah-olah pengguna hanya memuat kode yang mereka butuhkan, situs web Anda akan memuat lebih cepat pada mesin mereka daripada yang seharusnya dilakukan jika mereka harus memuat seluruh perpustakaan jQuery.
Kompatibilitas lintas browser pernah menjadi alasan utama untuk menggunakan jQuery, tetapi sekarang ini bahkan bukan solusi terbaik untuk mengatasi masalah yang jauh dari masalah seperti dulu.
Manipulasi DOM
DOM, atau Document Object Model, adalah interpretasi browser dari halaman web yang Anda layani. Jika Anda mengklik kanan pada halaman web mana pun dan mengklik memeriksa, di bawah panel Elemen Anda akan melihat DOM. Ini mungkin terlihat seperti kode index.html Anda, tetapi ingat bahwa banyak konten HTML biasanya dirender secara dinamis dari server menggunakan kode sisi server seperti PHP.
Elemen DOM juga dapat dirender dan dimanipulasi dengan JavaScript, yang merupakan area lain di mana jQuery pernah terbukti sangat berguna.
Dengan jQuery, Anda dapat menargetkan node DOM, pada dasarnya elemen HTML, seperti heading level dua dengan kode
$(“h2”)
Anda kemudian dapat menghubungkan fungsi ke kode itu untuk melakukan apa pun yang Anda suka, seperti mendengarkan acara atau memodifikasi DOM untuk mengubah hal-hal di situs web Anda saat pengguna menggunakannya.
Dengan JavaScript, Anda dapat melakukan hal yang sama menggunakan kode,
document.querySelector("h2")
Itu bukan perbedaan yang sangat besar, bukan? Di masa lalu, metode Manipulasi DOM dengan JavaScript tidak mudah atau konsisten di seluruh browser. Selain itu, menggunakan JavaScript vanili (JavaScript vanili berarti JavaScript murni yang tidak diubah tanpa perpustakaan) dianggap lebih berkinerja - yang pada dasarnya berarti melakukannya lebih cepat dan / atau menggunakan lebih sedikit sumber daya memori.
Sekali lagi ini terlihat seperti kemenangan lain untuk JavaScript dalam debat perbedaan jQuery dan Javascript. Namun, popularitas jQuery berarti Anda akan melihat banyak kode jQuery yang digunakan dalam aplikasi yang lebih lama, dan bahkan aplikasi yang lebih baru karena banyak pengembang merasa lebih nyaman menggunakan jQuery.
Perpustakaan baru seperti Bling.js bahkan memungkinkan Anda untuk menggunakan sintaks jQuery tanpa memuat seluruh perpustakaan jQuery, menunjukkan kesukaan banyak pengembang untuk menulis jQuery.
Meskipun Anda mungkin harus menggunakan JavaScript, jika Anda tahu bahwa kerugian kinerja relatif tidak akan membuat banyak perbedaan bagi pengguna akhir target Anda, kemudian menggunakan jQuery karena Anda tahu Anda dapat berkembang lebih cepat dan lebih mudah daripada menggunakan vanilla JavaScript masuk akal.
Jadi, sementara Anda mungkin harus belajar bagaimana menggunakan JavaScript vanilla untuk Manipulasi DOM, jika Anda akan bekerja dengan orang lain, memahami jQuery Metode manipulasi DOM hampir pasti akan terbukti berguna di beberapa titik.
Efek dan Animasi
jQuery mencakup pustaka efek, termasuk metode sakelar yang diperlihatkan dalam perbandingan kode perbedaan jQuery dan Javascript awal dalam artikel ini. Metode beralih adalah contoh bagus dari fungsionalitas yang lebih mudah dicapai menggunakan jQuery daripada menggunakan JavaScript.
Namun saat ini, pengembang memiliki akses ke API Animasi Web bersama dengan Transisi CSS. Kedua teknologi ini adalah asli browser, artinya browser web Anda memahaminya tanpa perlu memuat pustaka, dan mereka akan melakukan lebih cepat daripada harus memuat animasi dari pustaka jQuery.
jQuery akan menjadi metode yang lebih sederhana dalam mengimplementasikan animasi dalam beberapa kasus, tetapi saat ini cukup terbatas dibandingkan dengan berbagai opsi yang dimiliki pengembang yang asli pada peramban.
- Mudah digunakan
- Menawarkan konten berkualitas
- Harga transparan
- Gratis sertifikat penyelesaian
- Fokus pada keahlian data science
- Waktu belajar yang fleksibel
- Desain yang sederhana (tidak ada informasi yang tidak perlu)
- Kursus-kursus berkualitas tinggi (bahkan untuk kategori yang gratis)
- Terdapat berbagai fitur khusus
- Program Nanodegree
- Cocok untuk perusahaan/firma
- Sertifikat kelulusan berbayar
- Cukup terkemuka di pasaran
- Tersedia beragam fitur
- Kursus setingkat universitas
- Kursus setingkat universitas
- Cocok untuk kalangan korporasi
- Sertifikat kelulusan berbayar
APIs
Kasus penggunaan lain yang sangat baik untuk jQuery di masa lalu adalah kemampuannya untuk melakukan panggilan API. Untuk memanggil API berarti menarik data ke situs web Anda dari sumber eksternal, misalnya, Anda mungkin ingin menampilkan peta khusus di situs Anda sehingga Anda menggunakan API untuk mendapatkan data Google Map dari Google.
Metode memanggil API jQuery secara luas lebih disukai daripada metode XML asli, tetapi sekali lagi, seperti dengan kasus penggunaan lainnya, sekarang ada metode unggul yang dikenal sebagai Ambil, yang asli ke browser, dan bisa dibilang ramah pengguna seperti jQuery.
Apakah kamu tahu?
Pernahkah Anda bertanya-tanya situs belajar online mana yang terbaik untuk pengembangan karier Anda?
Kesimpulan
Terkadang teknologi yang paling berguna bukanlah yang mulai belajar. Pengembangan itu sulit, dan mempelajari bahasa yang terlalu sulit di awal jalur belajar Anda mungkin cukup untuk membuat Anda sepenuhnya menjauh.
JavaScript adalah alat yang ampuh, tetapi tidak satu pun yang dapat Anda pegang dalam hitungan hari atau bahkan berminggu-minggu. Bahkan pengembang JavaScript yang berpengalaman masih sering merasa kesal dengan perilakunya.
Sebagai pendatang baru dalam pemrograman dan pengembangan web, Anda tidak akan bisa berbuat banyak dengan keterampilan JavaScript pemula Anda dalam beberapa minggu. Tetapi jika Anda sudah tahu HTML dan CSS, jQuery dapat membawa proyek Anda ke tingkat lain hanya dalam beberapa hari.
Banyak pengembang web pertama kali masuk ke pengembangan web dengan mempelajari jQuery. Meskipun mempelajari dasar-dasar JavaScript mungkin merupakan bagian terpenting untuk menjadi Pengembang Front-End yang baik, penting juga untuk mendapatkan beberapa kemenangan cepat dalam pendidikan Anda, dan jQuery adalah cara yang lebih cepat untuk mencapainya.
Ketika Anda melihat proyek Anda menjadi hidup dengan jQuery, Anda akan termotivasi untuk belajar lebih banyak; dengan JavaScript, mungkin perlu belajar lebih banyak minggu dan lebih banyak kesalahan sebelum Anda melihat hasil yang sama.
Dengan mempelajari jQuery, Anda juga akan mulai memahami kekuatan JavaScript. Anda akan dapat melakukan banyak tugas umum yang memerlukan pengembang JavaScript, tetapi dengan mendorong batas-batas apa yang dapat Anda capai dengan jQuery, Anda juga akan belajar berapa banyak lagi yang dapat Anda lakukan dengan JavaScript.