path: root/files/ar/web/javascript/guide/working_with_objects/index.html

---
title: العمل مع الكائنات
slug: Web/JavaScript/Guide/Working_with_Objects
translation_of: Web/JavaScript/Guide/Working_with_Objects
---
<div>{{jsSidebar("JavaScript Guide")}} {{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</div>

<p class="summary" dir="rtl">تم تصميم جافا سكريبت على نموذج بسيط يستند إلى الكائنات. الكائن هو عبارة عن مجموعة من الخصائص، كل خاصية لها اسم وقيمة key/value يمكن أن تكون قيمة هذه الخاصية عبارة عن دالة، وفي هذه الحالة يمكن ان تسمى بالوظيفة « method ». بالإضافة إلى الكائنات الأصلية التي توفرها بيئة المتصفحات، يمكنك انشاء كائنات خاصة بك. يصف هذا الفصل كيفية استخدام الكائنات، والخصائص والدوال او الوظائف، وايضا كيفية إنشاء الكائنات الخاصة بك.</p>

<h2 dir="rtl" id="نظرة_عامة_حول_الكائنات">نظرة عامة حول الكائنات</h2>

<div style="font-size: 15px; font-family: 'tahoma';">
<p dir="rtl">الكائنات في جافا سكريبت: كما هو الحال في العديد من لغات البرمجة الأخرى، يمكن مقارنة الكائنات بالحياة الحقيقية. ويمكن تشبيه مفهوم الكائنات في جافا سكريبت بالأشياء الملموسة في واقع الحياة.</p>

<p dir="rtl">في الجافاسكريبت، الكائن هو كيان مستقل بخصائصه وانواعه، يمكن مقارنته بكوب، على سبيل المثال.الكوب هو كائن له خصائصه، الكوب له لون، له شكل، له وزن، صنع بمواد معينة، واشياء اخرى. بنفس الطريقة، كائنات الجافا سكريبت لها ايضا خصائصها التي تميزها.</p>

<h2 dir="rtl" id="الكائنات_والخصائص">الكائنات والخصائص</h2>

<p dir="rtl">كائنات الجافاسكريبت لها خصائص مرتبطة بها. يمكن تشبيه خاصية الكائن بمتغير مرتبط به. خصائص الكائن هي في الأساس نفس متغيرات جافا سكريبت العادية. خصائص الكائن تحدد مميزات الكائن، يمكنك الوصول إلى خصائص الكائن من خلال نقطة التدوين :</p>

<pre class="brush: js">objectName.propertyName
</pre>

<p dir="rtl">ككل متغيرات جافاسكريبت،  اسم الكائن واسم الخاصية حساسة تجاه الاحرف (case sensitive). يمكنك تعيين خاصية ومنحها قيمة اولية. على سبيل المثال، لنقم بانشاء كائن باسم myCar وتعين خصائص له بالاسماء التالية : make, model و year كما في المثال التالي :</p>

<pre class="brush: js">var myCar = new Object();
myCar.make = 'Ford';
myCar.model = 'Mustang';
myCar.year = 1969;
</pre>

<p>خصائص الكائن الغير معرفة هي {{jsxref("undefined")}} (وليست {{jsxref("null")}}).</p>

<pre class="brush: js">myCar.color; // undefined</pre>

<p dir="rtl">يمكن الوصول الى خصائص الكائنات عن طريق الاقواس المربعة بدلا من نقطة التدوين، في بعض الاحيان يكون من الضروري استخدام الاقواس المربعة للوصول الى خصائص الكائن (لمزيد من المعلومات شاهد <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Property_Accessors">property accessors</a>).  في بعض الاحيان تسمى الكائننات بمصفوفات مترابطة (associative arrays)، نظرا للشبه الكبير بينهما، حيث يمكن استخدام اسم الخاصية للوصول إلى قيمتها، الامر الذي تعتمده ايضا المصفوفات الترابطية. على سبيل المثال  يمكن الوصول إلى خصائص الكائن myCar على النحو التالي:</p>

<pre class="brush: js">myCar['make'] = 'Ford';
myCar['model'] = 'Mustang';
myCar['year'] = 1969;
</pre>

<p dir="rtl">اسم خاصية الكائن يمكن ان يكون اي نوع من انواع النصوص الصحيحة لجافاسكريبت او اي شئ يمكن تحويله الى سلسلة نصية، بما في ذالك النص الفارغ، والنصوص التي تحتوي على رموز او اسماء محجوزة لجافاسكريبت والغير مسموح بها كمعرفات سواء بالنسبة لخصائص الكائن او للمتغيرات العادية على سبيل المثال، اسم خاصية يحتوي على مسافة او اسمين موصولين بواصلة (-) او الاسم الذي يبتدئ برقم. كل هذه الاشياء يمكن الوصول اليها عن طريق الاقواس المربعة فقط. هذه الاقواس فعالة جدا خصوصا مع اسماء الخصائص التي يتم تعينها بشكل ديناميكي (عندما لا يتم تحديد اسم الخاصية الا عند وقت التشغيل ). انظر الامثلة ادناه :</p>

<pre class="brush: js">// four variables are created and assigned in a single go,
// separated by commas
var myObj = new Object(),
    str = 'myString',
    rand = Math.random(),
    obj = new Object();

myObj.type              = 'Dot syntax';
myObj['date created']   = 'String with space';
myObj[str]              = 'String value';
myObj[rand]             = 'Random Number';
myObj[obj]              = 'Object';
myObj['']               = 'Even an empty string';

console.log(myObj);
</pre>

<p dir="rtl">يرجى ملاحظة أن كافة المفاتيح في الاقواس المربعة تم تحويلها إلى سلسلة نصية (string type)، لان الكائنات في جافاسكريبت تتطلب بان يكون نوع المفتاح سلسلة نصية فقط، على سبيل المثال، في المثال اعلاه، عندما تم اضافة المفتاح rand الى ال myObj، الجافاسكريبت استدعت الوظيفة ()obj.toString بشكل اوتوماتيكي، واستخدمت ناتج السلسلة النصية كمفتاح جديد.  <br>
 مع العلم ان ("typeof rand === "number ).</p>

<p dir="rtl">يمكنك أيضا الوصول إلى الخصائص باستخدام قيمة نصية تم تخزينها في متغير :</p>

<pre class="brush: js">var propertyName = 'make';
myCar[propertyName] = 'Ford';

propertyName = 'model';
myCar[propertyName] = 'Mustang';
</pre>

<p dir="rtl">يمكنك استخدام <code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></code> لعمل تكرار على خصائص الكائن القابلة للتصفح ( لمزيد من المعلومات حول <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty">enumerable properties</a> ). لتوضيح ما نعنيه : تقوم الدالة التالية باظهار خصائص الكائن، عندما سيمرر لها الكائن واسم الكائن كبارامترات :</p>

<pre class="brush: js">function showProps(obj, objName) {
  var result = '';
  for (var i in obj) {
    // obj.hasOwnProperty() is used to filter out properties from the object's prototype chain
    if (obj.hasOwnProperty(i)) {
      result += objName + '.' + i + ' = ' + obj[i] + '\n';
    }
  }
  return result;
}
</pre>

<p dir="rtl">وهكذا، باستدعاء الدالة على هذا النحو showProps(myCar, "myCar") سينتج عنها النتائج التالية :</p>

<pre class="brush: js">myCar.make = Ford
myCar.model = Mustang
myCar.year = 1969</pre>

<h2 dir="rtl" id="تصفح_خصائص_الكائن">تصفح خصائص الكائن</h2>

<p dir="rtl">ابتداءا من <a href="/en-US/docs/Web/JavaScript/New_in_JavaScript/ECMAScript_5_support_in_Mozilla" title="en-US/docs/JavaScript/ECMAScript 5 support in Mozilla">ECMAScript 5</a>، هناك ثلاثة طرق لتصفح/المرور على خصائص الكائن :</p>

<ul dir="rtl">
 <li><code><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in" title="en-US/docs/JavaScript/Reference/Statements/for...in">for...in</a></code> loops<br>
  هذه الوظيفة تمر على جميع خصائص الكائن القابلة للتصفح  و ال prototype chain.</li>
 <li>{{jsxref("Object.keys", "Object.keys(o)")}}<br>
  تعود هذه الوظيفة بمصفوفة بجميع اسماء مفاتيح الخصائص القابلة للتصفح في الكائن o، باستثناء الموجودة في ال prototype chain.</li>
 <li>{{jsxref("Object.getOwnPropertyNames", "Object.getOwnPropertyNames(o)")}}<br>
  تعود هذه الوظيفة بمصفوفة بجميع اسماء الخصائص الموجودة في الكائن o، سواء القابلة للتصفح ام لا.</li>
</ul>

<p dir="rtl">قبل ECMAScript 5، لم يكن هناك أية طريقة لتصفح كافة خصائص الكائن. الا انه، يمكن تحقيق ذلك باستخدام الدالة التالية:</p>

<pre class="brush: js">function listAllProperties(o) {
	var objectToInspect;
	var result = [];

	for(objectToInspect = o; objectToInspect !== null; objectToInspect = Object.getPrototypeOf(objectToInspect)) {
      result = result.concat(Object.getOwnPropertyNames(objectToInspect));
	}

	return result;
}
</pre>

<p dir="rtl">يمكن لهذه  الدالةان تكون مفيدة في الكشف عن الخصائص "المخفية" (الخصائص الموجودة في ال prototype chain والتي لا يمكن الوصول إليها من خلال الكائن، بسبب وجود خاصية اخرى لها نفس الاسم في ال prototype chain. لجدولة الخصائص الظاهرة فقط، عليك إزالة التكرار في المصفوفة.</p>

<h2 dir="rtl" id="إنشاء_كائنات_جديدة">إنشاء كائنات جديدة</h2>

<p dir="rtl">جافا سكريبت لديها العديد من الكائنات المحددة مسبقاً. وبالإضافة إلى ذلك، يمكنك إنشاء كائنات خاصة بك. يمكنك إنشاء كائن باستخدام <a href="/ar/docs/Web/JavaScript/Reference/Operators/Object_initializer">مهيئ الكائن</a> (من المهم مراجعة هذا الموضوع حتي يمكنك فهم هذه الجزئية. كما انصح وبشدة مراجعة الفصل الخاص ب <a href="https://developer.mozilla.org/ar/docs/Learn/JavaScript/Objects/Basics">اساسيات الكائن في جافاسكريبت</a> ).</p>

<p dir="rtl">كما يمكنك ايضا انشاء كائن بواسطة <a href="https://developer.mozilla.org/ar/docs/Learn/JavaScript/Objects/Object-oriented_JS">منشئ الوظيفة</a> ( constructor function ) ومن ثم انشاء مثيل/نسخة له، من خلال الكلمة المحجوزة new.</p>

<h3 dir="rtl" id="استخدام_object_initializers"><a id="استخدام object initializers" name="استخدام object initializers">استخدام object initializers</a></h3>

<p dir="rtl">بالإضافة إلى إنشاء كائنات باستخدام constructor function، يمكنك إنشاء كائنات باستخدام <a href="/ar/docs/Web/JavaScript/Reference/Operators/Object_initializer">مهيئ الكائن</a>. هذا النوع من الكائنات  يشار إليه في بعض الأحيان ب object literal notation . وهو يتسق مع المصطلحات المستخدمة من قبل ++C.</p>

<p dir="rtl">التعبير عن كائن باستخدام object initializers:</p>

<pre class="brush: js">var obj = { property_1:   value_1,   // property_# may be an identifier...
            2:            value_2,   // or a number...
            // ...,
            'property n': value_n }; // or a string
</pre>

<p dir="rtl">حيث ان obj هو اسم الكائن الجديد، وكل property_i هو معرف الخاصية، يمكن ان يكون (اما اسما أو رقما أو سلسلة نصية)،في حين ان كل value_i هي تعليمة برمجية سيتم تعيينها كقيمه إلى الخاصية property_i يمكن (تعينها مباشرة او عن طريق اسنادها الى متغير خارجي).</p>

<p dir="rtl">تعريف ال obj هو اختياري، اذا لم تكن تريد الرجوع الى هذا الكائن فى اماكن اخرى، فلا حاجة لتعريفه إلى متغير. لاحظ انك ستحتاج الى احاطة object literal بين قوسين. حتى يعمل بشكل سليم. مثال:</p>

<pre class="brush: js">var value_1 = 600,
value_2 = 400;
({
    property_1: value_1,
    2: value_2,
    "property n": "Measurement",
    init: function(){
        console.log( this["property n"] +": "+ this.property_1 + "x" + this[2]);
    }
}).init(); // Measurement: 600x400

</pre>

<p dir="rtl">مهيئات الكائن، هي تعليمات برمجية، وكل مهئ سيخلق كائن جديد في التعليمة البرمجية التي سيتم تنفيذها. مهيآت الكائنات المتطابقة تنشئ كائنات مميزة والتي لا يمكن مقارنتها ببعضها البعض. يتم إنشاء الكائنات بنفس طريقة انشاء كائن جديد ()new Object، الكائنات المنشاة من خلال ال object literal هي مثيلات الكائن Object.</p>

<p dir="rtl">تقوم التعليمة البرمجية التالية، بانشاء كائن وتعيينه للمتغير x في حالة ما اذا كان الشرط صحيح:</p>

<pre class="brush: js">if (cond) var x = {greeting: 'hi there'};
</pre>

<p dir="rtl">ينشئ المثال التالي، الكائن myHonda مع ثلاث خصائص. لاحظ أن الخاصية engine هي أيضا كائن له خصائصه.</p>

<pre class="brush: js">var myHonda = {color: 'red', wheels: 4, engine: {cylinders: 4, size: 2.2}};
</pre>

<p dir="rtl">يمكنك أيضا استخدام مهيئات الكائن لإنشاء المصفوفات. شاهد <a href="/en-US/docs/Web/JavaScript/Guide/Grammar_and_types#Array_literals">array literals</a>.</p>

<h3 dir="rtl" id="استخدام_ال_constructor_function">استخدام ال constructor function</h3>

<p dir="rtl">كبديل، يمكنك إنشاء كائن مع هاتين الخطوتين:</p>

<ol dir="rtl">
 <li>تعريف نوع الكائن بانشاء constructor function. هناك عرف متفق عليه، وهو كتابة الحرف الاول من اسم الكائن بحروف كبيرة Capital.  بهدف تمييزه عن باقي الاسماء.</li>
 <li>انشاء مثيل/نسخة للكائن بواسطة الكلمة المحجوزة new.</li>
</ol>

<p dir="rtl">لتحديد نوع الكائن، سنقوم بإنشاء دالة لتحديد اسم لهذا الكائن وخصائصه، ووظائفه، على سبيل المثال، فرضا انك تريد انشاء كائن للسيارات. سيتوجب عليك تسميته ب Car، وايضا يجب ان يمتلك خصائص مثل  make، model, و year.   للقيام بذلك، سيتوجب عليك انشاء الدالة التالية:</p>

<pre class="brush: js">function Car(make, model, year) {
  this.make = make;
  this.model = model;
  this.year = year;
}
</pre>

<p dir="rtl">لاحظ اننا استخدمنا this لتعيين قيم لخصائص الكائن استناداً إلى القيم التي سيتم تمريرها إلى بارامترات الدالة.</p>

<p dir="rtl">الآن يمكنك إنشاء كائن باسم mycar على النحو التالي:</p>

<pre class="brush: js">var mycar = new Car('Eagle', 'Talon TSi', 1993);
</pre>

<p dir="rtl">تقوم هذه التعليمة البرمجية بانشاء mycar، واسناد القيم المحددة لخصائصه. وبالتالي قيمة  mycar.make هي قيمة نصية "Eagle"، و mycar.year قيمة رقمية 1993، وهلم جرا.</p>

<p dir="rtl">يمكنك إنشاء اي عدد من الكائنات من النوع Car واستدعاؤها عن طريق الكلمة المحجوزة new. مثال:</p>

<pre class="brush: js">var kenscar = new Car('Nissan', '300ZX', 1992);
var vpgscar = new Car('Mazda', 'Miata', 1990);
</pre>

<p dir="rtl">يمكن للكائن ان يحتوي على خاصية تكون هي نفسها كائن اخر، على سبيل المثال، فرضا انك تريد انشاء كائن تحت الاسم person كما يلي:</p>

<pre class="brush: js">function Person(name, age, sex) {
  this.name = name;
  this.age = age;
  this.sex = sex;
}
</pre>

<p dir="rtl">ومن ثم إنشاء مثيلين/نسختين للكائن person كما يلي:</p>

<pre class="brush: js">var rand = new Person('Rand McKinnon', 33, 'M');
var ken = new Person('Ken Jones', 39, 'M');
</pre>

<p dir="rtl">ثم، يمكنك إعادة تعريف ال Car لتضمين الخاصية owner التي ستمتلك الكائن person كما يلي:</p>

<pre class="brush: js">function Car(make, model, year, owner) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.owner = owner;
}
</pre>

<p dir="rtl">بعد ذلك يمكنك إنشاء مثيلات/نسخ للكائنات الجديدة، باستخدام ما يلي:</p>

<pre class="brush: js">var car1 = new Car('Eagle', 'Talon TSi', 1993, rand);
var car2 = new Car('Nissan', '300ZX', 1992, ken);
</pre>

<p dir="rtl">لاحظ أنه بدلاً من تمرير سلسلة نصية أو قيمة رقمية عند إنشاء الكائنات الجديدة، في البيانات الواردة أعلاه تم تمرير الكائنان rand و ken كبرامترات خاصة بال owner. إذا كنت ترغب في معرفة الاسم الخاص ب car2، يمكنك الوصول إلى الخاصية بالطريقة التالية:</p>

<pre class="brush: js">car2.owner.name
</pre>

<p dir="rtl">يمكنك  إضافة خاصية جديدة لكائن منشأ مسبقاً. على سبيل المثال، كما في التعليمة البرمجية التالية:</p>

<pre class="brush: js">car1.color = 'black';
</pre>

<p dir="rtl">قمنا باضافة الخاصية color لل car1، وقمنا بتعيين القيمة "black." لها، ومع ذالك فهذا لن يجعلها متاحة لجميع الكائنات من النوع Car. لإضافة خاصية جديدة لكافة الكائنات من نفس النوع Car، يتوجب عليك اضافة هذه الخاصية لل constructor. الخاص بالكائن Car.</p>

<h3 dir="rtl" id="استخدام_الوظيفة_Object.create">استخدام الوظيفة Object.create</h3>

<p dir="rtl">يمكن أيضا إنشاء كائنات باستخدام الوظيفة {{jsxref("()Object.create")}} هذه الوظيفة يمكن أن تكون مفيدة للغاية، لأنها تتيح لك أن تختار ال prototype object للكائن الذي تريد إنشاء، دون الحاجة إلى تعريف ال constructor function (بواسطة new).</p>

<pre class="brush: js">// Animal properties and method encapsulation
var Animal = {
  type: 'Invertebrates', // Default value of properties
  displayType: function() {  // Method which will display type of Animal
    console.log(this.type);
  }
};

// Create new animal type called animal1
var animal1 = Object.create(Animal);
animal1.displayType(); // Output:Invertebrates

// Create new animal type called Fishes
var fish = Object.create(Animal);
fish.type = 'Fishes';
fish.displayType(); // Output:Fishes</pre>

<h2 dir="rtl" id="الوراثة">الوراثة</h2>

<p dir="rtl">في جافا سكريبت جميع الكائنات ترث من كائن واحد على الأقل. الكائن الذي ترث منه يسمى prototype، والخصائص الموروثة يمكن العثور عليها في ال prototype object لل constructor. شاهد <a href="/en-US/docs/Web/JavaScript/Inheritance_and_the_prototype_chain">Inheritance and the prototype chain</a>  لمزيد من المعلومات.</p>

<h2 dir="rtl" id="فهرسة_خصائص_الكائن">فهرسة خصائص الكائن</h2>

<p dir="rtl">يمكنك الاشارة/الوصول إلى خاصية الكائن إما عن طريق الاسم الخاص بها أو عن طريق المؤشر الترتيبي لها (index). إذا قمت في البداية بتعريف خاصية باسمها، سيتوجب عليك دائما الاشارة اليها باسمها، وكذالك اذا قمت في البداية بتعريف خاصية بمؤشرها الترتيبي، ايضا سيتوجب عليك الاشارة اليها بمؤشرها الترتيبي.</p>

<p dir="rtl">ينطبق هذا الشرط عند إنشاء الكائن وخصائصه داخل ال constructor (كما فعلنا سابقا مع  الكائن من النوع Car) وكذالك عند تحديد خصائص فردية بشكل واضح (على سبيل المثال، "myCar.color = "red). اذا قمت في البداية بتعريف خاصية بمؤشرها الترتيبي، مثل "myCar[5] = "25 mpg، وتريد بعد ذالك الوصول اليها سيتوجب عليك استخدام المؤشر الترتيبي على هذا النحو  myCar[5].</p>

<p dir="rtl">والاستثناء لهذه القاعدة هي كائنات ال HTML، مثل forms array. يمكنك الاشارة دائما إلى الكائنات في هذه المصفوفات إما عن طريق مؤشرهم الترتيبي (حسب وجودها في الوثيقة) او عن طريق اسمائها (إذا كانت معرفة). فمثلا، اذا كان الوسم الثاني &lt;FORM&gt; في الوثيقة له السمة (attribute ) باسم "myForm"، يمكنك الاشارة الى هذا الفورم ب document.forms[1] او ب document.forms["myForm"] او ب document.forms.myForm.</p>

<h2 dir="rtl" id="التحكم_في_خصائص_الكائن">التحكم في خصائص الكائن</h2>

<p dir="rtl">يمكنك إضافة خاصية إلى كائن محدد سابقا باستخدام الخاصية prototype. هذا النمط سيجعل هذه الخاصية متاحة لكافة الكائنات من النوع المحدد، بدلاً من تحديدها لمثيل واحد فقط. التعليمة البرمجية التالية تضيف الخاصية color الى جميع الكائنات من نوع Car، وبعد ذالك تقوم بتعيين القيمة الجديدة للخاصية color الخاصة بالكائن car1.</p>

<pre class="brush: js">Car.prototype.color = null;
car1.color = 'black';
</pre>

<p dir="rtl">شاهد  <a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function/prototype" title="en-US/docs/JavaScript/Reference/Global Objects/Function/prototype"><code>prototype</code> property</a>  لل Function object وايضا <a href="/en-US/docs/Web/JavaScript/Reference">JavaScript reference</a> لمزيد من المعلومات.</p>

<h2 dir="rtl" id="تعريف_الوظائف">تعريف الوظائف</h2>

<p dir="rtl">الوظيفة هي دالة مرتبطة مع الكائن، أو، ببساطة،  هي خاصية في الكائن قيمتها دالة، يتم تعريف الوظيفة بنفس الطريقة التي يتم بها تعريف الدالة العادية، باستثناء ان هذه الاخيرة يجب أن يتم تعيينها كخاصية لكائن. شاهد ايضا <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">method definitions</a> لمزيد من المعلومات، وكمثال على ما تم ذكره:</p>

<pre class="brush: js">objectName.methodname = function_name;

var myObj = {
  myMethod: function(params) {
    // ...do something
  }

  // OR THIS WORKS TOO

  myOtherMethod(params) {
    // ...do something else
  }
};
</pre>

<p dir="rtl">حيث ان ال objectName كائن موجود، وال methodname هو الاسم المعين إلى الوظيفة، و function_name هو اسم الدالة.</p>

<p dir="rtl">ثم يمكنك استدعاء الوظيفة في سياق الكائن كما يلي:</p>

<pre class="brush: js">object.methodname(params);
</pre>

<p dir="rtl">يمكنك تعريف وظائف الكائن باستدعاء وظيفة معرفة في constructor الكائن. على سبيل المثال، يمكنك القيام بتعريف الدالة التي من شأنها تهيئة وعرض خصائص الكائن Car المعرف مسبقا، على سبيل المثال:</p>

<pre class="brush: js">function displayCar() {
  var result = 'A Beautiful ' + this.year + ' ' + this.make
    + ' ' + this.model;
  pretty_print(result);
}
</pre>

<p dir="rtl">يمكنك استخدام الدالة pretty_print لاظهار الناتج على شكل نص افقي، تذكر ايضا على ان الكلمة المحجوزة this ستشير الى السياق الذي تنتمي اليه الدالة نفسها وفي هذه الحالة هو ال constructur Car</p>

<p dir="rtl"> يمكننا بعد ذالك تعيين هذه الدالة كوظيفة في ال constructeur Car على النحو التالي:</p>

<pre class="brush: js">this.displayCar = displayCar;
</pre>

<p dir="rtl">التعليمة البرمجية النهائية:</p>

<pre class="brush: js">function Car(make, model, year, owner) {
  this.make = make;
  this.model = model;
  this.year = year;
  this.owner = owner;
  this.displayCar = displayCar;
}
</pre>

<p dir="rtl">الان يمكنك استدعاء الوظيفة displayCar لكلا الكائنين على النحو التالي:</p>

<pre class="brush: js">car1.displayCar();
car2.displayCar();
</pre>

<h2 dir="rtl" id="استخدام_this_كمرجع_للكائنات">استخدام this كمرجع للكائنات</h2>

<p dir="rtl">جافاسكريبت لديها الكلمة المحجوزة لها <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/this">this</a></code>، يمكنك استخدامها مع الوظائف للرجوع/الاشارة إلى الكائن الحالي. على سبيل المثال، لنفترض ان لديك دالة تسمى validate تقوم بالتحقق من صحة المدخلات:</p>

<pre class="brush: js">function validate(obj, lowval, hival) {
  if ((obj.value &lt; lowval) || (obj.value &gt; hival)) {
    alert('Invalid Value!');
  }
}
</pre>

<p dir="rtl">يمكن استدعاء هذه الدالة  عن طريق معالج الحدث onchange، وستشير الكلمة المحجوزة this الى العنصر المتواجدة به (تنفيذ الدالة على هذا العنصر). كما في المثال التالي:</p>

<pre class="brush: html">&lt;input type="text" name="age" size="3"
  onChange="validate(this, 18, 99)"&gt;
</pre>

<p dir="rtl">بشكل عام this تشير الى الكائن الذي يطلب الوظيفة.</p>

<p dir="rtl">يمكن ايضا استخدام this مع معالج الحدث بشكل مباشر، كما في المثال التالي:</p>

<pre class="brush: html">&lt;form name="myForm"&gt;
&lt;p&gt;&lt;label&gt;Form name:&lt;input type="text" name="text1" value="Beluga"&gt;&lt;/label&gt;
&lt;p&gt;&lt;input name="button1" type="button" value="Show Form Name"
     onclick="this.form.text1.value = this.form.name"&gt;
&lt;/p&gt;
&lt;/form&gt;</pre>

<h2 id="Defining_getters_and_setters">Defining getters and setters</h2>

<p dir="rtl"> <a href="/en-US/docs/Web/JavaScript/Reference/Functions/get">getter</a> هي الوظيفة التي تقوم بجلب قيمة خاصية معينة. <a href="/en-US/docs/Web/JavaScript/Reference/Functions/set">setter</a> هي الوظيفة التي تقوم بتعيين قيمة لخاصية معينة. يمكنك تعيينها سواء للكائنات الاساسية المعرفة مسبقا أو الى الكائنات المعرف من قبل المستخدم والتي تدعم إضافة خصائص جديدة. وتستخدم مع ال object literal.</p>

<p dir="rtl">يبين المثال التالي كيفية انشاء getters و setters من طرف المستخدم :</p>

<pre class="brush: js">var o = {
  a: 7,
  get b() {
    return this.a + 1;
  },
  set c(x) {
    this.a = x / 2;
  }
};

console.log(o.a); // 7
console.log(o.b); // 8
o.c = 50;
console.log(o.a); // 25
</pre>

<p dir="rtl">خصائص الكائن هي :</p>

<ul dir="rtl">
 <li><code>o.a</code> — a number</li>
 <li><code>o.b</code> — a getter سيعود ب <code>o.a</code> زائد 1</li>
 <li><code>o.c</code> — a setter سيقوم بتعيين القيمة <code>o.a</code> بنصف القيمة الاتية من <code>o.c</code></li>
</ul>

<p dir="rtl">يمكنك استخدام  getters و setters مع الوظائف المنشاة مسبقا، لتحقيق ذالك يمكننا استخدام الوظيفة <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty" title="en-US/docs/Core JavaScript 1.5 Reference/Global
Objects/Object/defineProperty">Object.defineProperty</a></code> او الوظيفة القديمة <code><a href="/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineGetter" title="en-US/docs/Core JavaScript 1.5 Reference/Global
Objects/Object/defineGetter">Object.prototype.__defineGetter__</a></code></p>

<p dir="rtl">يبين الكود التالي كيف ان  getters و setters بامكانها ان ترث ال  {{jsxref("Date")}} prototype لاضافة الخاصية year الى جميع ال instances الخاص بالكائن Date المنشا مسبقا، ولهذا سنقوم باستخدام بعض الوظائف الخاصة ب Date ك getFullYear و setFullYear :</p>

<pre class="brush: js">var d = Date.prototype;
Object.defineProperty(d, 'year', {
  get: function() { return this.getFullYear(); },
  set: function(y) { this.setFullYear(y); }
});
</pre>

<p dir="rtl">تبين التعليمة البرمجية التالية كيفية استخدام الخاصية year الجديدة التي تم انشاؤها عن طريق getters و setters:</p>

<pre class="brush: js">var now = new Date();
console.log(now.year); // 2000
now.year = 2001; // 987617605170
console.log(now);
// Wed Apr 18 11:13:25 GMT-0700 (Pacific Daylight Time) 2001
</pre>

<p dir="rtl">بصفة عامة،  getters و setters يمكن ان تكون:</p>

<ul dir="rtl">
 <li>معرفة باستخدام <a href="#استخدام object initializers">object initializers</a>,  او</li>
 <li>ان تضاف في وقت لاحق إلى أي كائن في أي وقت باستخدام   getters او setters.</li>
</ul>

<p dir="rtl">عندما سنقوم بانشاء getters و setters باستخدام ال استخدام <a href="#استخدام object initializers">object initializers</a> كل ما عليك القيام به هو البذء بانشاء الوظيفة getter اولا ومن تم تعريفها ب get وتليها الوظيفة setter وتعريفها ب set، وبالطبع، الوظيفة getter لا تحتاج الى اي باراميتر، فيما ستحتاج الوظيفة setter لبراميتر واحد وهو القيمة الجديدة ل set. فعلى سبيل المثال:</p>

<pre class="brush: js">var o = {
  a: 7,
  get b() { return this.a + 1; },
  set c(x) { this.a = x / 2; }
};
</pre>

<p dir="rtl">getters او setters. يمكن أيضا أن تضاف إلى كائن ما في أي وقت بعد انشائه باستخدام الوظيفة Object.defineProperties، البراميتر الأول لهذه الوظيفة هو الكائن الذي تريد انشاء ال getter او setter له. البراميتر الثاني عبارة عن كائن يمثل الخصائص التي ستضاف الى الكائن الهدف ويتكون من مفتاح الخاصية، وهو اسم ال  getter او ال setter، وقيمة الخاصية، وهي عبارة عن كائن لتعريف وظائف ال  getter او ال setter. لدينا هنا نفس المثال السابق يبين بجلاء ما تحدثنا عنه:</p>

<pre class="brush: js">var o = { a: 0 };

Object.defineProperties(o, {
    'b': { get: function() { return this.a + 1; } },
    'c': { set: function(x) { this.a = x / 2; } }
});

o.c = 10; // Runs the setter, which assigns 10 / 2 (5) to the 'a' property
console.log(o.b); // Runs the getter, which yields a + 1 or 6
</pre>

<p dir="rtl">اي من هذه الاساليب هي الانسب ؟<br>
 <span class="short_text" id="result_box" lang="ar"><span>إذا ذهبت</span> <span>بالفعل ل</span><span>مهيئ</span> <span>الكائن</span> <span>عند تعريف</span> <span>ال</span></span> prototype فانت بحاجة الى الاسلوب الاول هذا الاسلوب محكم وبسيط. ومع ذالك، اذا كنت تنوي اضافة  getters و setters لاحقا بسبب انك لا تريد انشاء prototype او كائن معين سيكون افضل خيار هو الخيار الثاني. الخيار الثاني ربما يكون أفضل ويمثل الطابع الدينامي للجافا سكريبت، ولكن  يمكن ان يجعل الكود صعب القراءة والفهم.</p>

<h2 dir="rtl" id="حذف_الخصائص">حذف الخصائص</h2>

<p dir="rtl">يمكنك حذف الخصائص الغير موروثة باستخدام الكلمة المحجوزة <code><a href="/en-US/docs/Web/JavaScript/Reference/Operators/delete">delete</a></code> التعليمة البرمجية التالية توضح كيف يتم ذالك:</p>

<pre class="brush: js">// Creates a new object, myobj, with two properties, a and b.
var myobj = new Object;
myobj.a = 5;
myobj.b = 12;

// Removes the a property, leaving myobj with only the b property.
delete myobj.a;
console.log ('a' in myobj); // yields "false"
</pre>

<p dir="rtl">يمكنك ايضا استخدام delete لحذف متغير عام، شرط ان لا يكون هذا المتغير معرف بواسطة الكلمة المحجوزة var.</p>

<pre class="brush: js">g = 17;
delete g;
</pre>

<h2 dir="rtl" id="مقارنة_الكائنات">مقارنة الكائنات</h2>

<p dir="rtl">في جافا سكريبت، الكائنات تعمل كمرجع. لا يمكن المساوات بين كائنين مختلفين، حتى وان كان لديهما نفس القيم لنفس الخصائص. سيكون هناك تكافؤ فقط إذا تم مقارنة كائن بحد ذاته.</p>

<pre class="brush: js">// Two variables, two distinct objects with the same properties
var fruit = {name: 'apple'};
var fruitbear = {name: 'apple'};

fruit == fruitbear; // return false
fruit === fruitbear; // return false</pre>

<pre class="brush: js">// Two variables, a single object
var fruit = {name: 'apple'};
var fruitbear = fruit;  // assign fruit object reference to fruitbear

// here fruit and fruitbear are pointing to same object
fruit == fruitbear; // return true
fruit === fruitbear; // return true
</pre>

<pre class="brush: js">fruit.name = 'grape';
console.log(fruitbear);    // yields { name: "grape" } instead of { name: "apple" }
</pre>

<p dir="rtl">لمزيد من المعلومات حول عوامل المقارنة، شاهد <a href="/en-US/docs/Web/JavaScript/Reference/Operators/Comparison_Operators">Comparison operators</a>.</p>
</div>

<h2 id="See_also">See also</h2>

<ul>
 <li>To dive deeper, read about the <a href="/en-US/docs/Web/JavaScript/Guide/Details_of_the_Object_Model">details of javaScript's objects model</a>.</li>
 <li>To learn about ECMAScript 2015 classes (a new way to create objects), read the <a href="/en-US/docs/Web/JavaScript/Reference/Classes">JavaScript classes</a> chapter.</li>
</ul>

<p>{{PreviousNext("Web/JavaScript/Guide/Regular_Expressions", "Web/JavaScript/Guide/Details_of_the_Object_Model")}}</p>