تحسين تنفيذ JavaScript Enum لتحسين وظيفة الإكمال التلقائي

تحسين تنفيذ JavaScript Enum للحصول على دعم أفضل للإكمال التلقائي

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

// Approach 1: Object and String-Based Enum with Autocomplete Support
// Modular function for creating an enum with autocomplete support
export function _enum(...arr) {
  return Object.freeze(Object.fromEntries(
    arr.length === 1 && typeof arr[0] === 'object'
      ? Object.entries(arr[0]).flatMap(([a, b]) => [
          [a, b],
          [b, a],
        ])
      : arr
          .map(a => [a, enumItem()])
          .flatMap(([a, b]) => [
            [a, b],
            [b, a],
          ])
  ));
}

// Helper function for creating enum items
function enumItem() {
  return Symbol();
}

// Usage Example 1: Object-based enum
const a = _enum({ foo: 0, bar: 1, baz: 2 });
console.log(a.foo); // 0
console.log(a[1]);  // 'bar'

// Usage Example 2: String-based enum
const b = _enum('foo', 'bar', 'baz');
console.log(b.foo); // Symbol()
console.log(b['baz']); // Symbol()

تنفيذ التعداد باستخدام TypeScript لسلامة النوع ودعم الإكمال التلقائي

يعمل هذا الأسلوب على تعزيز TypeScript لتوفير تعريفات أقوى للنوع وتحسين الإكمال التلقائي في كل من التعدادات القائمة على الكائنات والسلاسل. تضمن ميزة "as const" الخاصة بـ TypeScript عدم التغيير واستدلالًا أفضل للكتابة.

// Approach 2: TypeScript Enum with Type Safety
type Enum<T> = T extends readonly string[]
  ? { [K in T[number]]: number }
  : { [K in keyof T]: number };

// Function to create enums with TypeScript
export function _enum<T>(...arr: T[]): Enum<T> {
  return Object.freeze(Object.fromEntries(
    arr.length === 1 && typeof arr[0] === 'object'
      ? Object.entries(arr[0] as object).flatMap(([a, b]) => [
          [a, b],
          [b, a],
        ])
      : arr.map((a) => [a, Symbol()]).flatMap(([a, b]) => [
          [a, b],
          [b, a],
        ])
  ));
}

// Testing the Enum with an array (as const)
const testArray = ["foo", "bar", "baz"] as const;
type A = Enum<typeof testArray>;

// Testing with an object
const testObj = { foo: 0, bar: 1, baz: 2 };
type B = Enum<typeof testObj>;

تنفيذ تعداد JavaScript من Vanilla مع اختبارات الوحدة

يركز هذا الحل على تنفيذ JavaScript الفانيليا للتعدادات، مصحوبة باختبارات الوحدة للتحقق من صحة الوظائف عبر بيئات مختلفة.

// Approach 3: JavaScript Enum with Unit Testing
export function _enum(...arr) {
  return Object.freeze(Object.fromEntries(
    arr.length === 1 && typeof arr[0] === 'object'
      ? Object.entries(arr[0]).flatMap(([a, b]) => [
          [a, b],
          [b, a],
        ])
      : arr.map(a => [a, Symbol()]).flatMap(([a, b]) => [
          [a, b],
          [b, a],
        ])
  ));
}

// Unit tests for the enum function
function testEnum() {
  const objEnum = _enum({ foo: 0, bar: 1, baz: 2 });
  console.assert(objEnum.foo === 0, 'Test Failed: objEnum.foo !== 0');
  console.assert(objEnum[1] === 'bar', 'Test Failed: objEnum[1] !== bar');

  const strEnum = _enum('foo', 'bar', 'baz');
  console.assert(typeof strEnum.foo === 'symbol', 'Test Failed: strEnum.foo is not Symbol');
}

// Run unit tests
testEnum();

أسئلة شائعة حول تعدادات JavaScript والإكمال التلقائي

1. كيف يمكنني التأكد من أن التعدادات في JavaScript غير قابلة للتغيير؟
2. يمكنك استخدام Object.freeze() طريقة للتأكد من أن التعدادات الخاصة بك غير قابلة للتغيير بمجرد تعريفها.
3. ما هو التعيين ثنائي الاتجاه في التعدادات؟
4. يسمح التعيين ثنائي الاتجاه بالوصول إلى التعدادات من خلال مفاتيحها وقيمها. يتم تحقيق ذلك غالبًا باستخدام Object.entries() و flatMap() لتحويل الكائنات إلى أزواج قيمة المفتاح.
5. لماذا لا يعمل الإكمال التلقائي للتعدادات المستندة إلى السلسلة؟
6. في JavaScript، قد لا يعمل الإكمال التلقائي للتعدادات المستندة إلى سلسلة ما لم يتم تعريفها باستخدام as const في TypeScript، مما يضمن التعامل مع أنواعها كثوابت.
7. ما هي ميزة استخدام Symbol() لقيم التعداد؟
8. تضمن الرموز أن كل قيمة تعداد فريدة من نوعها، مما يمنع التصادمات العرضية بين قيم التعداد في قواعد التعليمات البرمجية الكبيرة.
9. كيف يمكنني إضافة أمان نوع TypeScript إلى تعدادات JavaScript؟
10. باستخدام نوع مخصص مثل Enum<T>، يمكنك تحسين أمان الكتابة ودعم الإكمال التلقائي في تعدادات JavaScript.

الأفكار النهائية حول الإكمال التلقائي لجافا سكريبت

يتطلب تحقيق دعم الإكمال التلقائي الكامل في تعدادات JavaScript معالجة دقيقة للأنواع والثبات. التقنيات التي ناقشناها، مثل استخدام كائن.تجميد () ورسم الخرائط ثنائية الاتجاه، يعالج التحديات الشائعة عند التعامل مع كل من التعدادات القائمة على الكائنات والقائمة على السلسلة.

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