Javascript框架不能真正在内部调用方法

Javascript framework can't really call methods internally

本文关键字:在内部 调用 方法 框架 不能 Javascript      更新时间:2023-09-26

我一直在尝试为一个小得多的插件模仿一些jQuery的语法。我在内部使用$ object的方法已经有一段时间了。让我举例说明:

(function() {
    window.$ = function (element) {
        return new Plugin(element);
    };
    var Plugin = function (element) {
        this.element = element;
    };
    Plugin.prototype = {
        foreach: function(callback) {
            // Of course the "foreach" function will be bigger than this, this is just for testing.
            var values = [];
            for (i = 0; i < this.element.length; i++) {
                values[i] = callback.call(this, this.element[i], i);
            }
            return values;
        },
        someOtherFunctionThatUsesForeachInternally: function() {
            var arr = [];
            $([6, 32, 2]).foreach(function(item, key) {
                arr[key] = item + 7;
            });
            return arr;
        }
    };
})();
/* Desired result: 
[
    [13, 39, 9],
    [13, 39, 9],
    [13, 39, 9],
    [13, 39, 9]
]
*/
var arr = [1, 5, 7, 9];
var test = [];
$(arr).foreach(function(value, key) {
    test[key] = this.someOtherFunctionThatUsesForeachInternally();
});
console.log(test);

当美元符号与参数(如数组,在本例中为var arr = [1, 5, 7, 9])一起使用时,一个新的Plugin对象被实例化,并且在此之后立即调用一个方法。

我写了一个小的foreach来测试,但似乎不可能从框架内的函数调用它。console.log(test);在最后将输出[[13,39,9]],而不是对var arr的每个元素进行输出。我猜这是因为在内部调用foreach时覆盖了this

对于如何解决这个问题,你有什么主意吗?

foreach方法中的for循环索引(i)正在被覆盖,因为您已经在全局作用域中声明了它。总是使用var来声明变量:

for (var i = 0; i < this.element.length; i++) {
    values[i] = callback.call(this, this.element[i], i);
}
演示:

http://jsfiddle.net/QhXa7/