Skip to Sidebar Skip to Content
اقرأ-تك اقرأ-تك
ضيفنا الكريم

  • قائمة القراءة
  • تسجيل الدخول
  • الرئيسية
  • المقالات
  • خطط الاشتراك
  • - اصدارتنا
  • ورقة وقلم
  • مدونات فطين
  • النشرة الأسبوعية
  • كتبنا وإصداراتنا
  • - تعرف علينا
  • من نحن
  • الشراكات
  • كتاب المحتوى
  • اكتب معنا
  • تواصل معنا
  • - بنود الخدمة
  • سياسة الخصوصية
  • الشروط والأحكام
الوسوم
  • Backend
  • Distributed Systems
  • System Design
  • Databases
  • LinkedIn
  • X
  • Facebook
  • Telegram
  • GitHub
جميع الحقوق محفوظة لمنصة اقرأ-تِك ©2026

Primitives vs objects in JavaScript

  • Ahmed Anwar by Ahmed Anwar
    Ahmed Anwar Ahmed Anwar
    Software Technical Writer
    • Website
  • •
  • 4 Feb, 2024
  • •
  • 4 min read
  • Share on X
  • Share on Facebook
  • Share on LinkedIn
  • Share on Pinterest
  • Email
Primitives vs objects in JavaScript
  • Frontend
  • Programming Language
  • Web Development
  • JavaScript

هنتكلم في المقال دا عن الـ primitive and object types in Javascript وهنقارن بينهم من حيث 3 حاجات وهم:

  1. Mutability 
  2. Copying
  3. As a function arguments

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

تعالوا نتكلم عن أول وجه مقارنة بين الـ  primitive and object types وهو الـ mutability بس قبل ما نتكلم عن الـ mutability خلينا نعرف ايه هي الـ  primitive type وايه الـ  object types.

  • Primitive types: String,Number, Boolean,Undefined, Symbol
  •  Object types: objects, arrays.

Mutability ( القابلية للتغير )

هنبدأ بمثال عشان نفهم يعني ايه mutability وازاي بتختلف على حسب احنا شغالين مع primitive ولا مع object، في المثال ده هنعرف string و array :


let s = "eqraa";
let arr = [1 , 2 , 3 , 4 , 5];

وهنبدأ نجرب شوية حاجات على كل متغير، في الـ string هنجرب نغير أول حرف نخليه E بدل e وفي الـ array هنجرب نغير أول رقم نخليه صفر، وهنشوف هل هيتغيروا فعلاََ ولا لأ

 
s[0] = 'E;
arr[0] = 0;
console.log("s = " + s);
console.log("arr = " + arr);

لما نيجي نعمل run النتيجة دي اللي هتطلع:

هنلاحظ إن الـ string متغيرش بس الـ array اتغير. 

هنجرب حاجة كمان وهي إننا نغير الـ length للـ string والـ array: 

console.log("The length of the string s is originally",s.length);
console.log("The length of the array arr is originally",arr.length );

// updating the length
s.length = 100;
arr.length = 100;

// results
console.log("The length of the string sis now " , s.length);
console.log("The length of the array arr is now", arr.length);

ودي النتيجة اللي هتطلع لما نعمل run: 

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

اشترك الآن وتصفح كافة المقالات المميزة واستمتع بمحتوى حصري وابق على اطلاع دائم بالتحديثات المستمرة.

اشترك الآن 🚀

هل لديك حساب؟ تسجيل الدخول

في هذا المقال
اشترك الآن واكمل قراءة المقال
ابدأ رحلتك الآن ابدأ رحلتك الآن
النشرة الأسبوعية

اشترك الآن في نشرة اقرأ‍تِك الأسبوعية

لا تدع أي شيء يفوتك. احصل على أحدث المقالات والشروحات البصرية ومدونات الشركات العالمية مباشرة إلى بريدك الإلكتروني — وبشكل مجاني تمامًا.

  • مقالات تقنية متعمقة في هندسة البرمجيات
  • شروحات بصرية لمفاهيم معقدة بطريقة مبسّطة
  • تجارب عملية من شركات عالمية
انضم لأكثر من 7,000 مشترك
+7,000
قارئ نشط ومشترك
نشرة أسبوعية كل يوم سبت

مقالات ذات صلة

  • How Is Qebla WebApp Actually BackendLess? 1 min read

    How Is Qebla WebApp Actually BackendLess?

    اقرأ-تِك اقرأ-تِك • 27 Aug, 2026
    اقرأ-تِك اقرأ-تِك
    • Beyond Barrel Files 1 min read

      Beyond Barrel Files

      Saeed Khaled Saeed Khaled • 16 Apr, 2026
      Saeed Khaled Saeed Khaled
      Frontend Developer
      • Website
    • Critical Rendering Path 2 min read

      Critical Rendering Path

      Saeed Khaled Saeed Khaled • 19 Aug, 2025
      Saeed Khaled Saeed Khaled
      Frontend Developer
      • Website
    • Thoughts on CORS Policy 3 min read

      Thoughts on CORS Policy

      Mohammed Lashein Mohammed Lashein • 1 Jul, 2025
      Mohammed Lashein Mohammed Lashein
      Full stack developer
      • Website
    • Idempotency in APIs 2 min read

      Idempotency in APIs

      Oussama Djaidri Oussama Djaidri • 16 Jun, 2025
      Oussama Djaidri Oussama Djaidri
      Front-End Engineer
      • Website
    • Browser & Server Negotiation Behind The Scene 2 min read

      Browser & Server Negotiation Behind The Scene

      Saeed Khaled Saeed Khaled • 22 Apr, 2025
      Saeed Khaled Saeed Khaled
      Frontend Developer
      • Website
    • Introduction Into Robots.txt 1 min read

      Introduction Into Robots.txt

      Saeed Khaled Saeed Khaled • 5 Apr, 2025
      Saeed Khaled Saeed Khaled
      Frontend Developer
      • Website
    • Tailwindcss 1 min read

      Tailwindcss

      Alaa Elkzaz Alaa Elkzaz • 31 Mar, 2025
      Alaa Elkzaz Alaa Elkzaz
      Co-Founder & Software Engineer
      • Website
    • Cross-Tab Communication with Broadcast Channel API 1 min read

      Cross-Tab Communication with Broadcast Channel API

      Ahmed Saber Ahmed Saber • 27 Feb, 2025
      Ahmed Saber Ahmed Saber
      Front-End Engineer
      • Facebook
      • Website
    • Introduction Into Cascade in CSS Part 2 2 min read

      Introduction Into Cascade in CSS Part 2

      Ibrahim Harchiche Ibrahim Harchiche • 11 Feb, 2025
      Ibrahim Harchiche Ibrahim Harchiche
      Frontend Developer
      • Website
    اقرأ-تك اقرأ-تك
    • الرئيسية
    • المقالات
    • خطط الاشتراك
    • - اصدارتنا
    • ورقة وقلم
    • مدونات فطين
    • النشرة الأسبوعية
    • كتبنا وإصداراتنا
    • - تعرف علينا
    • من نحن
    • الشراكات
    • كتاب المحتوى
    • اكتب معنا
    • تواصل معنا
    • - بنود الخدمة
    • سياسة الخصوصية
    • الشروط والأحكام
    الوسوم
    • Backend
    • Distributed Systems
    • System Design
    • Databases
    • LinkedIn
    • X
    • Facebook
    • Telegram
    • GitHub
    جميع الحقوق محفوظة لمنصة اقرأ-تِك ©2026

    كل ما يخص هندسة البرمجيات 🚀

    شارك هذا المحتوى الآن وساعدنا في تحقيق رؤيتنا لإثراء المحتوى التقني في العالم العربي!

    أو انقر لنسخ الرابط