Mahdyar's Blog

My Thoughts

تفاوت جاوااسکریپت و جی‌کوئری در چیه؟

تفاوت جاوااسکریپت و جی‌کوئری

تو این مطلب، می‌خوام بهتون توضیح بدم تفاوت جاوااسکریپت و جی‌کوئری در چیه. اگر در کد زدن مبتدی هستید، این مطلب برای شما آماده شده. چون قراره به صورت ساده براتون بگم.

تصور کنید ما قراره یک وبسایت داشته باشیم که «خداحافظ» رو نشون بده. اسم کلاس‌‌ش رو هم می‌ذاریم goodbye.

تفاوت جاوااسکریپت و جی‌کوئری

یکی از بهترین راه‌ها برای فهمیدن تفاوت جاوااسکریپت و جی‌کوئری، دیدن شیوهٔ انجام یک کار واحد در هردوتاشونه.

فرض کنید ما می‌خوایم یک کلاس رو به همهٔ المنت‌هایی که کلاس goodbye رو دارن اضافه کنیم، نسخهٔ جاوااسکریپتی اون این‌طوری می‌شه:

var goodbye = document.getElementsByClassName("goodbye"); 
var i; 
for (i = 0; i < d.length; i++) {
   goodbye[i].className = goodbye[i].className + " selected"; 
}

اگر تازه با کدنویسی آشنا شده باشید، احتمالاً هیچی از این ۵ خط متوجه نمی‌شید. برای اضافه کردن یک کلاس ۵ خط کد لازمه واقعاً؟

در خط اول، اومدم همهٔ المنت‌هایی که کلاس goodbye دارن رو گرفتم، یک حلقه درست کردم که توی آرایهٔ‌ای که در خط اول گرفتم، بره جلو و دونه‌دونه به هر المنت کلاس فعلی رو به علاوهٔ کلاس selected به عنوان مقدار کلاس اون المنت تعریف کنه.

این توی جی‌کوئری می‌شد این یک خط:

$(".goodbye").addClass("selected");

همین‌طور که می‌بینید، یک خط هست که می‌گه کلاس goodbye رو انتخاب کن، و کلاس selected رو بهش اضافه کن. به همین سادگی!

جی‌کوئری برای جلوگیری از انجام تکراری کارها ساخته شده، یک گروه برنامه‌نویس دور هم جمع شدن و گفتن خب چرا ما هربار که بخوایم یک کلاس اضافه کنیم باید ۵ خط بنویسیم؟ جی‌کوئری رو نوشتن و باعث شدن زندگی برای همهٔ ما ساده‌تر بشه.

استفاده از جی‌کوئری

چی‌جوری جی‌کوئری رو لود کنیم توی صفحه‌مون؟ به سادگی:

<script src="https://code.jquery.com/jquery-3.4.1.js"   integrity="sha256-WpOohJOqMqqyKL9FccASB9O0KwACQJpFTUBLTYOVvVU="   crossorigin="anonymous"></script>

یک‌جورایی شبیه ماتریکسه! وقتی نئو اطلاعات رو آپلود کرد توی مغزش و وقتی بیدار شد گفت «کونگ‌فو بلدم!».

با این یک خط کد، که باید قبل از کد شما لود بشه، می‌تونید بنویسید addClass و جاوااسکریپت اون رو بفهمه.

چکیده

  • جی‌کوئری یک کتاب‌خونه‌ست که کمک‌تون می‌کنه آسون‌تر و سریع‌تر بنویسید.
  • جی‌کوئری باعث می‌شه تعداد خط کدهاتون کم‌تر بشه.
  • با جی‌کوئری تقریباً می‌تونید هرکاری رو که توی جاوااسکریپت می‌شه رو انجام بدید.
  • برای شروع یادگیری جی‌کوئری، یه سری به jquery.com بزنید.

این مطلب، ترجمه‌ای بود کم و زیاد شده توسط مهدیار، از این لینک: learn.onemonth.com/jquery-vs-javascript