javascript的设计模式实现05之Composite

本文探讨了JavaScript中如何实现Composite设计模式,并结合自建的MyMap进行示例说明,帮助理解组件组合的概念。
摘要由CSDN通过智能技术生成

Composite模式参考图片:


代码:结合了之前自建的MyMap

var Iterator = function() {};
Iterator.prototype.first = function(){};
Iterator.prototype.next = function(){};
Iterator.prototype.isDone = function(){};
Iterator.prototype.currentItem = function(){};

var ArrayIterator = function(o) {
	var items = o;
	var curIdx = -1;
	this.first = function() {
		if (items == null || items.length < 1)
			return null;
		curIdx = 0;
		return items[0];
	};
	this.next = function() {
		if (items == null || items.length < 1)
			return null;
		if (this.isDone())
			return items[items.length - 1];
		else
			return items[curIdx++];
	};
	this.isDone = function() {
		if (items == null || items.length < 1 || items[curIdx] == null)
			return true;
		else
			return false;
	};
	this.currentItem = function() {
		if (this.isDone())
			return null;
		else
			return items[curIdx];
	};
	this.currentIdx = function() {
		return curIdx;
	};
};
ArrayIterator.prototype = new Iterator;
ArrayIterator.prototype.constructor = ArrayIterator;

var Map = function() {};
Map.prototype.createIterator = function() {};

var MyMap = function() {
	this.datas = new Array;
	this.createIterator = function() {
		return new ArrayIterator(this.datas);
	};
};
MyMap.prototype = new Map;
MyMap.prototype.constructor = MyMap;
MyMap.prototype.find = function(key) {
	var itor = this.createIterator();
	itor.first();
	var item;
	while(!itor.isDone()) {
		item = itor.currentItem();
		if (key.localeCompare(item.key) == 0)
			return item.value;
		itor.next();
	};
	return null;
};
MyMap.prototype.update = function(key, value) {
	var itor = this.createIterator();
	itor.first();
	var item;
	while(!itor.isDone()) {
		item = itor.currentItem();
		if (key.localeCompare(item.key) == 0) {
			this.datas.splice(itor.currentIdx(), 1, {key:key, value:value});			
			return true;
		}
		itor.next();
	};
	return false;
};
MyMap.prototype.add = function(key, value, ifUpdate) {
	var item = this.find(key);
	if (item != null && ifUpdate == true)
		return this.update(key, value);
	if (item == null) {
		this.datas.push({key:key, value:value});
		return true;
	}
	return false;
};
MyMap.prototype.del = function(key) {
	var itor = this.createIterator();
	itor.first();
	var item;
	while(!itor.isDone()) {
		item = itor.currentItem();
		if (key.localeCompare(item.key) == 0) {
			this.datas.splice(itor.currentIdx(), 1);			
			return item;
		}
		itor.next();
	};
	return null;
};

var Component = function() {};
Component.prototype.operation = function() {};
Component.prototype.add = function(o) {};
Component.prototype.remove = function(o) {};
Component.prototype.getLabel = function() {
	return this.label;
};
Component.prototype.setLabel = function(s) {
	this.label = s;
};

var Leaf = function(s) {
	this.setLabel(s);
	this.operation = function() {
		console.log("this is " + this.getLabel() + " leaf");
	};
};
Leaf.prototype = new Component;
Leaf.prototype.constructor = Leaf;

var Composite = function(s) {
	this.setLabel(s);
	var children = new MyMap;
	this.add = function(o) {
		return children.add(o.getLabel(), o);
	};
	this.remove = function(o) {
		return children.del(o.getLabel());
	};
	this.operation = function() {
		console.log("this is " + this.getLabel() + " composite");
		var itor = children.createIterator();
		itor.first();
		var child;
		while (!itor.isDone()) {
			child = itor.currentItem().value;
			child.operation();
			itor.next();
		};
	};
};
Composite.prototype = new Component;
Composite.prototype.constructor = Composite;

var root = new Composite("root");
var root1 = new Composite("root1");
var root2 = new Composite("root2");
var root3 = new Composite("root3");
var leaf1 = new Leaf("leaf1");
var leaf2 = new Leaf("leaf2");
var leaf3 = new Leaf("leaf3");
var leaf4 = new Leaf("leaf4");
var leaf5 = new Leaf("leaf5");
var leaf6 = new Leaf("leaf6");
var leaf7 = new Leaf("leaf7");
root.add(leaf1);
root.add(root1);
root.add(root2);
root1.add(leaf2);
root1.add(leaf3);
root2.add(leaf4);
root2.add(root3);
root3.add(leaf5);
root3.add(leaf6);
root3.add(leaf7);

root.operation();


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值