Should you use or learn jQuery in 2020?

لاستخدام أو عدم استخدام؟ أن تتعلم أو لا تتعلم؟ دعونا نرى كيف يمكنك تجنب jQuery تمامًا ، والأسباب التي يجب أن تستمر في استخدامها

مهما كانت تفضيلاتك من حيث أطر عمل JavaScript والمكتبات ، فقد لعب jQuery دورًا كبيرًا في نظام JavaScript البيئي.

لقد كانت أكثر شيوعًا منذ بضع سنوات ، والآن حلت المتصفحات الحديثة محل بعض احتياجات jQuery (لحسن الحظ!) ، لكن مكتبة JavaScript هذه لا تزال مستخدمة من قبلكثيرامن الناس. من العامة.

لماذا أصبح jQuery مشهورًا جدًا في المقام الأول؟ أولاً ، وُلد jQuery في عالم لم تكن فيه تطبيقات JavaScript شيئًا. في أوائل منتصف العقد الأول من القرن الحادي والعشرين ، تم استخدام JavaScript بشكل أساسي لتشغيل عروض الشرائح والأدوات الأخرى التي تظهر داخل الصفحة ، مثل معارض الصور ومنتقي التاريخ وما إلى ذلك. لم تكن قوية بما يكفي للقيام بالكثير من الأشياء دون أن تكون بطيئة للغاية (كانت أجهزة الكمبيوتر أبطأ أيضًا بالطبع)

وتجدر الإشارة إلى أن jQuery لم تكن المكتبة الوحيدة أو الأولى. كانت البرامج الأخرى شائعة جدًا في ذلك الوقت ، مثل Mootools و YUI و Dojo Toolkit و Scriptaculous و Prototype. ربما أصبح jQuery أشهر هؤلاء لاحقًا.

واجهت المتصفحات في ذلك الوقت الكثير من مشكلات التشغيل البيني. كان لدينا الكثير من المراوغات عبر المستعرضات ومشكلات التقييس ، وساعدنا jQuery من خلال إنشاء طبقة تجريد والعناية بجميع الحلول.

أتاح لك jQuery تحديد عناصر DOM باستخدام صيغة محددات CSS ، وكان سهل الاستخدام للغاية وسهل التوسيع. جعلت الرسوم المتحركة جافا سكريبت بسيطة.

لقد ساعد أيضًا في تبسيط العمل مع AJAX (والاختلافات عبر المستعرضات) في وقت كان فيه هذا المصطلح شائعًا للغاية ، وهذا أيضًا أعطى jQuery دفعة جيدة من حيث الشعبية.

اليوم ، ليس لدينا الكثير من مشكلات توافق المتصفح ، ومحددات APIوأحضرموحد للمتصفح اثنين من أفضل ميزات jQuery.

jQuery هو بالتأكيد موضوع مليء بالنقاش. يقول بعض الناس أن jQuery من مخلفات الماضي ، ولا يزال البعض يستخدمها يومًا بعد يوم. يقضي بعض الناس وقتهم في الكتابة عنهالماذا لا نحتاج jQuery.

من المؤكد أنه انخفض في الاستخدام في السنوات القليلة الماضية:

jQuery trends

اليوم تغير منظر جافا سكريبت بشكل كبير. ومع ذلك ، لا يزال من المفيد معرفة ما يمكن أن يقدمه لك jQuery.

الأشياء التي استخدمناها jQuery لذلك لديها الآن واجهة برمجة تطبيقات موحدة للمتصفح

اختيار عناصر DOM

طريقة jQuery:

$('.button')

يمكننا الآن استخدام واجهة برمجة تطبيقات المحددات:

document.querySelector('.button')

إذا كان لديك المزيد من العناصر:

document.querySelectorAll('.button')

انتظر حتى يتم تحميل DOM

طريقة jQuery:

$(document).ready(() => {
	 //...
})

طريقة DOM:

document.addEventListener("DOMContentLoaded", () => {
  //...
})

إضافة أو إزالة الفئات من عنصر DOM

طريقة jQuery:

el.addClass('big')
el.removeClass('big')
el.toggleClass('big')

طريقة DOM:

el.classList.add('big')
el.classList.remove('big')
el.classList.toggle('big')

إزالة عنصر من DOM

طريقة jQuery:

el.remove()

طريقة DOM:

el.remove()

(صحيح ، بدون تغيير)

قم بتغيير محتوى عنصر في DOM

طريقة jQuery:

el.text('Hello')
el.html('Hello')
el.text()
el.html()

طريقة DOM:

el.innerHTML = 'Hello'
el.textContent = 'Hello'
el.innerHTML
el.textContent

اختيار العنصر الأصل في DOM

طريقة jQuery:

el.parent()

طريقة DOM:

el.parentNode

الاستماع للأحداث على عناصر DOM

طريقة jQuery:

el.on('click', (e) => { /* ... */ })

طريقة DOM:

el.addEventListener('click', (e) => { /* ... */ })

طلبات AJAX

طريقة jQuery:

$.ajax({
  url: '/api.json',
  type: 'GET'
  success: (data) => {
    console.log(data)
  }
})

طريقة JS الحديثة:

fetch('/api.json')
  .then(response => response.text())
  .then(body => console.log(body))

الرسوم المتحركة

يمكن الآن عمل الرسوم المتحركة لـ jQuery في المتصفح باستخدام CSS Transitions أو CSS Animations.

المراوغات المتصفح

انقل شفرتك باستخدام Babel ، أو استخدم polyfills معينًا (polyfill.io)

هل يجب عليك استخدام jQuery اليوم؟

دعنا نجيب على السؤال الذي تطرحه هذه المقالة في عنوانها. إذا كنت لا تعرف jQuery بالفعل ، فهل يستحق التعلم الآن؟

في رأيي ، لا ينبغي استخدام jQuery بعد الآن في المشاريع الجديدة التي تستهدف المتصفحات الحديثة فقط ، وبالطبع إذا كان مشروعك يعتمد عليه لسبب معين ، أو لمجرد أنك تستخدم المكونات الإضافية أو التعليمات البرمجية الأخرى التي تحتاج إلى jQuery ، فاستمر بالتأكيد في استخدامه .

تعتمد بعض المكتبات أيضًا على jQuery ، مثل Bootstrap. يمكنك أيضًا شراء القوالب الجاهزة التي تستخدمها فقط والمكونات الإضافية الخاصة بها.

ربما تعمل في فريق ليس فيه مطورو الواجهة الأمامية كلهم معالجات جافا سكريبت وهم معتادون على jQuery أكثر من المعايير الأحدث. إذا أنجز هذا المهمة ، فهذا رائع.

قد لا تتمتع أيضًا برفاهية استخدام أحدث التقنيات الرائعة (مثل React أو Vue) لأنك مطالب بدعم المتصفحات القديمة ، التي لديها مجموعة أقدم من المعايير. في هذه الحالة ، لا يزال jQuery مناسبًا لك بشكل كبير.


المزيد من دروس js: