如何扩展JavaScript中TTable类的props方法并保留原有逻辑?
问题分析
你的代码无法正常工作的核心原因有两个:
- 原
TTable构造函数中,props是每个实例自身的方法(通过this.props = function(){...}定义),并非挂载在TTable.prototype上,因此TTable.props是undefined,导致origprop()调用直接报错。 - 即便你给原型添加了
props方法,实例自身已存在的props属性会屏蔽原型上的方法,实例仍会调用原有的props逻辑。
解决方案
根据是否能修改原TTable构造函数,提供两种可行方案:
方案一:修改原构造函数(推荐,符合原型链规范)
将props挂载到原型上,让所有实例共享该方法,便于后续扩展:
// 修改后的TTable构造函数 var TTable = function(name){ this.props(); } // 将props定义在原型上,统一管理 TTable.prototype.props = function(){ this.properties = new TProperty(); this.properties.Add("wfstart","Workflow start","L",false); this.properties.Add("wfend","Workflow end","L",false); } // 扩展props的addfeat函数 function addfeat(){ // 保存原原型方法 var origprop = TTable.prototype.props; // 重新定义原型上的props方法 Reflect.defineProperty(TTable.prototype, 'props', { value: function() { // 调用原方法时绑定当前实例的this origprop.call(this); // 添加新属性 this.properties.Add("ttype","Tipus","N",false); } }); }
使用方式:
addfeat(); var table = new TTable("test"); // table.properties将包含wfstart、wfend、ttype三个属性
方案二:无法修改原构造函数时的兼容方案
如果原TTable代码是第三方不可修改的,通过重写构造函数来替换实例的props方法:
// 原TTable构造函数(假设无法修改) var TTable = function(name){ this.props= function(){ this.properties=new TProperty(); this.properties.Add("wfstart","Workflow start","L",false); this.properties.Add("wfend","Workflow end","L",false); } this.props(); } // 扩展用的addfeat函数 function addfeat(){ // 保存原构造函数 var originalTTable = TTable; // 重写构造函数 TTable = function(name){ // 调用原构造函数初始化实例 originalTTable.call(this, name); // 保存实例原有的props方法 var origProps = this.props; // 替换实例的props方法 this.props = function(){ origProps.call(this); this.properties.Add("ttype","Tipus","N",false); } // 重新调用一次新的props方法,覆盖原构造函数的调用结果 this.props(); } // 继承原原型链(确保原原型上的其他方法可用) TTable.prototype = originalTTable.prototype; TTable.prototype.constructor = TTable; }
内容的提问来源于stack exchange,提问作者Gábor Horváth
相关产品推荐
相关产品推荐

