الـDestructuring في JavaScript

الـDestructuring في JavaScript فكرته بسيطة جدًا: يخليك تختصر وتوضح الكود بدل ما تكتب أسطر طويلة عشان توصل لقيمة من Array أو Object، يعني بدل ما تعيد وتكرر .name و .age كل شوي، تقدر تستخرج القيم مرة واحدة وتحطها في متغيرات. الميزة الحلوة إنه مو بس يختصر الكود، كمان يخليك تتعامل مع بيانات متداخلة بسهولة، وتقدر تحط قيم افتراضية لها إذا ما تم العثور على بعض القيم لسبب ما، وهذا مهم خصوصًا لو البيانات جاية من API أو مصدر خارجي، عشان ما يحصل أخطاء غير متوقعة. بالمختصر: الكود يصير أنظف، أسهل، وآمن.

من ناحية تأثيره على الاداء فلا يوجد اي تأثير بين

الطريقة المعتادة:

const numbers = [1, 2, 3];
const first = numbers[0];

const person = {
  name: 'yazn',
  age: 20
};
const name = person.name;

وطريقة الـDestructuring:

const [a, b, c] = [1, 2, 3];
console.log(a); // 1
console.log(b); // 2
console.log(c); // 3

const person = {
  name: 'yazn',
  age: 20
};
const { name = 'الاسم الافتراضي', age } = person;
console.log(name); // Yazan
console.log(age);  // 22

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