yui3 plugin无限递归bug?

最新推荐文章于 2020-12-18 12:24:45 发布

最新推荐文章于 2020-12-18 12:24:45 发布 · 136 阅读

文章标签：

#YUI #OOP

framework / lib 专栏收录该内容

72 篇文章

订阅专栏

本文详细解析了YUI3插件系统中遇到的递归问题，通过实例化过程分析，发现并修正了Y.Base类无法被插件化的根本原因。通过代码修正，解决了无限递归的问题，确保了插件系统的正常运行。

在 pluginhost-debug.js 中有段代码：

PluginHost.plug = function(hostClass, plugin, config) {
        // Cannot plug into Base, since Plugins derive from Base [ will cause infinite recurrsion ]
        var p, i, l, name;
    
        if (hostClass !== Y.Base) {
          
        }
    };

其中的if是为了防止在 Y.Base 设置插件。

插件实例初始化：

插件继承于Y.Plugin.Base，由于 YUI3 的设计，Y.Plugin.Base 继承于 Y.Base ，Y.Base 又 augment 自PluginHost 则在使用插件时，插件需要实例化，实例化时当调用到 Y.Base 的构造函函数：

function Plugin(config) {
         //Y.Base
        Plugin.superclass.constructor.apply(this, arguments);
    }

而 Y.Base的构造函数则会由于augment自PluginHost，调用 _initPlugins 而 _initPlugins 则会取得所有继承链构造器：

var classes = (this._getClasses) ? this._getClasses() : [this.constructor],

即： Y.Base ,Y.Plugin.Base，以及当前插件构造器本身，对这几个构造器的plugins进行实例化，但是如果 Y.Base 有 plugins ，则在初始化 Y.Base的插件时，又会回到本段开头进入无限递归。

由上分析可知，确实不可以对 Y.Base 进行plug ,但是同时也看到也不能对 Y.Plugin.Base以及插件构造器进行 plug，原因同上，但是 YUI3只考虑了不可以对 Y.Base进行 if判断，却没有对Y.Plugin.Base以及插件构造器本身进行判断，修正如下：

if (hostClass !== Y.Base) {
        	
        	var original=hostClass;
                  //plugin.Base的子类都不能
        	  while(hostClass){
        	  	if(hostClass == Y.Plugin.Base) return;
        	  	if(hostClass.superclass)hostClass=hostClass.superclass.constructor;
        	  	else break;
        	  }
        		hostClass=original;
}

测试代码：

若没有上步修正会导致无限递归

YUI({
			filter:"DEBUG"
			}).use("base","event","node","event-simulate","event-custom","node-event-simulate","plugin","oop","pluginhost",function(Y){
		
	      
	      function testPlugin(){
	      	testPlugin.superclass.constructor.call(this);
	      	console.log("testPlugin ...");
	      }
	      Y.extend(testPlugin,Y.Plugin.Base);
	      testPlugin.NAME="testPlugin";
	      testPlugin.NS="testPlugin_ns";
	      
	      //plug Y.Plugin.Base   	 
				Y.Plugin.Host.plug(Y.Plugin.Base,testPlugin);	
			
			  //plug自身
			  Y.Plugin.Host.plug(testPlugin,testPlugin);	
			
				Y.Node.plug(testPlugin);
				
                                //开始无限递归
				var node=Y.one("body");
				
				
				console.log("done");
			
			
		});