Javascript:object[method]() 不工作或如何为纯 Javascript 代码构建 jQuery 插件

Question

我需要帮助为我的一个 vanilla JS 脚本制作一个 jQuery 插件，this here是当前的 jQuery 插件，但下一个版本可以使用更多方法，我需要以某种方式解决所有这些问题。

目前我正在研究这个

(function($) {
    var t;  
    $.fn.KUTE = function( method, start, end, ops ) { // method can be Animate(), fromTo(), to(), stop(), start(), chain(), pause(), stop(), etc
        return this.each(function(){        
            if ( method === 'to' ) {                
                t = new KUTE[method]( this, null, end, ops );
            } else if ( method === 'fromTo' || method === 'Animate' ) {
                t = new KUTE[method]( this, start, end, ops );
            } 
            if ( t !== undefined && typeof t[method] === 'function' ) {
                console.log(t) // this shows proper object
                t[method]() // this doesn't work
            }   
        });
    };  
})(jQuery);     

为什么 t[method]() 不起作用，我怎样才能让它起作用？

更新:我在这里添加了一些示例代码，说明如何围绕此代码工作。基本上我构建了一个补间对象

var tween = $(div).KUTE('to', { left: tl }, { easing: easing, duration: 1000 } );

然后我需要start()它，stop()它和其他方法。

$(tween).KUTE('start'); // this should basically be it.

现在，我一直在阅读一些 Javascript 的东西，比如 call() 和 apply() 我有点想这可能是工作所必需的，但即便如此，t[method].call(t)//where t is "this" 也不起作用。我希望我已经正确地指出了我的问题，如果有任何错误，请纠正我。

非常感谢。

Answer 1

我想我找到了原因，我上面的最后一条评论解释了它并且我制作了一个不同的 jQuery 函数。

(function($) {
    $.fn.KUTE = function( method, start, end, ops ) { // method can be Animate(), fromTo(), to(), stop(), start(), chain(), pause() 
        var tws = [], i, l = this.length;

        for (i=0;i<l;i++){
            var mt = this[i][method];
            if ( typeof mt === 'function' ) {
                mt.apply(this[i]);
            }    
            if ( method === 'to' ) {
                tws.push( new KUTE[method]( this[i], start, end ) ); // here start is end and end is ops 
            } else if ( method === 'fromTo' || method === 'Animate' ) {
                tws.push( new KUTE[method]( this[i], start, end, ops ) ); 
            }           
        }
        return tws;
    };
})(jQuery); 

接下来要做的是，如果 this.length > 1 做一个漂亮的小 FOR() 而不是 super 糟糕和丑陋的 jQuery.each( )。

问题已解决，请参阅我的 codepen举个例子。

更新:我还添加了 FOR 并且它按预期工作。我更新了上面的答案。