侧边栏壁纸
博主头像
落叶人生博主等级

走进秋风,寻找秋天的落叶

  • 累计撰写 130562 篇文章
  • 累计创建 28 个标签
  • 累计收到 9 条评论
标签搜索

目 录CONTENT

文章目录

javascript的命令模式(三)

2024-05-12 星期日 / 0 评论 / 0 点赞 / 94 阅读 / 1199 字

操作,命令,执行分离。 把操作封装成命令,然后执行、 //javascript 模式var cannon = {// 大炮shot: function(){console.log('大炮射击');}

操作,命令,执行分离。

把操作封装成命令,然后执行、

//javascript 模式var cannon  = {	// 大炮	shot: function(){		console.log('大炮射击');	}};var plane  = {	// 飞机	bomb: function(){		console.log('飞机投弹');	},	retreat: function(){			console.log('飞机撤退');	}};var PlaneCommand = function(obj){	return {		execute: function(){			obj.bomb();		},		undo: function(){			obj.retreat();		}	}}var CannonCommand = function(obj){	return {		execute: function(){			obj.shot();		}	}}var setCommand = function(btn1, command){	btn1.onclick = function(){		command.apply(this, arguments);	}}// 创建按钮var createButton = function(name){	var btn = document.createElement('button');	btn.innerHTML = name;	return document.body.appendChild(btn);}var cannonCommand = CannonCommand(cannon);var planeCommand = PlaneCommand(plane);var btn1 = createButton('飞机轰炸');var btn2 = createButton('飞机撤退');var btn3 = createButton('大炮射击');setCommand(btn1, planeCommand.execute);setCommand(btn2, planeCommand.undo);setCommand(btn3, cannonCommand.execute);

 

广告 广告

评论区