Question

我创建了以下函数来绑定到我页面中所有类型'.wrapper'的类。我遇到的问题是，当我触发任何这些事件时，var'the'不再指向绑定它的特定循环，而是指在循环绑定的最后一次迭代中使用的'this'。这似乎是我理解var如何存储在绑定中而不是作为值存储的错误，它们存储为指针。任何人都可以帮我告诉我如何使这些绑定与他们的对象保持相关。

谢谢德文

var pullUpEl, pullUpOffset, generatedCount = 0, index = 0, wrappers = [];

$('.wrapper').each(function () {
    if ($(this).hasClass('tooltip')) {
        pullUpEl = $(this)[0].getElementsByTagName("div")[0].getElementsByTagName("div")[0];
        pullUpOffset = pullUpEl.offsetHeight;

        wrappers[index] = new iScroll($(this).attr('id'), {
            useTransition: true,
            fadeScrollbar: true,
            hideScrollbar: false,
            hScrollbar: false,
            //snap: 'li',
            onRefresh: function () {
                if (pullUpEl.className.match('loading')) {
                    pullUpEl.className = '';
                    pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Pull up to load more...';
                }
            },
            onScrollMove: function () {
                if (this.y < (this.maxScrollY - 5) && !pullUpEl.className.match('flip')) {
                    pullUpEl.className = 'flip';
                    pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Release to refresh...';
                    this.maxScrollY = this.maxScrollY;
                } else if (this.y > (this.maxScrollY + 5) && pullUpEl.className.match('flip')) {
                    pullUpEl.className = '';
                    pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Pull up to load more...';
                    this.maxScrollY = pullUpOffset;
                }
            },
            onScrollEnd: function () {
                if (pullUpEl.className.match('flip')) {
                    pullUpEl.className = 'loading';
                    pullUpEl.querySelector('.pullUpLabel').innerHTML = 'Loading...';
                    pullUpAction(this, pullUpEl.parentNode.getElementsByTagName("ul")[0]);
                }
            }
        });
    } else {
        wrappers[index] = new iScroll($(this).attr('id'));
    }
    index++;
});

Answer 1

this不是问题，pullUpEl是个问题。你把它设为全局，所以它的最终值是.each()块中的最后一个元素。运行onRefresh，onScrollMove等功能后，它们不会在pullUpEl实际发生变化的环境中运行。所以，基本上，无论哪个元素触发这个，所有的更改都会在每次循环的最后一个元素上运行。

Answer 2

非正式地，this计算第一个词汇封闭function的上下文（隐式参数）。你可以抓住它：

function f() {
    var self = this;
    function g() {
        // here "self" evaluates to the context of f, "this" evaluates to the one of g
    }
}

要在浏览器控制台中运行，请尝试：

function f() {
    var self = this;
    return function g() {
        console.log(String(self));
        console.log(String(this));
    }
}

f.apply(1).apply(2)

有关血腥的详细信息，请参阅ECMA 262，11.1.1：

this关键字的计算结果为ThisBinding的值当前执行上下文。

该标准指定ThisBinding仅在输入功能代码或输入eval代码时更改。

Cyclical Binds中的绝对引用Javascript var

2 个答案: