外挂式插件编程思路【基础篇】(2)

野生程序猿-杂烧4年前案例分享1093

* 本网页 讲解外挂插法,外插(内部的东西插到外部使用)。

* 内部的代码几乎不变的情况下, 通过插入外部的个别方法,达到控制内部的目的

* 特征,主要代码是写外部逻辑。内部尽可能的不动、少动

【demo.html】

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title>外挂式插件编程思路</title>
		<script type="module">
			/**
			* 本网页 讲解外挂插法,外插(内部的东西插到外部使用)。
			* 内部的代码几乎不变的情况下, 通过插入外部的个别方法,达到控制内部的目的
			* 特征,主要代码是写外部逻辑。内部尽可能的不动、少动
			*/
			window.plugin01=function(speak){
				if(speak.num==3)
				{
					//
					console.warn('speak.num==3处理外挂拦截逻辑');
					speak.num=0;
				}
			}
			
			import speak from './speak.js';
			window.speak=speak;
			
		</script>
	</head>
	<body>
		<button onclick="test()">测试</button>

		<script>

			function test()
			{
				console.log(speak);
				speak.start();
			}
			
		</script>
		
	</body>
</html>

【speak.js】

var speak={
	
	
	num:0,
	start:function(){
		this.num=this.num+1;
		console.log(`正在讲第${this.num}句话`);
		window.plugin01(this);//借助全局对象,插入外挂
	}
	
}
export default speak;


一般别人的一些库文件不方便直接修改,但是又想调整功能。这个时候可以自己把代码写在外面,别人的库文件一句话调用,把外面的对象传递过来,从而实现目的。


image.png

标签: 外挂式编程

相关文章

外挂式插件编程思路【进阶篇】(5)

外挂式插件编程思路【进阶篇】(5)

继续深造angular.js,并加入jquery.js<!-- 空html,等待html插入 --> <div id="tab_body&q...

外挂式插件编程思路【进阶篇】(6)

外挂式插件编程思路【进阶篇】(6)

深入模拟低代码编程【index.html】<!DOCTYPE html> <html ng-app="myApp"  n...

外挂式插件编程思路【进阶篇】(8)

外挂式插件编程思路【进阶篇】(8)

路由功能,单页面应用更加得心应手。【index.html】<!DOCTYPE html> <html ng-app="myApp" ...

外挂式插件编程思路【基础篇】(3)

外挂式插件编程思路【基础篇】(3)

* 本网页 讲解外挂插法,内插(外部的东西往内部插)。 * window.plugin01,window.plugin02模拟2个外部用户,内部的逻辑方法会随着外部更改而...

外挂式插件编程思路【基础篇】(1)

外挂式插件编程思路【基础篇】(1)

给大家介绍一下外挂式的编程思路,先从一个demo看起外挂式改写一些方法,同时不破坏它,加入自己需要的功能。【demo.html】<!DOCTYPE html> <html...

外挂式插件编程思路【敏捷框架篇】(10)

外挂式插件编程思路【敏捷框架篇】(10)

优化细节,标签多个效果。如select正常得到的是value值,但是我们实际要在其他地方显示value对应的文字。【index.html】<!DOCTYPE html> <...