شرح مفصل لستة طرق لتحديد الفصول بواسطة JS

في التنمية الأمامية ، من الضروري في كثير من الأحيان تحديد فصول JS. لذلك في JavaScript ، هناك عدة طرق لتحديد الفصول ، وما هي الاختلافات؟ تشرح هذه المقالة الطرق الست التالية لتحديد فصول JS (وصف الحالة):

1. طريقة المصنع

 وظيفة car () {var ocar = كائن جديد ؛ ocar.color = "blue" ؛ ocar.doors = 4 ؛ ocar.showcolor = function () {document.write (this.color)} ؛ return ocar ؛} var car1 = car () ؛ var car2 = car () ؛

عند استدعاء هذه الوظيفة ، يتم إنشاء كائن جديد ويتم تعيين جميع الخصائص والأساليب. استخدم هذه الوظيفة لإنشاء كائنين مع نفس الخصائص بالضبط.

بالطبع ، يمكنك تعديل هذه الطريقة عن طريق تمرير المعلمات إليها.

 وظيفة السيارة (اللون ، الباب) {var ocar = كائن جديد ؛ ocar.color = color ؛ ocar.doors = door ؛ ocar.showcolor = function () {document.write (this.color)} ؛ return ocar ؛} var car1 = car ("red" ، 4) var car2 = "blue" ، 4) // الإخراج: "أحمر" car2.showcolor () // الإخراج: "الأزرق"

يمكنك الآن الحصول على كائنات ذات قيم مختلفة عن طريق تمرير معلمات مختلفة إلى الوظيفة.

في المثال السابق ، في كل مرة يتم فيها تسمى CAR CAR () ، يتم إنشاء ShowColor () ، مما يعني أن كل كائن له طريقة العرض الخاصة به ().

ولكن في الواقع ، يشارك كل كائن نفس الوظيفة. على الرغم من أنه يمكن تعريف الطريقة خارج الوظيفة ، ثم عن طريق توجيه خصائص الوظيفة إلى الطريقة.

 الوظيفة ShowColor () {Alert (this.color) ؛} وظيفة car () {var ocar = new Object () ؛ ocar.color = color ؛ ocar.doors = door ؛ ocar.showcolor = showcolor ؛ return ocar ؛}

ولكن هذا لا يبدو وكأنه طريقة وظيفة.

2. طريقة المنشئ

طريقة المنشئ بسيطة مثل طريقة المصنع ، كما هو موضح أدناه:

 وظيفة CAR (اللون ، الباب) {this.color = color ؛ this.doors = door ؛ this.showcolor = function () {Alert (this.color)} ؛} var car1 = new car ("Red" ، 4) ؛ var car2 = new Car ("blue" ، 4) ؛

يمكنك أن ترى أن طريقة المنشئ لا تنشئ كائنات داخل الوظيفة ، والكلمة الرئيسية التي يتم استخدامها. لأنه تم إنشاء كائن عند الاتصال بالمقدم ، ويمكن استخدام هذا فقط للوصول إلى خصائص الكائن داخل الوظيفة.

استخدم الآن جديدًا لإنشاء كائنات ، يبدو هكذا! لكنه نفس المصنع. كل مكالمة تنشئ طريقة خاصة بها للكائن.

3. طريقة النموذج الأولي

تستفيد هذه الطريقة من سمة النموذج الأولي للكائن. أولاً ، قم بإنشاء اسم الفصل مع وظيفة فارغة ، ثم يتم تعيين جميع السمات والأساليب إلى سمة النموذج الأولي.

 وظيفة car () {} car.prototype.color = "red" ؛ car.prototype.doors = 4 ؛ car.prototype.showcolor = function () {Alert (this.color) ؛} var car1 = new car () ؛ var car2 = new car () ؛

في هذا الرمز ، يتم تعريف وظيفة فارغة لأول مرة ، ثم يتم تعريف خصائص الكائن من خلال سمة النموذج الأولي. عندما يتم استدعاء هذه الوظيفة ، سيتم تعيين جميع خصائص النموذج الأولي للكائن المراد إنشاؤه على الفور. جميع الكائنات في مخزن الوظائف هذا على الرسوم () ، والتي يبدو أن النحيل تنتمي إلى نفس الكائن.

ومع ذلك ، لا تحتوي هذه الوظيفة على معلمات ، ولا يمكن تهيئة السمة عن طريق تمرير المعلمات. يجب تغيير القيمة الافتراضية للسمة بعد إنشاء الكائن.

مشكلة خطيرة للغاية في طريقة النموذج الأولي هي أنه عندما تشير السمة إلى كائن ، مثل الصفيف.

 وظيفة car () {} car.prototype.color = "red" ؛ car.prototype.doors = 4 ؛ car.prototype.arr = new array ("A" ، "B") ؛ Car () ؛ car1.arr.push ("CC") ؛ Alert (car1.arr) ؛ //output:aa،bb،cclert(car2.arr) ؛ // الإخراج: AA ، BB ، CC

هنا ، نظرًا للقيمة المرجعية للمصفوفة ، تشير كلا كلا من السيارة إلى نفس الصفيف ، لذلك عند إضافة القيمة في CAR1 ، يمكنك أيضًا رؤيتها في CAR2.

الاتحاد هي طريقة يمكن أن تنشئ كائنات مثل لغات البرمجة الأخرى باستخدام النموذج المُنشئ/النموذج الأولي. إنها طريقة تستخدم المُنشئين لتحديد الخواص غير الوظيفية للكائنات وتستخدم النماذج الأولية لتحديد الكائنات.

 وظيفة وظيفة (لون ، باب) {this.color = color ؛ this.doors = door ؛ this.arr = new array ("aa" ، "bb") ؛} car.prototype.showcolor () {Alert (this.color) ؛ Car ("Blue" ، 4) ؛ Car1.arr.push ("CC") ؛ Alert (car1.arr) ؛ //output:aa،bb،ccalert(car2.arr) ؛ // الإخراج: AA ، BB

5. طريقة النموذج الأولي الديناميكي

تشبه طريقة النموذج الأولي الديناميكي طريقة المنشئ/النموذج الأولي المختلط. الفرق الوحيد هو الموضع المعطى لطريقة الكائن.

 وظيفة السيارة (اللون ، الباب) {this.color = color ؛ this.doors = door ؛ this.arr = new array ("aa" ، "bb") ؛ if (typeof car._initialized == "undefined")

تتمثل طريقة النموذج الأولي الديناميكي في استخدام علامة لتحديد ما إذا كان النموذج الأولي قد تم تعيين طريقة. هذا يضمن إنشاء الطريقة مرة واحدة فقط

6. طريقة المصنع المختلط

يخلق معلمه الغرض مُنشئًا مزيفًا يعيد فقط حالات جديدة لكائن آخر.

 وظيفة car () {var ocar = new Object () ؛ ocar.color = "red" ؛ ocar.doors = 4 ؛ ocar.showcolor = function () {Alert (this.color)} ؛ return ocar ؛}

على عكس طريقة المصنع ، تستخدم هذه الطريقة المشغل الجديد.

ما ورد أعلاه هي جميع طرق إنشاء الكائنات. الطريقة الأكثر استخدامًا على نطاق واسع هي طريقة المنشئ/النموذج الأولي الهجين ، وطريقة النموذج الأولي الديناميكي تحظى بشعبية كبيرة أيضًا. تعادل وظيفيا لطريقة المنشئ/النموذج الأولي.

التفسير التفصيلي أعلاه للطرق الست لتحديد فصول JS هو كل المحتوى الذي أشاركه معك. آمل أن تتمكن من إعطائك مرجعًا وآمل أن تتمكن من دعم wulin.com أكثر.