您的位置:首页 > Web前端 > JavaScript

js设计模式

2016-05-07 11:33 232 查看

单例模式

单例初始化一次,就是一个匿名函数自执行,然后把所需要的方法进行return,

组合模式

就是相当于计算机的文件目录,我个人感觉就是一棵树,互相包含,你可以先创建一个对象,然后将共同需要的部分提取出来,然后挂载到对象的原型上去,这样所有新建的这个对象都有了同样的方法,例如下面一段代码:

var GalleryComposite = function (heading, id) {
this.children = [];

this.element = $('<div id="' + id + '" class="composite-gallery"></div>')
.append('<h2>' + heading + '</h2>');
}

GalleryComposite.prototype = {
add: function (child) {
this.children.push(child);
this.element.append(child.getElement());
},

remove: function (child) {
for (var node, i = 0; node = this.getChild(i); i++) {
if (node == child) {
this.children.splice(i, 1);
this.element.detach(child.getElement());
return true;
}

if (node.remove(child)) {
return true;
}
}

return false;
},

getChild: function (i) {
return this.children[i];
},

hide: function () {
for (var node, i = 0; node = this.getChild(i); i++) {
node.hide();
}

this.element.hide(0);
},

show: function () {
for (var node, i = 0; node = this.getChild(i); i++) {
node.show();
}

this.element.show(0);
},

getElement: function () {
return this.element;
}
}


外观模式

它是将复杂的逻辑,用很简单的表现方式展示出来,简化复杂界面,其实就是把一个很复杂的功能简化成一个简单的函数调用。

工厂模式

解决多个相似对象的创建问题(没有解决一个对象的识别问题,即对象的类型的确定)

构造函数模式

可以为每个对象有一个合适的标识,直接就生成了一个对象,可以用instanceof检测,缺点是每次都要重新生成一下对象。

适配器模式

应用于,比如我有一段代码,但是他留的接口不是我想要的,我总不能重新把代码再写一下,这时我就可以把这个接口转换一下,改造成我们所需要的接口,

模块设计模式

其实就是一个匿名函数自执行,然后要把需要暴露出来的返回出来,

原型模式

可以方便的共享,缺点是如果是引用类型的话就会有问题,看下面这个例子:

function Person() {
}

Person.prototype = {
friends: ["shelby", "court"]
}

var person1 = new Person();
person1.friends.push("van");


这个就是影响到原型上的值,这就是我们很少单独使用原型模式的区别。

前端比较重要的设计模式

模块

单例

原型

观察者

内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息