【发布时间】：2011-06-14 19:43:04
【问题描述】：
我在其他人和一些资源的帮助下将这些放在一起。我创建了一个fiddle of everything，精简后的代码贴在下面。
基本上我已经学会了如何使用这些模式，但我对这些方法之间更根本的区别感到好奇。下游代码实际上与这些模式中的任何一种都相同，但是除了个人喜好之外，是否有理由使用一种而不是另一种呢？此外，虽然我尝试收集最常见的模式，但如果更好，请提出您自己的模式。
模式 1（基于对象）：
var mouseDiff = {
"startPoint" : {"x" :0, "y" : 0},
"hypotenuse" : function(a,b) {
// do something
},
"init" : function(){
// do something
}
}
mouseDiff.init();
模式 2（据我所知最传统）：
function MouseDiff() {
this.startPoint = {"x" :0, "y" : 0};
}
MouseDiff.prototype.hypotenuse = function(a,b) {
// do something
}
MouseDiff.prototype.init = function() {
// do something
}
var myMouse = new MouseDiff;
myMouse.init();
模式 3（使用闭包）：
var MouseDiff2 = (function() {
var startPoint = {"x" :0, "y" : 0};
var hypotenuse = function(a,b) {
// do something
};
return {
hypotenuse: hypotenuse,
init : function(){
// do something
}
};
}());
MouseDiff2.init();
【问题讨论】：
-
Pattern 4 :
Object.create。因为这就是你做原型 OO 的方式。 -
为了详细说明@Raynos 的评论，
Object.create最常与模式1 结合使用。调用var mouseDiff2 = Object.create(mouseDiff)会为您提供一个新的、单独的对象，其引用存储在mouseDiff2中。然后，您可以随心所欲地使用它，而不会影响原始对象。 -
@RyanKinal 这并不完全正确。您可以编辑原始对象。还有一点需要注意的是
mouseDiff是放在mouseDiff2的原型链中 -
@Raynos 哦，哇。是的，那是我的错。今天头有点不清楚。
Object.create通过原型链为您提供一个继承旧对象的新对象。 -
澄清一下。
var o1 = { "foo": { "bar": "baz" } }; var o2 = Object.create(o1); o2.foo.bar = 42; console.log(o1.foo.bar);是原始“克隆”对象破坏状态的示例。
标签： javascript oop model-view-controller design-patterns