شرح تفصيلي لمبادئ تنفيذ صفائف فئة JavaScript والكائنات القابلة للتكرار

[توصيات ذات صلة: فيديو تعليمي لـ JavaScript، واجهة ويب أمامية]

الكائنات القابلة للتكرار

كائنًا خاصًا، ولا يقتصر اختلافها عن الكائنات العادية على الوصول المتسلسل للعناصر وتخزينها. هناك اختلاف مهم آخر وهو أن المصفوفات قابلة للتكرار، أي أنه يمكنك استخدام عبارة for ... of للوصول إلى (تكرار) جميع العناصر.

يمكننا ببساطة إجراء تجربة صغيرة:

Let arr = [1,2,3,4,5]for(let val of arr){
    console.log(val)}

نتائج تنفيذ التعليمات البرمجية:

يستخدم الكود أعلاه ببساطة ميزة التكرار للمصفوفة. عندما نصل إلى عناصر المصفوفة، لا نحتاج إلى استخدام الحرف المنخفض للعنصر.

ماذا يحدث إذا استخدمنا عبارة for ... of على كائن عادي؟

دع الكائن = {
    الاسم: "شياو مينغ"،
    age:12,}for(let para of obj){ // سيبلغ الكود عن خطأ console.log(para)}

تأثير التنفيذ كما يلي:

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

Code.iterator

إذا أردنا أن يكون الكائن قابلاً للتكرار، فيجب علينا إضافة طريقة تسمى Symbol.iterator إلى الكائن ( Symbol مضمن يجعل الكائنات قابلة للتكرار على وجه التحديد).

تتضمن وظائف الطريقة ما يلي:

1. عند استخدام حلقة for ... of لتكرار كائن، سيتم استدعاء الأسلوب Symbol.iterator ، ويجب أن تقوم هذه الطريقة بإرجاع مكرر (كائن باستخدام الأسلوب next() ).
2. بعد الحصول على المكرِّر، سيستدعي for ... of باستمرار الطريقة next() للمكرِّر للحصول على العنصر التالي.
3. يجب أن يتوافق المحتوى الذي يتم إرجاعه بواسطة الطريقة next() مع التنسيق: {done:Boolean,value:any} عند done:true ، تنتهي الحلقة، وإلا فإن value هي القيمة التالية.

التكرار: التكرار

هو مفهوم مستعار من لغات مثل C++ . مبدأ التكرار يشبه المؤشر، فهو يشير إلى عنصر في مجموعة البيانات، يمكنك الحصول على العنصر الذي يشير إليه، أو يمكنك نقله للحصول على عناصر أخرى. تشبه التكرارات توسيع المشتركين في المصفوفات. تحتوي هياكل البيانات المختلفة، مثل القوائم المرتبطة ( List ) والمجموعات ( Set ) والخرائط ( Map ) على تكرارات مقابلة.

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

تنفيذ كائن قابل للتكرار:

Let obj = {
    من: 1،
    إلى:5,}obj[Symbol.iterator] = function(){
    // إرجاع مكرر return {
        الحالي: هذا.من،
        الأخير: this.to،
        التالي(){
            إذا (هذا. الحالي <هذا. الأخير) {
                إرجاع {تم: خطأ، القيمة: this.current++}
            }آخر{
                إرجاع {تم: صحيح}//نهاية التكرار}
        }
    }}ل(دع الفقرة من الكائن){
    console.log(para)}

تأثير تنفيذ التعليمات البرمجية:

لاحظ أنه على الرغم من إمكانية تكرار الكائنات المذكورة أعلاه، إلا أن المادة المستخدمة للتكرار ليست كائنًا، بل المكرر (كائن أيضًا) الذي يتم إرجاعه بواسطة Symbol.iterator .

إنشاء الكائن نفسه في مُكرِّر

يقوم الكود أعلاه بإنشاء دالة مضمنة Symbol.iterator() ، والتي تُرجع كائنًا مكرِّرًا. يمكننا أيضًا استخدام طريقة أخرى لتنفيذ التكرارات: جعل الكائن نفسه مكررًا:

Let obj = {
    من: 1،
    إلى: 5،
    [Symbol.iterator](){
        this.current = this.from;
        إرجاع هذا;// إرجاع الكائن نفسه},
    next(){// أضف الطريقة التالية للكائن if(this.current<this.to){
            إرجاع {تم: خطأ، القيمة: this.current++}
        }آخر{
            العودة {تم: صحيح}
        }
    }}ل(دع الفقرة من الكائن){
    console.log(para)}

تأثير تنفيذ التعليمات البرمجية هو نفس الصورة أعلاه.

على الرغم من أن الكود يكون أكثر إيجازًا من خلال القيام بذلك، نظرًا لعدم إنشاء كائن جديد قابل للتكرار، لا يمكننا تنفيذ for ... of لتكرار نفس الكائن في نفس الوقت، ولكن هناك تكراران متوازيان على نفس الكائن نادر.

يمكننا تلخيص مفهوم الكائنات القابلة للتكرار:

ما يسمى بالكائنات القابلة للتكرار هي كائنات عادية تحتوي على طريقة أخرى تسمى Symbol.iterator مقارنة بالكائنات العادية.

وبدلاً من ذلك، فإن الكائن الذي يحتوي على Symbol.iterator والطريقة next هو أيضًا كائن قابل للتكرار.

السلسلة أيضًا قابلة للتكرار،

والمصفوفات والسلاسل قابلة للتكرار، ويمكننا بسهولة استخدام for...of لتكرار عناصر الأحرف في المصفوفة:

Let str = '123'for(let c of str){.
    console.log(c)}

وهذا صالح أيضًا للأزواج البديلة (أحرف UTF-16 الموسعة):

Let str = '...'for(let c of str){
    console.log(c)}

تأثير التنفيذ كما يلي:

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

ليست فقط for...of العبارات التي يمكنها استخدام التكرارات، يمكننا أيضًا استدعاء التكرارات بشكل صريح:

Let str = '12345'let itr = str[Symbol.iterator]()while(true){
    دع النتيجة = itr.next()
    إذا (نتيجة. تم) استراحة؛
    

تأثير تنفيذ التعليمات البرمجية

console.log(result.value)}

يقوم الكود أعلاه بعملية اجتياز أحرف السلسلة، ألا تعتقد أن الكائنات القابلة للتكرار لم تعد غامضة بعد الآن!

الكائنات المشابهة للمصفوفات والكائنات القابلة للتكرار

الكائنات المشابهة للمصفوفات والكائنات القابلة للتكرار متشابهة جدًا من حيث وظائف الاجتياز. يمكن لكل منهما الوصول بسهولة إلى العناصر الداخلية، ولكن لا تزال هناك اختلافات واضحة بين الاثنين:

1. الكائنات iterable : الكائنات التي تنفذ Symbol.iterator
كائن يشبه
2. المصفوفة
3. array-like يحتوي على فهرس رقمي وله سمة length ؛

السلسلة هي كائن قابل للتكرار على الرغم من أنه كائن يشبه المصفوفة.

الكائنات القابلة للتكرار والمشابهة للمصفوفة ليست في العادة مصفوفات إذا أردنا تحويل كائن قابل للتكرار أو يشبه المصفوفة إلى مصفوفة، فسنحتاج إلى استخدام التابع Array.from .

Array.from

استخدم Array.from لتحويل سلسلة إلى مصفوفة:

Let str = '123' Let arr = Array.from(str)console.log(arr)

تأثير تنفيذ التعليمات البرمجية هو كما يلي:

تحويل كائن يشبه المصفوفة المخصصة إلى مصفوفة:

Let obj = {
    0:'0',
    1:'1'،
    2:'2'،
    length:3}let arr = Array.from(obj)console.log(arr)

نتيجة تنفيذ التعليمات البرمجية:

بناء الجملة الكامل لـ Array.from :

Array.from(obj[, MapFunc, thisArg])

سيتم استدعاء أسلوب mapFunc على كل عنصر قابل للتكرار أو يشبه المصفوفة قبل إنشاء المصفوفة. إذا كانت mapFunc طريقة عضو، فيمكنك استخدام thisArg لتوفير this المؤشر.

على سبيل المثال:

Let str = '12345'let arr = Array.from(str,itm=>+itm)console.log(arr)

نتيجة تنفيذ التعليمات البرمجية:

هنا، يتم استخدام وظيفة التعيين لتحويل مصفوفة الأحرف التي يجب إنشاؤها إلى مصفوفة رقمية.

الموجزة

1. التي يمكنها استخدام بناء الجملة for...of تسمى الكائنات القابلة للتكرار،
2. next
كائنات تقوم بتنفيذ طريقة
3. Symbol.iterator
4. Symbol.iterator أساس الكائنات العادية
5. ، تُرجع هذه الطريقة قيمة العنصر التالي؛
6. يجب أن تتوافق القيمة المرجعة للطريقة next مع التنسيق {done:Boolean,value:nextVal} عند done:true ،

7. يمكن Array.from تحويل صفائف الفئة كائنات قابلة للتكرار في المصفوفات؛

[توصيات ذات صلة: دروس فيديو JavaScript، واجهة الويب الأمامية]

ما ورد أعلاه هو شرح مفصل لمبادئ تنفيذ مصفوفات فئة JavaScript والكائنات القابلة للتكرار، لمزيد من المعلومات، يرجى الانتباه إلى المقالات الأخرى ذات الصلة شبكة كود المصدر!