-
写出 构造函数模式、混合模式、模块模式、工厂模式、单例模式、发布订阅模式的范例。
-
构造函数模式
var Person = function(name, age) { this.name = name; this.age = age; } Person.prototype.sayName = function() { return this.name; } var student = new Person("htkz", 30); console.log(student)
-
混合模式
var Person = function(name, age) { this.name = name; this.age = age; }; Person.prototype.sayName = function() { console.log(this.name); } var Student = function(name, age, score) { Person.call(this, name, age); this.score = score; } Student.prototype = Object.create(Person.prototype); Student.prototype.sayScore = function() { console.log(this.score); } var student = new Student("htkz", 28, 99); console.log(student)
-
模块模式
var Person = (function(){ var name = "htkz"; function sayName() { console.log(name); } return { name: name, sayName: sayName } })()
-
工厂模式
function createPerson(opts) { var person = { name: opts.name || 'htkz' } person.sayName = function() { console.log(this.name); } return person; } var p1 = createPerson({name: 'htkz'}); var p2 = createPerson({name: '1234'});
-
单例模式
var People = (function() { var instance; function init(name) { return name; } return { createPeople: function(name) { if(!instance) { instance = init(name); } return instance; } } })(); var obj1 = People.createPeople('ts123'); var obj2 = People.createPeople('456');
-
发布订阅模式
var EventCenter = (function() { var events = {}; function on (evt, handler) { events[evt] = events[evt] || []; events[evt].push({ handler: handler }); } function fire(evt, args) { if(!events[evt]) { return; } for(var i = 0; i < events[evt].length; i++) { events[evt][i].handler(args); } } return { on: on, fire: fire } })(); EventCenter.on('hit', function() { console.log('hit'); }) EventCenter.fire('hit');
-
-
使用发布订阅模式写一个事件管理器,可以实现如下方式调用
Event.on('change', function(val){ console.log('change... now val is ' + val); }); Event.fire('change', '饥人谷'); Event.off('changer');
var Event = (function() { var events = {}; function on (evt, handler) { events[evt] = events[evt] || []; events[evt].push({ handler: handler }); } function fire(evt, args) { if(!events[evt]) { return; } for(var i = 0; i < events[evt].length; i++) { events[evt][i].handler(args); } } function off(evt) { delete events[evt]; } function test() { console.log(events); } return { on: on, fire: fire, off: off, test: test } })(); Event.on('change', function(val){ console.log('change... now val is ' + val); }); Event.fire('change', '饥人谷'); Event.off('change'); Event.fire('change', '饥人谷');
js设计模式
最后编辑于 :
©著作权归作者所有,转载或内容合作请联系作者
- 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
- 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
- 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...