أولاً ، مشاركة أمثلة من ميراث النموذج الأولي JS للرجوع إليه. المحتوى المحدد كما يلي
1. ميراث النموذج الأولي JS
<! doctype html> <html> <head> <meta charset = "utf-8"> <title> الميراث النموذجي js </title> </head> <body> <!-أولي-الوراثة-> <script type = "text/javascript" {} ؛ // هذه الجملة هي جوهر ميراث النموذج الأولي. كائن النموذج الأولي للدالة هو الكائن الحرفي _f.prototype = obj ؛ إرجاع جديد _f ؛ }. }} // لا حاجة لتحديد فئة فرعية للشخص ، ما عليك سوى إجراء استنساخ var cat = clone (Animal) ؛ // يمكنك الحصول مباشرة على القيمة الافتراضية التي يوفرها الشخص ، أو يمكنك إضافة أو تعديل السمات والأساليب Console.log (cat.eat ()) ؛ cat.somthing = 'Orange' ؛ console.log (cat.eat ()) ؛ // إعلان الفئة الفرعية وأداء استنساخ var شخص ما = استنساخ (CAT) ؛ </script> </body> </html>2. مبدأ العمل في ميراث النموذج الأولي JavaScript
من المعروف جيدًا أن JavaScript يتبنى ميراث النموذج الأولي ، ولكن نظرًا لأنه يوفر حالة واحدة فقط من التنفيذ ، فإن المشغل الجديد ، افتراضيًا ، يكون تفسيره مربكًا دائمًا. دعونا نوضح ماهية الميراث النموذج الأولي وكيفية استخدام ميراث النموذج الأولي في جافا سكريبت.
تعريف ميراث النموذج الأولي
عندما تقرأ التفسير حول ميراث النموذج الأولي JS ، فغالبًا ما ترى النص التالي:
عند البحث عن خصائص كائن ، ستجتاز JavaScript سلسلة النموذج الأولي لأعلى حتى يتم العثور على سمة الاسم المحدد. - من حديقة جافا سكريبت السرية
تستخدم معظم تطبيقات JavaScript سمة __proto__ لتمثيل سلسلة النموذج الأولي للكائن. في هذه المقالة ، سنرى الفرق بين __proto__ والنموذج الأولي.
ملاحظة: __proto__ هو استخدام غير رسمي لا ينبغي أن يظهر في الكود الخاص بك. هنا نستخدمه فقط لشرح كيفية عمل الميراث النموذج الأولي JavaScript.
يوضح الرمز التالي كيف يبحث محرك JS عن الخصائص:
وظيفة getProperty (obj ، prop) {if (obj.hasownproperty (prop)) إرجاع OBJدعنا نعطي مثالاً شائعاً: النقطة ثنائية الأبعاد لها إحداثيات ثنائية الأبعاد XY ، والتي تشبه وجود طريقة طباعة.
باستخدام تعريف ميراث النموذج الأولي الذي ذكرناه من قبل ، نقوم بإنشاء نقطة كائن بثلاث خصائص: X و Y و Print. من أجل إنشاء نقطة ثنائية الأبعاد جديدة ، نحتاج إلى إنشاء كائن جديد ، بحيث تكون نقاط السمة __proto__ إلى نقطة:
var point = {x: 0 ، y: 0 ، print: function () {console.log (this.x ، this.y) ؛ }} ؛ var p = {x: 10 ، y: 20 ، __proto__: point} ؛ p.print () ؛ // 10 20جافا سكريبت ميراث النموذج الأولي الغريب
ما يربك أنه لا أحد يعلم ميراث النموذج الأولي سيعطي مثل هذا الرمز ، ولكنه سيعطي الكود التالي:
نقطة الوظيفة (x ، y) {this.x = x ؛ this.y = y ؛ } point.prototype = {print: function () {console.log (this.x ، this.y) ؛ }} ؛ var p = نقطة جديدة (10 ، 20) ؛ p.print () ؛ // 10 20هذا يختلف عما قلته. تصبح النقطة هنا وظيفة ، وهناك أيضًا سمة نموذج أولي ، وهناك مشغل جديد. ما الذي يحدث مع هذا؟
كيف يعمل المشغل الجديد
أراد المبدع Brendan Eich جعل JS لا يختلف كثيرًا عن لغات البرمجة التقليدية الموجهة للكائنات ، مثل Java و C ++. في هذه اللغات ، نستخدم المشغل الجديد لإنشاء كائن جديد إلى الفصل. لذلك كتب مشغلًا جديدًا في JS.
يوجد مفهوم مُنشئ في C ++ لتهيئة خصائص المثيل ، لذلك يجب أن يستهدف المشغل الجديد وظائف.
نحن بحاجة إلى وضع طريقة الكائن في مكان واحد. نظرًا لأننا نستخدم لغة النموذج الأولي ، سنضعها في خصائص النموذج الأولي للوظيفة.
يقبل المشغل الجديد وظيفة f ومعلماتها: F (الوسيطات ...). تنقسم هذه العملية إلى ثلاث خطوات:
إنشاء مثيل للفصل. هذه الخطوة هي تعيين خاصية __proto__ لكائن فارغ على النمط f.prototype.
تهيئة المثيل. يتم تمرير الوظيفة F في المعلمة ويدعوها ، والكلمة الرئيسية التي يتم تعيينها على هذا المثيل.
إرجاع المثيل.
الآن بعد أن عرفنا كيف تعمل جديدة ، يمكننا تنفيذها في رمز JS:
وظيفة جديدة (f) {var n = {'__proto__': f.prototype} ؛ /*الخطوة 1*/ return function () {f.apply (n ، الوسائط) ؛ /*الخطوة 2*/ return n ؛ /*الخطوة 3*/} ؛ }مثال صغير على وضع عمله:
نقطة الوظيفة (x ، y) {this.x = x ؛ this.y = y ؛ } point.prototype = {print: function () {console.log (this.x ، this.y) ؛ }} ؛ var p1 = نقطة جديدة (10 ، 20) ؛ p1.print () ؛ // 10 20 console.log (p1 مثيل من نقطة) ؛ // true var p2 = new (point) (10 ، 20) ؛ p2.print () ؛ // 10 20 console.log (P2 مثيل من نقطة) ؛ // حقيقيميراث النموذج الأولي الحقيقي في جافا سكريبت
تتيح لنا مواصفات JS's ECMA فقط استخدام المشغل الجديد للميراث النموذجي. لكن السيد دوغلاس كروكفورد اكتشف وسيلة لاستخدام جديد لتحقيق ميراث النموذج الأولي الحقيقي! لقد كتب وظيفة الكائن.
object.create = function (parent) {function f () {} f.prototype = parent ؛ إرجاع جديد f () ؛ } ؛هذا يبدو غريبًا ، لكنه موجز تمامًا: إنه يخلق كائنًا جديدًا ونماذج أولية لأي قيمة تريد تعيينها. إذا سمحنا __proto__ ، فيمكننا أيضًا كتابة هذا:
object.create = function (parent) {return {'__proto__': parent} ؛ } ؛يتيح الرمز التالي وجهة نظرنا إلى اعتماد ميراث النموذج الأولي الحقيقي:
var point = {x: 0 ، y: 0 ، print: function () {console.log (this.x ، this.y) ؛ }} ؛ var p = object.create (point) ؛ px = 10 ؛ PY = 20 ؛ p.print () ؛ // 10 20ختاماً
لقد تعلمنا ماهية ميراث النموذج الأولي JS وكيف يمكن لـ JS تنفيذها بطريقة محددة. ومع ذلك ، فإن استخدام ميراث النموذج الأولي الحقيقي (مثل object.create و __proto__) لا يزال لديه العيوب التالية:
النقص القياسي: __ proto__ ليس استخدامًا قياسيًا ، أو حتى استخدام الرفض. في الوقت نفسه ، تختلف الكائن الأصلي.
التحسين الضعيف: سواء كان كائنًا محليًا أو مخصصًا ، فإن أدائه أقل بكثير من أداء الجديد ، والأولى بطيئة تصل إلى 10 مرات من الأبطأ من الأخير.
ما سبق هو كل شيء عن هذا المقال ، آمل أن يكون مفيدًا لتعلم الجميع.