دعنا نوضح الالتباس حول أساليب slice () و splice () و split () في JavaScript

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

أنصح الطلاب والمطورين المبتدئين بقراءة هذه المقالة بعناية لأنه يمكن أيضًا طلب هذه الطرق الثلاثة في مقابلات العمل.

يمكنك العثور على ملخص لكل طريقة في النهاية. إذا كنت تفضل ذلك ، يمكنك أيضًا مشاهدة إصدار الفيديو أدناه:

دعنا نبدأ…

مصفوفات جافا سكريبت

أولاً ، تحتاج إلى فهم كيفية عمل مصفوفات JavaScript . كما هو الحال في لغات البرمجة الأخرى ، نستخدم المصفوفات لتخزين بيانات متعددة في JS. لكن الاختلاف هو أن مصفوفات JS يمكن أن تحتوي على أنواع مختلفة من البيانات في وقت واحد.

نحتاج أحيانًا إلى إجراء عمليات على تلك المصفوفات. ثم نستخدم بعض طرق JS مثل slice () & splice () . يمكنك أن ترى أدناه كيفية التصريح عن مصفوفة في JavaScript:

let arrayDefinition = [];   // Array declaration in JS

الآن دعنا نعلن عن مصفوفة أخرى بأنواع بيانات مختلفة. سأستخدمه أدناه في الأمثلة:

let array = [1, 2, 3, "hello world", 4.12, true];

هذا الاستخدام صالح في JavaScript. مصفوفة بأنواع بيانات مختلفة: سلسلة وأرقام ومنطقية.

شريحة ( )

تقوم الطريقة slice () بنسخ جزء معين من المصفوفة وإرجاع الجزء المنسوخ كمصفوفة جديدة. لا يغير المصفوفة الأصلية.

array.slice(from, until);

  • من: شريحة الصفيف بدءا من فهرس عنصر
  • حتى: قم بتقطيع المصفوفة حتى فهرس عنصر آخر

على سبيل المثال ، أريد تقسيم العناصر الثلاثة الأولى من المصفوفة أعلاه. نظرًا لأن العنصر الأول في المصفوفة يتم فهرسته دائمًا عند 0 ، أبدأ في تشريح "من" 0.

array.slice(0, until);

الآن هنا هو الجزء صعبة. عندما أريد أن شريحة العناصر الثلاثة الأولى، يجب أن أعطي حتى المعلمة كما 3. إن لا تتضمن طريقة شريحة () لعنصر معين الماضي.

array[0] --> 1 // included array[1] --> 2 // included array[2] --> 3 // included array[3] --> "hello world" // not included

هذا يمكن أن يخلق بعض الالتباس. لهذا السبب أسمي المعلمة الثانية "حتى".

let newArray = array.slice(0, 3);   // Return value is also an array

أخيرًا ، قمت بتعيين المصفوفة المقطعة إلى متغير newArray . الآن دعنا نرى النتيجة:

ملاحظة مهمة: يمكن أيضًا استخدام طريقة Slice () للسلاسل.

لصق او جمع ( )

يشبه اسم هذه الوظيفة اسم slice () . غالبًا ما يربك تشابه التسمية هذا المطورين. تعمل طريقة splice () على تغيير المصفوفة بإضافة عناصر منها أو إزالتها منها. دعونا نرى كيفية إضافة وإزالة العناصر مع لصق ( ) :

إزالة العناصر

لإزالة العناصر، ونحن بحاجة لإعطاء مؤشر معلمة، و عدد من العناصر المراد إزالتها:

array.splice(index, number of elements);

الفهرس هو نقطة البداية لإزالة العناصر. لن تتم إزالةالعناصر التي لهارقم فهرس أصغر من الفهرس المحدد:

array.splice(2);  // Every element starting from index 2, will be removed

إذا لم نحدد المعامل الثاني ، فسيتم حذف كل عنصر يبدأ من الفهرس المحدد من المصفوفة:

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

array.splice(2, 1);

بعد المكالمة الأولى:

بعد المكالمة الثانية:

يمكن أن يستمر هذا حتى لا يوجد فهرس 2 بعد الآن.

مضيفا العناصر

لإضافة العناصر ، نحتاج إلى إعطائها كمعامل ثالث ، رابع ، خامس (يعتمد على عدد العناصر المراد إضافتها) إلى طريقة لصق () :

array.splice (الفهرس ، عدد العناصر ، العنصر ، العنصر) ؛

على سبيل المثال ، أقوم بإضافة a و b في بداية المصفوفة ولا أحذف شيئًا:

array.splice(0, 0, 'a', 'b');

انشق، مزق ( )

أساليب Slice () و splice () مخصصة للمصفوفات. و انقسام () يستخدم أسلوب السلاسل . يقسم السلسلة إلى سلاسل فرعية ويعيدها كمصفوفة. يأخذ 2 معلمات ، وكلاهما اختياري.

string.split(separator, limit);

  • فاصل: يحدد كيفية تقسيم سلسلة ... بفاصلة ، وحرف ، إلخ.
  • الحد: يحد من عدد الانقسامات برقم معين

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

دعونا نرى كيف يعمل.

أولاً ، نقوم بتحويل المصفوفة الخاصة بنا إلى سلسلة باستخدام طريقة toString () :

let myString = array.toString();

الآن دعونا الانقسام myString بواسطة فواصل الحد منها إلى ثلاثة فرعية، وإعادتها كما صفيف:

let newArray = myString.split(",", 3);

كما نرى ، يتم تقسيم myString بفاصلات. نظرًا لأننا حددنا الانقسام إلى 3 ، فلن يتم إرجاع سوى العناصر الثلاثة الأولى.

ملاحظة: إذا كان لدينا استخدام مثل هذا:array.split("");فسيتم تقسيم كل حرف في السلسلة على هيئة سلاسل فرعية:

ملخص:

شريحة ( )

  • ينسخ عناصر من مصفوفة
  • يعيدهم كمصفوفة جديدة
  • لا يغير المصفوفة الأصلية
  • يبدأ التقطيع من ... حتى الفهرس المحدد: array.slice (من ، حتى)
  • لا تتضمن الشريحة معلمة الفهرس "حتى"
  • يمكن استخدامها لكل من المصفوفات والسلاسل

لصق او جمع ( )

  • تستخدم لإضافة / إزالة العناصر من المصفوفة
  • تُرجع مجموعة من العناصر المُزالة
  • يغير المصفوفة
  • لإضافة العناصر: array.splice (الفهرس ، عدد العناصر ، العنصر)
  • لإزالة العناصر: array.splice (الفهرس ، عدد العناصر)
  • يمكن استخدامه فقط للمصفوفات

انشق، مزق ( )

  • يقسم السلسلة إلى سلاسل فرعية
  • يعيدها في مصفوفة
  • يأخذ معلمتين ، كلاهما اختياري: string.split (فاصل ، حد)
  • لا يغير السلسلة الأصلية
  • يمكن استخدامه فقط للسلاسل

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

إذا كنت تريد معرفة المزيد عن تطوير الويب ، فلا تتردد في متابعتي على Youtube !

شكرا لقرائتك!