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

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

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

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

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

【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

标签: 外挂式编程

相关文章

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

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

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

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

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

zhaoshao.alert支持zs-select,结合才是一个相对复杂的应用场景。【index.html】<!DOCTYPE html> <html ng-a...

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

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

有了外挂式思维基础,开始涉及框架。个人理解,所谓框架就是自己研究一些习惯、一些风格,出于某个目的(如快速开发),而设计并开发出的一套生产工具。我这里对框架的需求主要是两点1、快。为了减少开发的工作时间...

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

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

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

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

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

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

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

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

拓展angular.js更多功能,如变色方案(这里简单模拟颜色变化,方案变色要改class比较合理)【inedx.html】<!DOCTYPE html> <html&n...