JQuery Ajax и объект поля

Question

У меня есть этот код:

MyObject = function(){
    this.field = null;

    this.build = function(){
        var my_url = "...";
        var my_data = "...";
        $.get(my_url, my_data, function(result){
           this.field = result;
        });
    }

    this.get = function(){
        return this.field;
    }
}

object = new MyObject();
object.build();
my_result = object.get() 

my_result теперь равно null, потому что при выполнении внутренней функции this не является моим объектом.
Итак, как я могу установить this.field с $.get возвращаемым значением ???

Answer 1

MyObject = function(){
    this.field = null;

    this.build = function(cb){
        var my_url = "...";
        var my_data = "...";
        var self = this;
        $.get(my_url, my_data, function(result){
           self.field = result;
           cb(result);
        });
    }

    this.get = function(){
        return this.field;
    }
}

object = new MyObject();
object.build(function(field) {
    console.log(object.get() === field);
});

Я рекомендую передать обратный вызов вашей функции сборки, чтобы вы могли получать уведомления немедленно , когда ваше поле установлено.

Кроме того, размещение var self = this внутри вашего метода гарантируетВы можете позвонить object.build.call(scope, f) без привязки к неправильной области.

Этот шаблон особенно полезен при наследовании, когда вы хотите вызвать метод другого класса.

Answer 2

В будущем попробуйте использовать шаблон модуля:

ЗДЕСЬ МОДУЛЬ МОДУЛЯ:

<script type="text/javascript">
    var myNamespace = (function($) {
        var publicInstances = {};

        // ***********************
        // myObject
        publicInstances.myObject = myObject;
        function myObject() {

            /// <summary>A pointer to this</summary>
            var self = this;

            this.someProperty = new String();

            this.initialize = function() {
                /// your code here
            }
            this.someMethod = function() {
                /// your code here
            }

            self.initialize();
        }

        return publicInstances;
    })(jQuery);


    jQuery(document).ready(function() {
        // Use would look like
        var myInstance = new myNamespace.myObject();
    });
</script>

ЗДЕСЬ КАК МОЖЕТ СМОТРЕТЬ ВАШ ОБЪЕКТ:

var myNamespace = (function($) 
{
    var publicInstances = {};

    // ***********************
    // myObject
    publicInstances.myObject = myObject;
    function myObject(url, data) {

        /// <summary>A pointer to this</summary>
        var self = this;
        /// <summary>Contains the result</summary>
        this.field = null; // Name this result instead.

        this.url = url;
        this.data = data;

        this.initialize = function() {
            /// Initialize whatever
        }
        this.build = function() {
            $.get(self.url, self.data, function(result) {
                self.field = result;
                cb(self.field);
            });
        }
        this.cb = function(result) {
            /// Do whatever
        }

        self.initialize();
    }

    return publicInstances;
})(jQuery);

Answer 3

В верхней части вашего конструктора выполните:

var self = this;

, это создаст новую переменную области действия, которая ссылается на текущий объект.

Затем в обратном вызове AJAX выполните:

self.field = result;