جافا سكريبت: 7 أشياء صغيرة مفيدة

يقول مؤلف المذكرة ، الذي ننشره اليوم ، أنه في JavaScript ، كما هو الحال في أي لغة برمجة أخرى ، يمكنك أن تجد العديد من الحيل الصغيرة المصممة لحل مجموعة متنوعة من المشاكل ، بسيطة ومعقدة للغاية. بعض هذه التقنيات معروفة على نطاق واسع ، في حين أن البعض الآخر ، غير الشائع ، قد يفاجئ أولئك الذين لا يعرفون عنها. الآن سوف نلقي نظرة على 7 تقنيات برمجة جافا سكريبت مفيدة.

1. الحصول على قيم مجموعة فريدة من نوعها

في JavaScript ، قد يكون إنشاء صفيف يحتوي على قيم فريدة فقط من صفيف آخر أسهل مما تعتقد:

var j = [...new Set([1, 2, 3, 3])] // [1, 2, 3] 

يعجبني الطريقة التي يمكن بها حل هذه المشكلة عن طريق استخدام عامل التشغيل ... ونوع البيانات المعين.

2. المصفوفات والقيم المنطقية

هل سبق لك أن تحتاج إلى إزالة القيم من صفيف تحويله إلى نوع منطقي يعطي false ؟ على سبيل المثال ، هذه هي القيم مثل 0 ، undefined ، null ، false . ربما لم تكن تعلم أنه من أجل القيام بذلك ، يمكنك القيام بذلك:

 myArray   .map(item => {       // ...   })   //       .filter(Boolean); 

كما ترون ، للتخلص من كل هذه القيم ، ما عليك سوى تمرير Boolean إلى طريقة الصفيف .filter() .

3. خلق كائنات فارغة حقا

أنا متأكد من أنه يمكنك إنشاء كائن يبدو فارغًا باستخدام بناء جملة الكائن الحرفي: {} . ولكن سيتم تعيين نموذج أولي ( __proto__ ) لمثل هذا الكائن ، وسيكون له طريقة hasOwnProperty() وطرق كائن أخرى. لإنشاء كائن فارغ حقًا ، والذي ، على سبيل المثال ، يمكن استخدامه كـ "قاموس" ، يمكنك القيام بذلك:

 let dict = Object.create(null); // dict.__proto__ === "undefined" //        ,           

لا يحتوي الكائن الذي تم إنشاؤه بهذه الطريقة على الخصائص والأساليب التي لم تتم إضافتها إليها بواسطة المبرمج.

4. دمج الكائنات

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

 const person = { name: 'David Walsh', gender: 'Male' }; const tools = { computer: 'Mac', editor: 'Atom' }; const attributes = { handsomeness: 'Extreme', hair: 'Brown', eyes: 'Blue' }; const summary = {...person, ...tools, ...attributes}; /* Object { "computer": "Mac", "editor": "Atom", "eyes": "Blue", "gender": "Male", "hair": "Brown", "handsomeness": "Extreme", "name": "David Walsh", } */ 

المشغل ... يبسط إلى حد كبير حل مهمة دمج الكائنات.

5. المعلمات وظيفة المطلوبة

يعد تعيين قيم وسيطة الوظيفة الافتراضية امتدادًا رائعًا لجافا سكريبت. ولكن فيما يلي كيفية القيام بذلك ، ومن دون تمرير بعض المعلمات المطلوبة ، فإن الوظائف سترفض العمل ببساطة:

 const isRequired = () => { throw new Error('param is required'); }; const hello = (name = isRequired()) => { console.log(`hello ${name}`) }; //    ,     name hello(); //     hello(undefined); //        hello(null); hello('David'); 

أمامنا هو مستوى إضافي للتحقق من ما يتم نقله إلى وظائف.

6. المهمة المدمرة والأسماء الجديدة للخصائص المستخرجة من الكائنات

Destructuring هي ميزة JavaScript مفيدة جديدة ، ولكن في بعض الأحيان تحتاج الخصائص التي يتم استردادها من الكائنات إلى تعيين أسماء مختلفة عن تلك الموجودة في تلك الكائنات. إليك كيفية القيام بذلك:

 const obj = { x: 1 }; //      obj.x   x const { x } = obj; //   obj.x     otherName const { x: otherName } = obj; 

هذه التقنية مفيدة في الحالات التي تحتاج فيها إلى تجنب تعارض أسماء أو ثوابت متغيرة.

7. تحليل سلاسل الاستعلام

لسنوات عديدة ، لقد كتبنا تعبيرات منتظمة لتحليل سلاسل الاستعلام ، ولكن هذه الأوقات قد مرت. الآن ، لحل هذه المشكلة ، يمكنك استخدام واجهة برمجة تطبيقات URL URLSearchParams الرائعة:

 // ,     "?post=1234&action=edit" var urlParams = new URLSearchParams(window.location.search); console.log(urlParams.has('post')); // true console.log(urlParams.get('action')); // "edit" console.log(urlParams.getAll('action')); // ["edit"] console.log(urlParams.toString()); // "?post=1234&action=edit" console.log(urlParams.append('active', '1')); // "?post=1234&action=edit&active=1" 

يعد استخدام واجهة برمجة تطبيقات URLSearchParams أسهل بكثير من حل نفس المهام باستخدام التعبيرات العادية.

النتائج

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

أعزائي القراء! هل تعرف أي حيل البرمجة JS مفيدة؟ إذا كان الأمر كذلك ، يرجى مشاركتها.