10 وظائف مهمة لوداش لمطوري جافا سكريبت

نشرت: 2021-10-05

لمطوري JavaScript ، لا يحتاج Lodash إلى مقدمة. ومع ذلك ، فإن المكتبة شاسعة وغالبًا ما تكون ساحقة. ليس بعد الآن!

لوداش ، لوداش ، لوداش. . . من أين أبدأ!

كان هناك وقت كان فيه نظام JavaScript البيئي ناشئًا ؛ يمكن مقارنتها بالغرب المتوحش أو الغابة إذا صح التعبير ، حيث كان يحدث الكثير ، ولكن كانت هناك إجابات قليلة جدًا لإحباطات المطورين اليومية والإنتاجية.

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

مرحبًا يا لوداش!

وأين هو لداش اليوم؟ حسنًا ، لا يزال يحتوي على كل الأشياء الجيدة التي قدمها في البداية ، ثم بعضها ، ولكن يبدو أنه فقد مشاركة ذهنية في مجتمع JavaScript. لماذا ا؟ يمكنني التفكير في بعض الأسباب:

  • كانت بعض الوظائف في مكتبة Lodash (ولا تزال) بطيئة عند تطبيقها على القوائم الكبيرة. في حين أن هذا لن يؤثر أبدًا على 95٪ من المشاريع الموجودة هناك ، إلا أن المطورين المؤثرين من الـ 5٪ المتبقية منحوا لوداش الصحافة السيئة وتراجع التأثير إلى القاعدة الشعبية.
  • هناك اتجاه في نظام JS البيئي (قد يقول نفس الشيء عن أهل Golang) حيث تكون الغطرسة أكثر شيوعًا من اللازم. لذلك ، يُنظر إلى الاعتماد على شيء مثل Lodash على أنه غبي ويتم إسقاطه في منتديات مثل StackOverflow عندما يقترح الأشخاص مثل هذه الحلول ("ماذا؟! استخدم مكتبة كاملة لشيء مثل هذا؟ يمكنني الجمع بين filter() مع reduce() لتحقيق نفس الشيء في وظيفة بسيطة! ").
  • لوداش قديم. على الأقل بمعايير JS. تم إصداره في عام 2012 ، وحتى كتابة هذا التقرير ، فقد مر ما يقرب من عشر سنوات. لقد كانت API مستقرة ، ولا يمكن إضافة الكثير من الأشياء المثيرة كل عام (ببساطة لأنه ليس هناك حاجة لذلك) ، مما يولد الملل لمطور JS العادي.

في رأيي ، يعد عدم استخدام Lodash خسارة كبيرة لقواعد أكواد JavaScript الخاصة بنا. لقد أثبتت أنها خالية من الأخطاء وحلول أنيقة للمشكلات اليومية التي نواجهها في العمل ، واستخدامها سيجعل الكود الخاص بنا أكثر قابلية للقراءة والصيانة.

مع ذلك ، دعنا نتعمق في بعض وظائف Lodash الشائعة (أو لا!) ونرى مدى فائدة هذه المكتبة وجمالها بشكل لا يصدق.

استنساخ. . . بشدة!

نظرًا لأن الكائنات يتم تمريرها عن طريق المرجع في JavaScript ، فإنها تخلق صداعًا للمطورين عند الرغبة في استنساخ شيء ما على أمل أن تكون مجموعة البيانات الجديدة مختلفة.

 let people = [ { name: 'Arnold', specialization: 'C++', }, { name: 'Phil', specialization: 'Python', }, { name: 'Percy', specialization: 'JS', }, ]; // Find people writing in C++ let folksDoingCpp = people.filter((person) => person.specialization == 'C++'); // Convert them to JS! for (person of folksDoingCpp) { person.specialization = 'JS'; } console.log(folksDoingCpp); // [ { name: 'Arnold', specialization: 'JS' } ] console.log(people); /* [ { name: 'Arnold', specialization: 'JS' }, { name: 'Phil', specialization: 'Python' }, { name: 'Percy', specialization: 'JS' } ] */

لاحظ كيف أنه في براءتنا المطلقة وعلى الرغم من نوايانا الحسنة ، تغيرت مجموعة people الأصليين في هذه العملية (تغير تخصص أرنولد من C++ إلى JS ) - ضربة كبيرة لسلامة نظام البرنامج الأساسي! في الواقع ، نحن بحاجة إلى طريقة لعمل نسخة حقيقية (عميقة) من المصفوفة الأصلية.

مرحبا ديف ، قابل ديف!

ربما يمكنك المجادلة بأن هذه طريقة "سخيفة" للترميز في JS ؛ ومع ذلك ، فإن الواقع معقد بعض الشيء. نعم ، لدينا مشغل التدمير الجميل المتاح ، لكن أي شخص حاول تدمير العناصر والمصفوفات المعقدة يعرف الألم. بعد ذلك ، هناك فكرة استخدام التسلسل وإلغاء التسلسل (ربما JSON) لتحقيق النسخ العميق ، ولكنه يجعل الكود الخاص بك أكثر فوضى للقارئ.

على النقيض من ذلك ، انظر إلى مدى الأناقة والموجز بشكل مذهل هو الحل عند استخدام Lodash:

 const _ = require('lodash'); let people = [ { name: 'Arnold', specialization: 'C++', }, { name: 'Phil', specialization: 'Python', }, { name: 'Percy', specialization: 'JS', }, ]; let peopleCopy = _.cloneDeep(people); // Find people writing in C++ let folksDoingCpp = peopleCopy.filter( (person) => person.specialization == 'C++' ); // Convert them to JS! for (person of folksDoingCpp) { person.specialization = 'JS'; } console.log(folksDoingCpp); // [ { name: 'Arnold', specialization: 'JS' } ] console.log(people); /* [ { name: 'Arnold', specialization: 'C++' }, { name: 'Phil', specialization: 'Python' }, { name: 'Percy', specialization: 'JS' } ] */

لاحظ كيف أن مصفوفة people لم تمس بعد الاستنساخ العميق (لا يزال Arnold متخصصًا في C++ في هذه الحالة). ولكن الأهم من ذلك ، أن الكود سهل الفهم.

إزالة التكرارات من مجموعة

تبدو إزالة التكرارات من المصفوفة كمشكلة ممتازة للمقابلة / السبورة (تذكر ، عندما تكون في شك ، قم بإلقاء التجزئة على المشكلة!). وبالطبع ، يمكنك دائمًا كتابة دالة مخصصة للقيام بذلك ، ولكن ماذا لو واجهت عدة سيناريوهات مختلفة تجعل مصفوفاتك فريدة؟ يمكنك كتابة العديد من الوظائف الأخرى لذلك (والمخاطرة بالوقوع في أخطاء خفية) ، أو يمكنك فقط استخدام Lodash!

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

 const _ = require('lodash'); const userIds = [12, 13, 14, 12, 5, 34, 11, 12]; const uniqueUserIds = _.uniq(userIds); console.log(uniqueUserIds); // [ 12, 13, 14, 5, 34, 11 ]

لاحظ أن المصفوفة النهائية لم يتم فرزها ، وهذا بالطبع ليس مصدر قلق هنا. لكن الآن ، دعنا نتخيل سيناريو أكثر تعقيدًا: لدينا مجموعة من المستخدمين قمنا بسحبهم من مكان ما ، لكننا نريد التأكد من احتوائه على مستخدمين فريدين فقط. سهل مع Lodash!

 const _ = require('lodash'); const users = [ { id: 10, name: 'Phil', age: 32 }, { id: 8, name: 'Jason', age: 44 }, { id: 11, name: 'Rye', age: 28 }, { id: 10, name: 'Phil', age: 32 }, ]; const uniqueUsers = _.uniqBy(users, 'id'); console.log(uniqueUsers); /* [ { id: 10, name: 'Phil', age: 32 }, { id: 8, name: 'Jason', age: 44 }, { id: 11, name: 'Rye', age: 28 } ] */

في هذا المثال ، استخدمنا طريقة uniqBy() لإخبار Lodash بأننا نريد أن تكون الكائنات فريدة في خاصية id . في سطر واحد ، عبرنا عما يمكن أن يكون قد اتخذ من 10 إلى 20 سطرًا وقدمنا ​​مجالًا أكبر للأخطاء!

هناك الكثير من الأشياء المتوفرة حول جعل الأشياء فريدة في لوداش ، وأنا أشجعك على إلقاء نظرة على المستندات.

الفرق بين مصفوفتين

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

مرحبًا ، أ. إلى اللقاء ، ب!

لنبدأ رحلة الاختلاف باتباع سيناريو بسيط: لقد تلقيت قائمة بجميع هويات المستخدمين في النظام ، بالإضافة إلى قائمة بأولئك الذين تكون حساباتهم نشطة. كيف تجد هويات غير نشطة؟ بسيط ، أليس كذلك؟

 const _ = require('lodash'); const allUserIds = [1, 3, 4, 2, 10, 22, 11, 8]; const activeUserIds = [1, 4, 22, 11, 8]; const inactiveUserIds = _.difference(allUserIds, activeUserIds); console.log(inactiveUserIds); // [ 3, 2, 10 ]

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

 const allUsers = [ { id: 1, name: 'Phil' }, { id: 2, name: 'John' }, { id: 3, name: 'Rogg' }, ]; const activeUsers = [ { id: 1, name: 'Phil' }, { id: 2, name: 'John' }, ]; const inactiveUsers = _.differenceBy(allUsers, activeUsers, 'id'); console.log(inactiveUsers); // [ { id: 3, name: 'Rogg' } ]

أنيق أليس كذلك ؟!

مثل الاختلاف ، هناك طرق أخرى في Lodash لعمليات المجموعة المشتركة: الاتحاد ، التقاطع ، إلخ.

صفائف التسطيح

تظهر الحاجة إلى تسطيح المصفوفات في كثير من الأحيان. إحدى حالات الاستخدام هي أنك تلقيت استجابة API وتحتاج إلى تطبيق مجموعة من map() filter() على قائمة معقدة من الكائنات / المصفوفات المتداخلة لاستخراج ، على سبيل المثال ، معرفات المستخدم ، والآن يتبقى لك صفائف المصفوفات. إليك مقتطف رمز يوضح هذا الموقف:

 const orderData = { internal: [ { userId: 1, date: '2021-09-09', amount: 230.0, type: 'prepaid' }, { userId: 2, date: '2021-07-07', amount: 130.0, type: 'prepaid' }, ], external: [ { userId: 3, date: '2021-08-08', amount: 30.0, type: 'postpaid' }, { userId: 4, date: '2021-06-06', amount: 330.0, type: 'postpaid' }, ], }; // find user ids that placed postpaid orders (internal or external) const postpaidUserIds = []; for (const [orderType, orders] of Object.entries(orderData)) { postpaidUserIds.push(orders.filter((order) => order.type === 'postpaid')); } console.log(postpaidUserIds);

هل يمكنك تخمين كيف تبدو postPaidUserIds الآن؟ تلميح: إنه مقرف!

 [ [], [ { userId: 3, date: '2021-08-08', amount: 30, type: 'postpaid' }, { userId: 4, date: '2021-06-06', amount: 330, type: 'postpaid' } ] ]

الآن ، إذا كنت شخصًا عاقلًا ، فأنت لا تريد كتابة منطق مخصص لاستخراج كائنات الترتيب ووضعها بشكل جيد في صف داخل مصفوفة. فقط استخدم طريقة flatten() واستمتع بالعنب:

 const flatUserIds = _.flatten(postpaidUserIds); console.log(flatUserIds); /* [ { userId: 3, date: '2021-08-08', amount: 30, type: 'postpaid' }, { userId: 4, date: '2021-06-06', amount: 330, type: 'postpaid' } ] */

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

هل الكائن / المصفوفة فارغة؟

بفضل كيفية عمل القيم والأنواع "الزائفة" في JavaScript ، أحيانًا ما ينتج عن شيء بسيط مثل التحقق من الفراغ رعبًا وجوديًا.

كيف تتحقق مما إذا كانت المصفوفة فارغة؟ يمكنك التحقق مما إذا كان length 0 أم لا. الآن ، كيف تتحقق مما إذا كان الكائن فارغًا؟ حسنًا ... انتظر لحظة! هذا هو المكان الذي يظهر فيه هذا الشعور المزعج ، وتلك أمثلة جافا سكريبت التي تحتوي على أشياء مثل [] == false و {} == false تبدأ في الدوران حول رؤوسنا. عندما تكون تحت الضغط لتقديم ميزة ما ، فإن الألغام الأرضية مثل هذه هي آخر شيء تحتاجه - ستجعل من الصعب فهم شفرتك ، وستؤدي إلى عدم اليقين في مجموعة الاختبار الخاصة بك.

العمل مع البيانات المفقودة

في العالم الحقيقي ، البيانات تستمع إلينا ؛ بغض النظر عن مدى رغبتنا في ذلك ، نادرًا ما يكون مبسطًا وعقلانيًا. أحد الأمثلة النموذجية هو عدم وجود كائنات / مصفوفات فارغة في بنية بيانات كبيرة تم تلقيها كاستجابة لواجهة برمجة التطبيقات.

لنفترض أننا تلقينا الكائن التالي كاستجابة من واجهة برمجة التطبيقات:

 const apiResponse = { id: 33467, paymentRefernce: 'AEE3356T68', // `order` object missing processedAt: `2021-10-10 00:00:00`, };

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

 if ( apiResponse.order && apiResponse.order.payee && apiResponse.order.payee.address ) { console.log( 'The order was sent to the zip code: ' + apiResponse.order.payee.address.zipCode ); }

نعم ، الكتابة قبيحة جدًا ، وقبيحة جدًا للقراءة ، وقبيحة جدًا للمحافظة عليها ، وما إلى ذلك. لحسن الحظ ، لدى Lodash طريقة مباشرة للتعامل مع مثل هذه المواقف.

 const zipCode = _.get(apiResponse, 'order.payee.address.zipCode'); console.log('The order was sent to the zip code: ' + zipCode); // The order was sent to the zip code: undefined

هناك أيضًا خيار رائع لتقديم قيمة افتراضية بدلاً من الحصول على undefined للأشياء المفقودة:

 const zipCode2 = _.get(apiResponse, 'order.payee.address.zipCode', 'NA'); console.log('The order was sent to the zip code: ' + zipCode2); // The order was sent to the zip code: NA

لا أعرف عنك ، لكن get() هو أحد تلك الأشياء التي تجلب دموع السعادة لعيني. إنه ليس شيئًا مبهرجًا. لا توجد صيغة مرجعية أو خيارات للحفظ ، لكن انظر إلى مقدار المعاناة الجماعية التي يمكن أن تخففها!

شجب

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

تخيل موقعًا للتجارة الإلكترونية يحتوي على شريط بحث (حسنًا ، أي موقع ويب / تطبيق ويب هذه الأيام!). للحصول على تجربة مستخدم أفضل ، لا نريد أن يضطر المستخدم إلى الضغط على مفتاح الإدخال (أو ما هو أسوأ من ذلك ، الضغط على زر "بحث") لإظهار الاقتراحات / المعاينات بناءً على مصطلح البحث الخاص به. لكن الإجابة الواضحة محملة قليلاً: إذا أضفنا مستمعًا للحدث إلى onChange() لشريط البحث وأطلقنا استدعاء API لكل ضغطة مفتاح ، فسنكون قد خلقنا كابوسًا لخلفيتنا ؛ سيكون هناك الكثير من المكالمات غير الضرورية (على سبيل المثال ، إذا تم البحث عن "فرشاة السجاد الأبيض" ، فسيكون هناك إجمالي 18 طلبًا!) وستكون جميع هذه الطلبات تقريبًا غير ذات صلة لأن إدخال المستخدم لم ينته.

تكمن الإجابة في التنبيه ، والفكرة هي: لا ترسل استدعاء API بمجرد تغيير النص. انتظر بعض الوقت (على سبيل المثال ، 200 مللي ثانية) وإذا كان هناك ضغط آخر على المفتاح بحلول ذلك الوقت ، فقم بإلغاء عدد الوقت السابق وابدأ الانتظار مرة أخرى. نتيجة لذلك ، فقط عندما يتوقف المستخدم مؤقتًا (إما لأنهم يفكرون أو لأنهم انتهوا ويتوقعون بعض الاستجابة) نرسل طلب API إلى الواجهة الخلفية.

الإستراتيجية الشاملة التي وصفتها معقدة ، ولن أغوص في مزامنة إدارة المؤقت وإلغائه ؛ ومع ذلك ، فإن عملية الشطب الفعلية بسيطة للغاية إذا كنت تستخدم Lodash.

 const _ = require('lodash'); const axios = require('axios'); // This is a real dogs' API, by the way! const fetchDogBreeds = () => axios .get('https://dog.ceo/api/breeds/list/all') .then((res) => console.log(res.data)); const debouncedFetchDogBreeds = _.debounce(fetchDogBreeds, 1000); // after one second debouncedFetchDogBreeds(); // shows data after some time

إذا كنت تفكر في setTimeout() كنت سأقوم بنفس المهمة ، حسنًا ، هناك المزيد! يأتي ظهور لوداش مع العديد من الميزات القوية ؛ على سبيل المثال ، قد ترغب في التأكد من أن الارتداد ليس لأجل غير مسمى. أي ، حتى إذا كانت هناك ضغطة مفتاح في كل مرة توشك الوظيفة على إيقاف التشغيل (وبالتالي إلغاء العملية الكلية) ، فقد ترغب في التأكد من إجراء استدعاء واجهة برمجة التطبيقات على أي حال بعد ثانيتين على سبيل المثال. لهذا ، يحتوي Lodash debounce() على خيار maxWait :

 const debouncedFetchDogBreeds = _.debounce(fetchDogBreeds, 150, { maxWait: 2000 }); // debounce for 250ms, but send the API request after 2 seconds anyway

تحقق من المستندات الرسمية للحصول على نظرة أعمق. إنها مليئة بالأشياء فائقة الأهمية!

إزالة القيم من المصفوفة

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

 const greetings = ['hello', 'hi', 'hey', 'wave', 'hi']; _.pull(greetings, 'wave', 'hi'); console.log(greetings); // [ 'hello', 'hey' ]

يرجى ملاحظة شيئين:

  1. تم تغيير المجموعة الأصلية في هذه العملية.
  2. طريقة pull() تزيل كل الحالات ، حتى لو كان هناك تكرارات.

هناك طريقة أخرى ذات صلة تسمى pullAll() تقبل مصفوفة pullAll() ثاني ، مما يسهل إزالة عناصر متعددة مرة واحدة. من المؤكد أنه يمكننا استخدام pull() مع عامل انتشار ، لكن تذكر أن Lodash جاءت في وقت لم يكن فيه عامل الانتشار مجرد اقتراح في اللغة!

 const greetings2 = ['hello', 'hi', 'hey', 'wave', 'hi']; _.pullAll(greetings2, ['wave', 'hi']); console.log(greetings2); // [ 'hello', 'hey' ]

الفهرس الأخير للعنصر

طريقة indexOf() الأصلية لـ JavsScript رائعة ، إلا إذا كنت مهتمًا بمسح المصفوفة من الاتجاه المعاكس! ومرة أخرى ، نعم ، يمكنك فقط كتابة حلقة متناقصة والعثور على العنصر ، ولكن لماذا لا تستخدم أسلوبًا أكثر أناقة؟

إليك حل Lodash سريعًا باستخدام طريقة lastIndexOf() :

 const integers = [2, 4, 1, 6, -1, 10, 3, -1, 7]; const index = _.lastIndexOf(integers, -1); console.log(index); // 7

لسوء الحظ ، لا يوجد بديل لهذه الطريقة حيث يمكننا البحث عن كائنات معقدة أو حتى تمرير وظيفة بحث مخصصة.

أزيز. فك الضغط!

ما لم تكن قد عملت في Python ، فإن zip / unzip هو أداة قد لا تلاحظها أو تتخيلها في حياتك المهنية بأكملها كمطور JavaScript. وربما لسبب وجيه: نادرًا ما يكون هناك نوع من الحاجة الماسة إلى zip / unzip كما هو الحال بالنسبة لـ filter() ، وما إلى ذلك ، ومع ذلك ، فهي واحدة من أفضل الأدوات المساعدة الأقل شهرة ويمكن أن تساعدك في إنشاء رمز موجز في بعض المواقف .

على عكس ما يبدو عليه الأمر ، فإن zip / unzip لا علاقة له بالضغط. بدلاً من ذلك ، إنها عملية تجميع حيث يمكن تحويل المصفوفات التي لها نفس الطول إلى مصفوفة واحدة من المصفوفات مع تجميع عناصر في نفس الموضع معًا ( zip() ) والعودة ( unzip() ). نعم ، أعلم أن الأمر أصبح ضبابيًا عند محاولة الاكتفاء بالكلمات ، لذلك دعونا نلقي نظرة على بعض التعليمات البرمجية:

 const animals = ['duck', 'sheep']; const sizes = ['small', 'large']; const weight = ['less', 'more']; const groupedAnimals = _.zip(animals, sizes, weight); console.log(groupedAnimals); // [ [ 'duck', 'small', 'less' ], [ 'sheep', 'large', 'more' ] ]

تم تحويل المصفوفات الثلاثة الأصلية إلى مصفوفة واحدة بمصفوفتين فقط. وكل من هذه المصفوفات الجديدة تمثل حيوانًا واحدًا بكل ما في مكان واحد. لذا ، يخبرنا الفهرس 0 عن نوع هذا الحيوان ، ويخبرنا الفهرس 1 بحجمه ، ويخبرنا الفهرس 2 بوزنه. نتيجة لذلك ، أصبح التعامل مع البيانات الآن أسهل. بمجرد تطبيق أي عمليات تحتاجها على البيانات ، يمكنك تقسيمها مرة أخرى باستخدام unzip() وإرسالها مرة أخرى إلى المصدر الأصلي:

 const animalData = _.unzip(groupedAnimals); console.log(animalData); // [ [ 'duck', 'sheep' ], [ 'small', 'large' ], [ 'less', 'more' ] ]

إن الأداة المساعدة zip / unzip ليست شيئًا من شأنه أن يغير حياتك بين عشية وضحاها ، ولكنه سيغير حياتك يومًا ما!

استنتاج

(أضع جميع الكود المصدري المستخدم في هذه المقالة هنا لتجربته مباشرة من المتصفح!)

مستندات Lodash مليئة بالأمثلة والوظائف التي ستذهلك تمامًا. في يوم وعصر حيث يبدو أن الماسوشية تتزايد في نظام JS البيئي ، فإن Lodash تشبه نسمة من الهواء النقي ، وأنا أوصي بشدة باستخدام هذه المكتبة في مشاريعك!