يقدم
تقدم هذه المقالة بشكل أساسي المقالة التالية لنمط إنشاء الكائنات. يمكن أن يؤدي استخدام التقنيات المختلفة إلى تجنب الأخطاء بشكل كبير أو كتابة رمز مبسط للغاية.
النمط 6: السكر بناء جملة الوظيفة
وظيفة بناء الجملة هي امتداد لإضافة طرق (وظائف) بسرعة إلى كائن. هذا يستخدم أساسا خصائص النموذج الأولي. الكود بسيط نسبيا. دعونا نلقي نظرة أولاً على رمز التنفيذ:
نسخة الكود كما يلي:
if (typeof function.prototype.method! == "وظيفة") {
function.prototype.method = function (الاسم ، التنفيذ) {
this.prototype [name] = التنفيذ ؛
إرجاع هذا ؛
} ؛
}
عند تمديد كائن ، يمكنك استخدامه مثل هذا:
نسخة الكود كما يلي:
var person = function (name) {
this.name = name ؛
}
.method ('getName' ،
وظيفة () {
إرجاع هذا.
})
.method ('setName' ، function (name) {
this.name = name ؛
إرجاع هذا ؛
}) ؛
وبهذه الطريقة ، نضيف طريقتين: getName و setName إلى وظيفة الشخص. بعد ذلك ، دعونا نتحقق من النتيجة:
نسخة الكود كما يلي:
var a = شخص جديد ('آدم') ؛
console.log (A.GetName ()) ؛ // "آدم"
console.log (A.SetName ('Eve'). getName ()) ؛ // 'حواء'
النمط 7: كائن ثابت
ثوابت الكائنات هي تجسيد للطرق المختلفة التي توفرها SET ، احصل ، محددة في كائن ما. علاوة على ذلك ، لن تحتفظ طريقة SET فقط بمجموعة الكائنات الأولى ، وسيكون الإعداد اللاحق غير صالح ، والذي حقق الغرض من الآخرين غير قادرين على التحميل الزائد. رمز التنفيذ كما يلي:
نسخة الكود كما يلي:
var ثابت = (function () {
var الثوابت = {} ،
ownProp = object.prototype.hasownproperty ،
// فقط هذه الأنواع الثلاثة من القيم مسموح بها
مسموح به = {
السلسلة: 1 ،
الرقم: 1 ،
منطقية: 1
} ،
البادئة = (Math.Random () + "_"). شريحة (2) ؛
يعود {
// اضبط الخاصية باسم الاسم
المجموعة: الدالة (الاسم ، القيمة) {
if (this.isdefined (name)) {
العودة كاذبة
}
if (! ownProp.call (مسموح ، قيمة typeo)) {
العودة كاذبة
}
الثوابت [بادئة + اسم] = القيمة ؛
العودة صحيح.
} ،
// حدد ما إذا كان هناك خاصية تسمى الاسم
Isteded: Function (name) {
إرجاع ownProp.call (الثوابت ، بادئة + اسم) ؛
} ،
// احصل على السمة المسماة الاسم
الحصول على: وظيفة (اسم) {
if (this.isdefined (name)) {
عودة ثوابت [بادئة + اسم] ؛
}
العودة لاغية.
}
} ؛
} ()) ؛
رمز التحقق كما يلي:
نسخة الكود كما يلي:
// تحقق مما إذا كان موجودًا
console.log (ثابت. // خطأ شنيع
// تعريف
console.log (constant.set ("maxwidth" ، 480)) ؛ // حقيقي
// إعادة الاختبار
console.log (ثابت. // حقيقي
// حاول إعادة تعريف
console.log (constant.set ("maxwidth" ، 320)) ؛ // خطأ شنيع
// تحديد ما إذا كان التعريف الأصلي لا يزال موجودًا
console.log (constant.get ("maxwidth")) ؛ // 480
الوضع 8: وضع صندوق الرمل
يوفر وضع Sandbox سياقًا منفصلًا لمجلة أو أكثر دون التأثير على سياق الوحدات النمطية الأخرى. على سبيل المثال ، هناك صندوق رمل مع ثلاث طرق حدث و DOM و AJAX. إذا تم استدعاء اثنين منهم لتشكيل بيئة ، فلا يوجد تدخل في البيئات الثلاثة. رمز تنفيذ صندوق الرمل كما يلي:
نسخة الكود كما يلي:
وظيفة Sandbox () {
// تحويل المعلمات إلى صفيف
var args = array.protype.slice.call (وسيطات) ،
// المعلمة الأخيرة هي رد الاتصال
رد الاتصال = args.pop () ،
// باستثناء المعلمة الأخيرة ، يتم تحديد جميع الوحدات الأخرى
الوحدات النمطية = (args [0] && typeof args [0] === "String")؟ args: args [0] ،
أنا؛
// إجبار المشغل الجديد
if (! (هذا مثيل Sandbox)) {
إرجاع صندوق الرمل الجديد (الوحدات ، رد الاتصال) ؛
}
// إضافة خصائص
this.a = 1 ؛
this.b = 2 ؛
// إضافة وحدات إلى هذا الكائن
// إذا لم تكن هناك وحدة أو المعلمة التي تم تمريرها هي "*" ، فسيتم تمرير جميع الوحدات النمطية
if (! وحدات || وحدات == '*') {
الوحدات النمطية = [] ؛
ل (أنا في sandbox.modules) {
if (sandbox.modules.hasownproperty (i)) {
الوحدات. push (i) ؛
}
}
}
// تهيئة الوحدة المطلوبة
لـ (i = 0 ؛ i <modules.length ؛ i += 1) {
sandbox.modules [الوحدات النمطية [i]] (هذا) ؛
}
// استدعاء رد الاتصال
رد الاتصال (هذا) ؛
}
// أضف كائن النموذج الأولي بشكل افتراضي
sandbox.prototype = {
الاسم: "طلبي" ،
الإصدار: "1.0" ،
getName: function () {
إرجاع هذا.
}
} ؛
ثم نحدد الوحدة الأولية الافتراضية:
نسخة الكود كما يلي:
sandbox.modules = {} ؛
sandbox.modules.dom = function (box) {
box.getElement = function () {
} ؛
box.getStyle = function () {
} ؛
box.foo = "bar" ؛
} ؛
sandbox.modules.event = function (box) {
// الوصول إلى النموذج الأولي لـ Sandbox إذا لزم الأمر:
// box.constructor.prototype.m = "mmmm" ؛
box.attachevent = function () {
} ؛
box.detachevent = function () {
} ؛
} ؛
sandbox.modules.ajax = function (box) {
box.makerequest = function () {
} ؛
box.getResponse = function () {
} ؛
} ؛
طريقة الاتصال على النحو التالي:
نسخة الكود كما يلي:
// طريقة الاتصال
Sandbox (['ajax' ، 'event'] ، function (box) {
console.log (typeof (box.foo)) ؛
// لا يوجد اختيار DOM ، لذا فإن box.foo غير موجود
}) ؛
Sandbox ('ajax' ، 'dom' ، function (box) {
console.log (typeof (box.attachevent)) ؛
// لا يوجد حدث محدد ، لذا فإن المرفق المحدد في الحدث غير موجود أيضًا
}) ؛
Sandbox ('*' ، function (box) {
console.log (box) ؛ // جميع الطرق المحددة أعلاه يمكن الوصول إليها
}) ؛
من خلال ثلاث طرق استدعاء مختلفة ، يمكننا أن نرى أن سياق الأساليب الثلاث مختلفة. الأول ليس لديه فو. والثاني ليس لديه مرفق ، لأنه يتم تحميل Ajax و DOM فقط ، ولكن لم يتم تحميل الحدث ؛ الثالث لا يحمل كل شيء.
النمط 9: أعضاء ثابتون
الأعضاء الثابتون هم مجرد خصائص ثابتة توفرها وظيفة أو كائن ، والتي يمكن تقسيمها إلى خاصة وعامة ، تمامًا مثل الثابتة العامة والخاصة في C# أو Java.
دعونا نلقي نظرة أولاً على أعضاء العامين. الأعضاء العامون بسيطون للغاية. الأساليب والوظائف التي نعلنها عادة ما تكون عامة ، مثل:
نسخة الكود كما يلي:
// مُنشئ
var gadget = function () {
} ؛
// طريقة ثابتة عامة
Gadget.isshiny = function () {
العودة "أنت تراهن" ؛
} ؛
// طريقة عادية لإضافتها على النموذج الأولي
Gadget.Prototype.setPrice = Function (Price) {
this.price = السعر ؛
} ؛
// استدعاء الطرق الثابتة
console.log (gadget.isshiny ()) ؛ // "أنت تراهن"
// إنشاء مثيل واتصل بالطريقة
var iphone = gadget () ؛
iPhone.setPrice (500) ؛
console.log (typeof gadget.setPrice) ؛ // "غير محدد"
console.log (typeof iphone.isshiny) ؛ // "غير محدد"
gadget.prototype.isshiny = gadget.isshiny ؛
console.log (iPhone.isshiny ()) ؛ // "أنت تراهن"
أما بالنسبة للأعضاء الثابتين الخاصين ، يمكننا استخدام ميزات الإغلاق الخاصة بهم لتنفيذها. فيما يلي طريقان للتنفيذ.
طريقة التنفيذ الأولى:
نسخة الكود كما يلي:
var gadget = (function () {
// متغيرات/خصائص ثابتة
var counter = 0 ؛
// إغلاق يعيد تطبيقًا جديدًا للمُنشئ
وظيفة الإرجاع () {
console.log (Counter += 1) ؛
} ؛
} ()) ؛ // تنفيذ على الفور
var g1 = new Gadget () ؛ // سجلات 1
var g2 = new Gadget () ؛ // سجلات 2
var g3 = new Gadget () ؛ // سجلات 3
يمكن أن نرى أنه على الرغم من أنه كائن جديد في كل مرة ، إلا أن الرقم لا يزال متزايدًا ، مما يحقق الغرض من الأعضاء الثابتة.
الطريقة الثانية:
نسخة الكود كما يلي:
var gadget = (function () {
// متغيرات/خصائص ثابتة
عداد var = 0 ،
Newgadget
// تنفيذ مُنشئ جديد
newgadget = function () {
عداد += 1 ؛
} ؛
// تفويض الوصول إلى الأساليب
newgadget.prototype.getlastid = function () {
عداد العودة
} ؛
// كتاب مبني
إرجاع Newgadget ؛
} ()) ؛ // تنفيذ على الفور
var iphone = gadget () ؛
iPhone.getlastid () ؛ // 1
var ipod = new Gadget () ؛
ipod.getlastid () ؛ // 2
var ipad = new Gadget () ؛
ipad.getlastid () ؛ // 3
يتم أيضًا زيادة الرقم ، والذي يتم تحقيقه باستخدام ميزة الإغلاق لطريقة التفويض الداخلي الخاص بها.
لخص
هذه هي المقالة التالية من وضع إنشاء الكائن. المادتين معا لها 9 أنماط. إنها أوضاع إنشاء الكائنات التي نستخدمها غالبًا في برمجة JavaScript اليومية. سيناريوهات مختلفة تلعب أدوارًا مختلفة. آمل أن يختار الجميع الوضع المعمول به وفقًا لاحتياجاتهم.