Question

我是一名使用JavaScript的中等技术程序员，但我不是大师。我知道你可以用它做一些非常强大的东西，除了相当基本的DOM操作之外我还没有看到太多东西。我想知道人们是否可以使用JavaScript提供一些传统设计模式概念的例子，例如Factory Method，Singleton等。在什么情况下，这些模式将用于网络？

Answer 1

我只是想添加我最喜欢的JavaScript模式，这是我从Jonathan Rauch已经推荐的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

Nickolay谈到了这一点，但设计模式在具有巨大差异的语言之间并不一致。我之前已经阅读过（并同意）设计模式通常是语言缺失功能的标志。

作为一个完美的例子，在某些语言中完全没有“Factory”模式，Ruby就是我想到的例子（因为对象构造只是Class实例上的一个方法）：

# 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

@jamting：

The singleton design pattern in JavaScript

天哪啊。我无言以对。

OP：是的，当然你可以在某种意义上说，但是你习惯使用的某些模式并不像Java那样可见。例如，单身只是一个对象：

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

维基百科在JS中有一个Factory的例子。

Answer 4

Addy Osmani提供了一本很好的免费在线书籍，介绍了Javascript设计模式：Essential JavaScript Design Patterns For Beginners, Volume 1

Answer 5

我最近使用Bernie's Better Animation Class广泛使用了Strategy设计模式。 Bernie在描述为什么应该使用策略模式方面做得很好，但遗憾的是并没有准确解释代码是如何工作的。然后，在使用Design Patterns参考时，请查看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

What is this practice called in JavaScript?

这是自我调用设计模式。在我开始使用Javascripting之前，我从未见过它。

Answer 7

我怀疑他们可以 - 这是Singleton的一个例子：

The singleton design pattern in JavaScript

Answer 8

当然可以。这是一本关于这个主题的书：
Pro JavaScript Design Patterns
这是工厂模式的一个例子：
Factory pattern in Javascript

Answer 9

我想在这里添加我作为一个小组学习的内容，讨论C＃和JavaScript中的设计模式。在会议期间，对我来说有什么花哨的事情是C＃的人在JavaScript中编写代码，对JavaScript的人来说也是如此。离开会议后，我尝试在家里学习更多，并在这里做博客对于C＃和JavaScript，http://tech.wowkhmer.com/category/Design-Patterns.aspx。

Answer 10

Listen给Justin Diaz谈论Javascript的设计模式。这个演讲也是基于他上面提到的Pro Javascript Techniques这本书。 Google I / O大约45分钟的谈话

使用JavaScript的设计模式实现的一些示例是什么？

10 个答案: