النسخ السطحي والعميق

جزء من قسم Logic & Flow في رحلة JavaScript على Coddy — الدرس 25 من 65.

عند نسخ الكائنات، لدينا نوعان من النسخ:

النسخ السطحي (Shallow Copy) - ينسخ المستوى الأول فقط
النسخ العميق (Deep Copy) - ينسخ جميع المستويات المتداخلة

طرق النسخ السطحي:

باستخدام معامل النشر (spread operator):

const original = { a: 1, b: { x: 2 } };
const spreadCopy = { ...original };

باستخدام Object.assign() الذي ينشئ كائناً جديداً عن طريق نسخ الخصائص من الكائن المصدر إلى الكائن الهدف:

const assignCopy = Object.assign({}, original);

مشكلة في النسخ السطحي (Shallow Copy):

original.b.x = 3;
console.log(spreadCopy.b.x); // 3
// (تشترك الكائنات المتداخلة في المرجع)

console.log(assignCopy.b.x); // 3

فهم طرق JSON والنسخ العميق (Deep Copy)

JSON.stringify() يحول كائن JavaScript إلى سلسلة JSON نصية:

const obj = { name: "John", age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // "{"name":"John","age":30}"

JSON.parse() يحول سلسلة JSON النصية مرة أخرى إلى كائن JavaScript:

const backToObject = JSON.parse(jsonString);
console.log(backToObject); // { name: "John", age: 30 }

نسخة عميقة باستخدام JSON:

const original = { a: 1, b: { x: 2 } };
const deepCopy = JSON.parse(JSON.stringify(original));

original.b.x = 3;
console.log(deepCopy.b.x); // 2 (مستقل تماماً)

التحدي

سهل

أنشئ دالة باسم processCart تأخذ سلسلة نصية (string) بتنسيق JSON تمثل عربة تسوق. تحتوي العربة على مصفوفة من المنتجات مع الأسماء والأسعار. مهمتك هي:

تحليل سلسلة JSON النصية إلى كائن JavaScript
إنشاء عربتين منفصلتين منها
في العربة الثانية:
1. إضافة خاصية discounted لكل عنصر وتعيينها إلى false
2. تطبيق خصم بنسبة 10% على جميع العناصر التي يكون الـ price الخاص بها أكبر من 50
3. تعيين 'discounted' إلى true للعناصر التي حصلت على الخصم
إرجاع مصفوفة تحتوي على كلتا العربتين

ورقة مرجعية

عند نسخ الكائنات (objects)، لدينا نوعان من النسخ:

النسخ السطحي (Shallow Copy) - ينسخ المستوى الأول فقط
النسخ العميق (Deep Copy) - ينسخ جميع المستويات المتداخلة

طرق النسخ السطحي:

باستخدام عامل الانتشار (spread operator):

const original = { a: 1, b: { x: 2 } };
const spreadCopy = { ...original };

باستخدام Object.assign():

const assignCopy = Object.assign({}, original);

المشكلة في النسخ السطحي:

original.b.x = 3;
console.log(spreadCopy.b.x); // 3 (nested objects share reference)

طرق JSON:

تقوم JSON.stringify() بتحويل كائن JavaScript إلى سلسلة نصية بتنسيق JSON:

const obj = { name: "John", age: 30 };
const jsonString = JSON.stringify(obj);
console.log(jsonString); // "{"name":"John","age":30}"

تقوم JSON.parse() بتحويل سلسلة JSON النصية مرة أخرى إلى كائن JavaScript:

const backToObject = JSON.parse(jsonString);
console.log(backToObject); // { name: "John", age: 30 }

النسخ العميق باستخدام JSON:

const original = { a: 1, b: { x: 2 } };
const deepCopy = JSON.parse(JSON.stringify(original));

original.b.x = 3;
console.log(deepCopy.b.x); // 2 (completely independent)

جرّب بنفسك

function processCart(jsonString) {
    // اكتب الكود هنا
}
// لا تكتب أي شيء خارج الدالة

اختبر نفسك

يتضمن هذا الدرس اختبارًا قصيرًا. ابدأ الدرس للإجابة عليه وتتبّع تقدمك.

جميع دروس Logic & Flow

1السلاسل النصية بعمق

أساسيات السلاسل النصية التكرار عبر السلاسل النصية Template Literals دوال السلاسل النصية مراجعة - String Weaver

4JSON الجزء الثاني

التكرار عبر JSON JSON المتداخل التسلسل الاختياري في JSONالنسخ السطحي والعميقمراجعة - متجر الدراجات مراجعة - النظام الشمسي

7نظام إدارة المكتبة

نظرة عامة على المشروع إضافة الكتب

البحث بالعنوان

التصفية حسب النوع

تحديد كمقروء

10إدارة نظام المهرجان

نظرة عامة على المشروع إضافة الأفلام والأماكن

2المصفوفات متعددة الأبعاد

أساسيات المصفوفات ثنائية الأبعاد الوصول إلى عناصر المصفوفات ثنائية الأبعاد الحلقات المتداخلة مع المصفوفات ثنائية الأبعاد مراجعة - المصفوفات ثنائية الأبعاد جمع وطرح المصفوفات المصفوفات المتعرجة (Jagged Arrays)المصفوفات ثلاثية الأبعاد وما بعدها أنماط المصفوفات ثنائية الأبعاد الشائعة مراجعة - كل شيء عن المصفوفات

5المجموعات - الجزء الأول

ما هي المجموعة؟التكرار عبر المجموعات إضافة عنصر إزالة عنصر التحقق من وجود عنصر الحجم وهل هي فارغة النسخ والمسح ملخص - أساسيات المجموعات

8مواضيع شيقة حول الـ Arrays

تفكيك الـ Array استخدام الـ Spread Syntax في الـ Arrays الـ Sparse Arrays مراجعة - ورشة عمل الـ Arrays

3JSON الجزء الأول

ما هو JSON؟التحقق من وجود المفتاح Object Methods Spread Operator الجزء الأول Spread Operator الجزء الثاني حذف المفاتيح مراجعة - معالجة مفاتيح JSON

6المجموعات - الجزء الثاني

الرياضيات - اتحاد المجموعات الرياضيات - تقاطع المجموعات الرياضيات - الفرق بين المجموعات الرياضيات - الفرق المتناظر المجموعات الجزئية والمجموعات الفائقة مراجعة - مجموعات الأصدقاء

9دوال المصفوفات المتقدمة

دالتا Join و Split دالة Map دالة Filter دالة Reduce تسلسل دوال المصفوفات هل ForEach و Map متماثلتان؟دالة Sort دالتا Find و FindIndex مراجعة - محترف التسلسل