1. نظرة عامة
تعني سلسلة مسؤولية سلسلة المسؤولية أن الكائنات المتعددة لديها فرصة لمعالجة الطلب ، وبالتالي تجنب علاقة الاقتران بين المرسل ومستقبل الطلب. قم بتوصيل الكائن بسلسلة وقم بتمرير الطلب على طول السلسلة حتى يعالجه كائن.
يبدو أنه نفس القائمة المرتبطة في بنية البيانات.
ولكن لا تعبث ، فإن سلسلة المسؤولية لا تساوي قائمة مرتبطة ، لأنه يمكن البحث في سلسلة المسؤولية في أي عقدة ، بينما يجب البحث في القائمة المرتبطة من العقدة البداية.
على سبيل المثال ، تنتمي أحداث الفقاعات في آلية حدث DOM إلى سلسلة المسؤوليات ، في حين أن الأحداث التي تم التقاطها تنتمي إلى القائمة المرتبطة.
2. استخدم سلسلة المسؤولية لمحاكاة الفقاعات
لنفترض أن لدينا ثلاثة أشياء: li و ul و div. مخطط العلاقة بين الثلاثة هو كما يلي:
على سبيل المثال ، عندما نؤدي إلى تشغيل كائن LI ، إذا لم يمنع LI الفقاعات ، فسيتم نقله إلى كائن UL. عندما تصل إلى UL ، إذا لم يتم منع الفقاعات ، فسيتم تمريرها إلى كائن DIV (على افتراض أن DIV هي عقدة الجذر). وبالمثل ، UL و DIV.
رؤية هذا ، من الواضح جدًا أنه مناسب لكتابة مثل هذه الاحتياجات باستخدام نموذج سلسلة المسؤولية.
ولكن ، كيفية استخدام JavaScript لتنفيذ نموذج سلسلة المسؤولية؟
على النحو التالي ، يمكننا بناء الهندسة المعمارية الأساسية من خلال سلاسل النموذج الأولي:
وظيفة CreateM (obj) {this.next = obj || باطل؛}؛ createM.Prototype = {handle: function () {if (this.next) {this.next.handle () ؛ }}} ؛كلما استخدمنا مُنشئ CreatedOm لإنشاء كائن ، نقوم بتمرير الكائن المرتبط به (حسنًا ، هذه قائمة مرتبطة للغاية).
ثم ، عندما نؤدي إلى تشغيل كائن وننفذ طريقة المقبض ، يمكننا متابعة هذه السلسلة والمضي قدمًا.
ومع ذلك ، تجدر الإشارة إلى أنه عندما تغطي سمة المقبض لكائن ما المقبض في سلسلة النموذج الأولي ، كيف يمكنك الاستمرار في تمريره؟
فقط استخدم createom.prototype.handle.call (هذا) ؛
لذلك ، فإن تنفيذ رموز LI و UL و DIV هي كما يلي:
var li = null ، ul = null ، div = null ؛ div = new createom () ؛ div.handle = function (stopBubble) {console.log ('div') ؛ if (stopbubble) {return ؛ } آخر {createom.prototype.handle.call (this) ؛ }} ؛ ul = new createM (div) ؛ ul.handle = function (stopBubble) {console.log ('ul') ؛ if (stopbubble) {return ؛ } آخر {createom.prototype.handle.call (this) ؛ }} ؛ li = new createdom (ul) ؛ li.handle = function (stopBubble) {console.log ('li') ؛ if (stopbubble) {return ؛ } آخر {createom.prototype.handle.call (this) ؛ }} ؛ما سبق هو كل محتوى هذه المقالة. آمل أن يكون ذلك مفيدًا لتعلم الجميع وآمل أن يدعم الجميع wulin.com أكثر.