ما هي بعض الأمثلة على تطبيقات نمط التصميم باستخدام جافا سكريبت؟

Question

أنا مبرمج ذو مهارات متوسطة في استخدام JavaScript ولكني لست خبيرًا.أعلم أنه يمكنك القيام ببعض الأشياء القوية جدًا باستخدامه، لكنني لم أر الكثير بخلاف التلاعب الأساسي بـ DOM.أتساءل عما إذا كان بإمكان الأشخاص تقديم بعض الأمثلة لمفاهيم أنماط التصميم التقليدية مثل طريقة المصنع، وSingleton، وما إلى ذلك باستخدام JavaScript.في أي الحالات يمكن استخدام هذه الأنماط على الويب؟

Answer 1

أردت فقط إضافة نمط JavaScript المفضل لدي والذي تعلمته من Pro JavaScript Design Patterns والذي أوصى به جوناثان راوخ بالفعل.

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

var com = window.com || {};
com.mynamespace = com.mynamespace || {};
com.mynamespace.newpackage = (function() {
    var myPrivateVariable = "hidden";
    var myPublicVariable = "exposed";

    function myPrivateMethod() {
        return "also hidden";
    }

    function myPublicMethod() {
        return "also exposed";
    }

    return {
        myPublicMethod: myPublicMethod,
        myPublicVariable: myPublicVariable
    };
})();

Answer 2

تطرق نيكولاي إلى هذا الأمر، لكن أنماط التصميم ليست متسقة بين اللغات التي بها اختلافات جذرية.لقد قرأت من قبل (وأتفق مع) أن نمط التصميم غالبًا ما يكون علامة على الميزات المفقودة في اللغة.

كمثال مثالي، نمط "المصنع" غير ضروري تمامًا في بعض اللغات، روبي هو المثال الذي أفكر فيه (لأن بناء الكائن هو مجرد طريقة في مثيل الفصل):

# create a factory for MyObject
my_factory = MyObject
instance_1 = my_factory.new

# change the factory to another class
my_factory = MyOtherObject
instance_2 = my_factory.new

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

Answer 3

هناك جيدة حر كتاب عبر الإنترنت من تأليف آدي عثماني، يقدم أنماط تصميم جافا سكريبت: أنماط تصميم جافا سكريبت الأساسية للمبتدئين، المجلد 1

Answer 4

@jamting:

نمط التصميم المفرد في JavaScript

يا إلهي.أنا عاجز عن الكلام.

إلى البروتوكول الاختياري:نعم، بالطبع يمكنك ذلك إلى حد ما، ولكن بعض الأنماط، كما اعتدت عليها، ليست مرئية كما هو الحال في Java.على سبيل المثال، المفرد سيكون ببساطة كائنًا:

var singleton = {
    sayHello: function() {
       alert("Hello!")
    }
};

ويكيبيديا لديها مثال على ذلك مصنع في شبيبة.

Answer 5

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

مثال:

// This object controls the progress of the animation 
ex1 = new Animator();
// The Animator's subjects define its behaviour 
ex1.addSubject(updateButton);
function updateButton(value) {
    $('ex1Button').innerHTML = "Progress: " + Math.round(value * 100) + "%";
}

// now click below: each click to the button calls ex1.toggle()

Answer 6

ماذا تسمى هذه الممارسة في جافا سكريبت؟

هذا هو نمط تصميم الاستدعاء الذاتي.لم يسبق لي أن رأيت ذلك حتى بدأت جافا سكريبت.

Answer 7

أظن أنهم يستطيعون ذلك - إليك مثال على Singleton:

نمط التصميم المفرد في JavaScript

Answer 8

بالتأكيد يمكنهم ذلك.وهنا كتاب حول هذا الموضوع:
أنماط تصميم جافا سكريبت الاحترافية
فيما يلي مثال لنمط المصنع:
نمط المصنع في جافا سكريبت

Answer 9

أود أن أضيف هنا ما درسته كمجموعة مع مناقشة أنماط التصميم في كل من C# وJavaScript.الشيء الرائع بالنسبة لي أثناء الاجتماع هو أن يقوم موظف C# بكتابة الأكواد بلغة JavaScript ونفس الشيء بالنسبة إلى موظف JavaScript.بعد أن أغادر الاجتماع أحاول تعلم المزيد في المنزل والقيام بالتدوين هناhttp://tech.wowkhmer.com/category/Design-Patterns.aspx لكل من C# وJavaScript.

Answer 10

يستمع لجوستين دياز يتحدث عن نمط التصميم لجافا سكريبت.يعتمد الحديث أيضًا على كتابه Pro Javascript Techniques المذكور أعلاه.تستغرق المحادثة حوالي 45 دقيقة في Google I/O