javascript - 在javascript中检索正确的 "this"

Question

这个问题已经有答案了:

How to access the correct `this` inside a callback (15 个回答)

已关闭 8 年前。

我已经构建了自己的对象:

Main.utilities.pool = function (pool) {
    var counter=0;
    var $form = $(pool);

    return {
        add_pool_field: function(){
            $form.find('#practice_type').change(function() {
                if($(this).find("option:selected").val()){
                    var time = new Date().getTime();
                    var regexp = new RegExp( $(this).find("option:selected").data('id'), 'g');
                    $("#items").append('<li class="colorize">' + '<h1>' + this.increment_counter() + '</h1>' + $(this).find("option:selected").data('fields').replace(regexp, time) + '</li>');
                }
            });
        },
        increment_counter: function(){
            return ++counter;
        },
        init: function() {
            this.add_pool_field();
        }
    }
}

我这样调用它:

var $profile_pool = Main.utilities.pool($('#new_form')).init();

问题出在更改事件中，这是指选择字段。但是，我想访问从池函数返回的实际任意对象的increment_counter函数。当我尝试 this.increment_counter() 时，它认为这是 html 选择字段，所以它爆炸了。如何在传递给更改的函数的上下文中访问该对象？

Answer 1

只需在 add_pool_field() 的本地范围内保存对 this 的引用即可。

    add_pool_field: function(){
        var self = this;
        $form.find('#practice_type').change(function() {
            if($(this).find("option:selected").val()){
                var time = new Date().getTime();
                var regexp = new RegExp( $(this).find("option:selected").data('id'), 'g');
                $("#items").append('<li class="colorize">' + '<h1>' + self.increment_counter() + '</h1>' + $(this).find("option:selected").data('fields').replace(regexp, time) + '</li>');
            }
        });
    },