Have an account? Sign in
Login  Register  Facebook
Web Development School
This Page is Under Construction! - If You Want To Help Please Send your CV - Advanced Web Core (BETA)
Quick Table of Contents
[Edit] بعض المهارات الإضافية في إنشاء الكائنات.
سنتعلم في هذا الدرس بعض المهارات الإضافية بالنسبة لإنشاء الكائن الديناميكي :
  • إنشاء الكائنات المتداخلة .
  • طريقة أخرى لإضافة الـ methods في الكائن.
  • النموزج Prototype.
إنشاء الكائنات المتداخلة. و هو يعني أن تضع كائن كخاصية داخل كائن آخر كما بالمثال :
الكائنات المتداخلة 
<html>

<script language="JavaScript">

  function student(name, age, grade, father, mother)
{
this.name = name
this.age = age
this.grade = grade
this.parents = new parents(father, mother)
}
function parents(father, mother)
{
this.father = father
this.mother = mother
}
var student1 = new student("Ahmed", 16, 85, "Mohamed", "Asmaa")
 document.write(student1.name+"<br>")
 document.write(student1.age+"<br>")
 document.write(student1.grade+"<br>")
 document.write(student1.parents.father+"<br>")
 document.write(student1.parents.mother +"<br>")
</script>

</html>

Try it yourself »Click on the "Try it yourself" button to see how it works

  • في الكود الذي أمامك قمنا بتعريف كائنين هما student و parents .
  • في الكائن student قمنا بتعريف أربع خصائص name و age و grade و parents .
  • في الكائن parents قمنا بتعريف خاصيتين father و mother .
  • إذا نظرت للخاصية الرابعة في الكائن student و هي parents ستجد أنها موضوع لها القيمة new parents(father, mother) و التي هي عبارة عن إنشاء مثيل من الكائن parents و هذا يعني أن هذه الخاصية سوف يوضع فيها هذا المثيل أي أنها ستكون قيمتها عبارة عن كائن إستاتيكي مأخوذ من الكائن parents .
  • بعد ذلك قمنا بعمل مثيل student1 من الكائن student 
    • var student1 = new student("Ahmed", 16, 85, "Mohamed", "Asmaa")
    بعد إنشاء المثيل student1 نقوم بطبع قيم الخصائص من خلال هذه السطور 
     document.write(student1.name+"<br>")
 document.write(student1.age+"<br>")
 document.write(student1.grade+"<br>")
 document.write(student1.parents.father+"<br>")
 document.write(student1.parents.mother +"<br>")
  • لاحظ في آخر سطرين و اللذين فيهما يتم عرض خصائص من التي توجد داخل الكائن parents و هما mother و father و لأن parents داخل student لذا عندما أردنا أن نصل إلى قيمة الخواص داخله كتبنا في البداية إسم المثيل المأخوذ من student و هو student1 ثم بعد النقطة و ضعنا إسم الكائن parents ثم إسم الخاصية هكذا 
    • student1.parents.father
  • يسمى الكائن student بالكائن الأب أما الكائنات التي توجد داخل الكائن الأب مثل parents تسمى بالكائن الأبن.

الطريقة الأخرى لإضافة الدوال في الكائنات:

بدلا من أن نكتب تعريف الـmethods داخل تعريف الكائن كما فعلنا بالسابق يمكننا أن نعرف الدالة بالخارج و نستخدم إسمها في إضافتها للكائن كما بهذا المثال: 
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
function construct(name, val)
{
this[name] = val
}
function displayStudent()
{
var result = ""
result += this.name + " -- "
result += "a " + this.age + " - year old "
result += this.grade + "% average student.<BR>"
result += this.name + "'s parents -- "
result += this.parents.father + ", " + this.parents.mother
result += ".<BR>"
document.write(result)
}

function student(name, age, grade, father, mother)
{
this.construct = construct
this.display = displayStudent
this.name = name
this.age = age
this.grade = grade
this.parents = new parents(father, mother)
}
function parents(father, mother)
{
this.father = father
this.mother = mother
}
var student1 = new student("Mohamed", 16, 85, "Ahmed", "Samir")
student1.construct("friend", "Ali")
document.write(student1.friend)
document.write("<hr>");
student1.display()
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>

  • في بداية الكود عرفنا دالتين هما construct وdisplayStudent ,دالة construct تقوم بإضافة خاصية جديدة للكائن, أما دالة وdisplayStudent تقوم بعرض البيانات .

  • بعد ذلك لوضع الدوال كـmethods داخل الكائن student و ضعناها بهذه الطريقة 

    • this.construct = construct
this.display = displayStudent

  • بعد إنشاء مثيل student1 يمكننا إستخدام الدوال المعرفة داخل الكائن ,ففي هذا السطر 

    • student1.construct("friend", "Ali")
    من خلال دالة construct أضفنا خاصية جديدة و هي friend و وضعنا قيمتها Ali ثم بعد ذلك قمنا بطباعة الخاصية 
    document.write(student1.friend)

  • أما في هذا السطر 

    • student1.display()
    فقد إستدعينا الدالة display التي قمنا بتعريفها بالطريقة الجديدة .

Prototype

النموزج Prototype : هو عبارة عن خاصية موجودة في أي كائن سواء كان معرف مسبقا في اللغة أو قام المبرمج بتعريفه ,و يمكن من خلال هذه الخاصية Prototype إضافة خواص أو دوال جديدة إلى الكائن كما سيتضح في المثال التالي.
النموزج
<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
var str1 = new String("a"), str2 = new String("b")
function repeat(n, delimiter)
{

var text = ""
var str = this.toString() // make sure the object is string
while (n >= 0)
{
text += str
text += delimiter

n--
}
return text
}
String.prototype.repeat = repeat
// add a repeat() method to

alert(str1.repeat(5, " ; "))
alert(str1)
alert(str2.repeat(7, " "))
alert(str2.repeat(3,"+"))
</SCRIPT>
</HEAD>
<BODY>
</BODY>
</HTML>

Try it yourself »Click on the "Try it yourself" button to see how it works

تعلمنا من قبل أنه عندما تريد إنشاء نص فإنك تقوم بوضع النص بين علامتي تنصيص "" أو '' ثم تضعه في متغير 
var str="text"
هناك طريقة أخرى لإنشاء نص و هي من خلال الكائن String و هي هكذا: 
str=new String("text")
و الفرق بين الطريقة الأولى و الثانية أنك إذا أختبرت نوع البيانات باستخدام typeof str في الأولى سيكون string و في الثانية سيكون object و في الحالتين يمكنك إستخدام جميع الخصائص و الدوال الخاصة بالكائن String . و في المثال ستجد أنه في البداية قمنا بإنشاء نصين بالطريقة الثانية . 
var str1 = new String("a"), str2 = new String("b")
ثم قمنا بتعريف دالة تسمى repeat تقوم بتكرار النص عدد من المرات و التي من خلال الـprototype سنضيفها للكائن String و هذا السطر هو الذي يقوم بهذه المهمة : 
String.prototype.repeat = repeat
و بإضافة الدالة من خلال الprototype للكائن فإنه يمكن إستخدامها مع أي مثيل مأخوذ منه و كما ترى قمنا في المثال بإستخدامها مع str1 و str2 و تظهر أهمية ال prototype في أنه يمكنك من إضافة دوال و خصائص إلى كائنات ديناميكية معرفة مسبقا مثل Date وString.
November 25, 2011