ما الفرق بين splice & filter

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

أي تقوم بتغيير المصفوفة الأصلية، لاحظ التالي:

let fruits = ['تفاح', 'موز', 'برتقال', 'مانجو'];

fruits.splice(1, 1);

console.log(fruits);

هنا قمت بحذف عنصر واحد فقط بدءًا من الـ index رقم 1 في المصفوفة، ثم حددت عدد العناصر التي أريد حذفها وهي عنصر 1 فقط.

لذا النتيجة:

['تفاح', 'برتقال', 'مانجو']

أما filter لإنشاء مصفوفة جديدة تحتوي فقط على العناصر التي تستوفي شرط معين، ولا تقوم  بالتغيير في المصفوفة الأصلية،  بل تعيد مصفوفة جديدة تحتوي على العناصر التي اجتازت الشرط.

let fruits = ['تفاح', 'موز', 'برتقال', 'مانجو'];

let filteredFruits = fruits.filter(fruit => fruit !== 'موز');

console.log(filteredFruits); //المصفوفة التي فلترتها

console.log(fruits);//المصفوفة الأصلية

قمت بحذف موز من المصفوفة، قم بتجربة تشغيل الكود ولاحظ الفرق بين المصفوفة التي فلترتها والمصفوفة الأصلية والتي لم تتغير.

ستجد تفصيل هنا أرجو قراءته بتمعن:

أولا splice() تستخدم لتعديل المصفوفة الأصلية بحذف أو إضافة عناصر. وهي تؤثر بشكل مباشر على المصفوفة الأصلية وتعيد لك مصفوفة تحتوي على العناصر التي تم حذفها من المصفوفة الأصلية .

وهذه هي طريقة إستخدامها :

array.splice(startIndex, deleteCount, item1, item2, ...)

مثال :

let arr = [1, 2, 3, 4, 5];
let removed = arr.splice(1, 2); // من index 1، حذف عنصرين
console.log(arr);     // [1, 4, 5]
console.log(removed); // [2, 3]

وإليك الشرح التالي من موسوعة حسوب .

أما filter() تستخدم لإنشاء مصفوفة جديدة تحتوي فقط على العناصر التي تحقق شرط معين.ولا يؤثر على المصفوفة الأصلية كما في splice وتعيد مصفوفة جديدة بالعناصر المحققة للشرط .

مثال :

let arr = [1, 2, 3, 4, 5];
let filtered = arr.filter(num => num > 2);
console.log(arr);      // [1, 2, 3, 4, 5]
console.log(filtered); // [3, 4, 5]

وإليك الشرح التالي من موسوعة حسوب .

الفرق بين splice و filter في JavaScript بسيط لكنه مهم:

هذه الدالة تُستخدم إذا كنت تريد تعديل المصفوفة الأصلية مباشرة، سواء بحذف عناصر أو إضافة عناصر في موقع معين داخلها.

مثال:

let numbers = [5, 10, 15, 20, 25];
numbers.splice(2, 1); // نحذف عنصراً واحداً من index رقم 2
console.log(numbers); // الناتج: [5, 10, 20, 25]

تستخدم لإنشاء مصفوفة جديدة، تحتوي فقط على العناصر التي تحقق شرط معين.
لا تغير المصفوفة الأصلية.

let arr = [1, 2, 3, 4]; 
let result = arr.filter(num => num > 2); 
console.log(result); // [3, 4] 
console.log(arr); // [1, 2, 3, 4]