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

问题描述：

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

答

我只是想添加我从Jonathan Rauch已经推荐的Pro JavaScript Design Patterns中学到的我最喜欢的JavaScript模式。

这是命名空间单例模式。基本上，你可以通过单例创建命名空间，这允许你隐藏外部使用的方法和变量。隐藏/暴露的方法实际上是隐藏的，因为它们是在闭包中定义的。

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 
    }; 
})();

它应该是`com.mynamespace.newpackage =（function（）{...}（））`？只是好奇，因为JSLint抱怨。 :) – 2010-06-02 16:12:29

@Brian M. Hunt：我一直认为它是我写的，但你的方式似乎可以在Chrome和Firefox中使用，但不知道IE和其他人。无论如何，一些parens是必要的，否则应用函数的parens被报告为语法错误。 – 2010-06-03 21:59:33

答

我怀疑他们能 - 这里是单身的例子：

The singleton design pattern in JavaScript

链接已经死了。 – Pang 2017-04-28 00:29:12

这里你去：https://web-beta.archive.org/web/20111008032921/http://kaijaeger.com/articles/the-singleton-design-pattern-in-javascript.html – jamting 2017-04-28 20:33:03

答

@jamting：

The singleton design pattern in JavaScript

哦，我的上帝。我无语了。

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

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

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

谢谢，修正了链接。 – Nickolay 2017-04-29 06:39:28

答

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

答

Nickolay谈到了这一点，但设计模式是不是有大幅差异的语言之间是一致的。我曾阅读过（并同意）设计模式常常是语言中缺少功能的标志。

作为一个很好的例子，“工厂”模式是在一些语言完全没有必要，把Ruby我想到的例子（因为对象的构造就是在类实例的方法）：

# 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

无论何时您将设计模式应用于与最初开发的语言不同的语言，请确保您考虑是否真的有必要，以及您可以通过可用的新语言功能改进它的方式。设计模式只是一个指南，你应该总是考虑你打算使用的模式是否真的需要这种模式，或者是否可以在你的案例中以更好的方式采用。

答

我最近使用Bernie's Better Animation Class是大量使用了Strategy设计模式。伯尼在描述为什么应该使用策略模式方面做得非常出色，但遗憾的是并没有准确解释代码是如何工作的。然后，再次使用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()

答

我想在此补充在我研究的是有关双方在C＃和JavaScript设计模式的讨论一组。在会议期间对我来说什么是奇特的事情，就是C＃人用JavaScript编写代码，而用JavaScript编写相同的代码。在我离开会议之后，我尝试在家里学习更多，并在这里为C＃和JavaScript在这里写作 http://tech.wowkhmer.com/category/Design-Patterns.aspx。

答

Listen给贾斯汀迪亚兹谈论Javascript的设计模式。这个演讲也是基于他在上面提到的Pro Javascript技术书。讲座是在谷歌I/O

答

What is this practice called in JavaScript?

这是自调用设计模式约45分钟。直到我开始进行JavaScript脚本编写之前，我从未见过它。

答

有一个很好的免费在线图书由阿迪·奥斯马尼，引进的Javascript设计模式：在回答Essential JavaScript Design Patterns For Beginners, Volume 1

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

相关推荐