Как вы можете использовать ajax внутри объекта для заполнения переменных экземпляра объекта?

Question

У меня есть несколько объектов в иерархии, которые имеют общие свойства и методы, унаследованные от суперкласса, и специфичные для объекта свойства и методы в подклассах. Я все еще новичок в ООП javascript, так что, вероятно, есть гораздо лучший подход к этому. Я использую jQuery для AJAX, но не уверен, имеет ли это какое-то значение.

function Obj(input) {
    this.in = input;
    this.out = {
        content: this.in,
        category: {},
        owner: utils.getValidUser(),
        state: 0,
        meta: {}
    };
    this.process = function() {
       console.log("No Process Defined");
    }
}

function MovieObj(input) {
    this.inheritFrom = Obj;
    this.inheritFrom();
    this.out.type = "movie";
}

function ActionMovie(input) {
        this.inheritFrom = MovieObj;
        this.inheritFrom();
        this.out.genre = "action";
        this.process = function() {
            console.log("movie search");
            $.getJSON("/api/search/"+ escape(this.out.content),
              function(data) {
                /* 
                   I want to modify the object properties according to
                   what comes back from the ajax call.
                */
            });
        }
}

Answer 1

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

// Define Superclass
function Obj(input) {
    this.content = input;
    this.type = "object";
    this.owner = utils.getValidUser();
    this.state = 0;
}
Obj.prototype.process = function() {
       console.log("No Process Defined");
};


// Define Movie Subclass
function MovieObj(input) {
    Obj.call(this, input); 
    this.type = "movie";
}
MovieObj.prototype = new Obj();

// Define ActionMovie as subclass of Movie and apply new process method.
function ActionMovie(input) {
    MovieObj.call(this, input);
    this.genre = "action";
}
ActionMovie.prototype = new MovieObj();
ActionMovie.prototype.process = function() {
            var _obj = this;
            $.getJSON("/api/search/"+ escape(this.content),
              function(data) {
                /* 
                   I want to modify the object properties according to
                   what comes back from the ajax call.
                */
                _obj.meta.title data.title;
            });
        }
}

Сейчас это действительно работает, но есть некоторые предостережения. Как написано, конструкторы для суперкласса вызываются каждый раз, когда определяется новый объект, поэтому выполняется много ненужных вызовов.

Этот код основан на информации, содержащейся в следующей ссылке, которая также описывает обходной путь, специфичный для Mozilla: http://www.spheredev.org/wiki/Prototypes_in_JavaScript

Answer 2

Оу, странный подход к объектно-ориентированному JavaScript :)

Как я понял, вы хотите реализовать модель, которую вы используете на других языках, с которыми вы знакомы для создания вашего объекта. Я о this.inheritFrom. В JS нет классов, объекты наследуются напрямую от объектов. Один из способов (в Интернете много дискуссий) - сделать это с помощью ключевого слова new, например

var MovieObj = new Obj(input);
MovieObj.out.type = "movie";

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

function Obj(input){
    /* some stuff here */
};

function MovieObj(){};
MovieObj.prototype = new Obj();
MovieObj.prototype.constructor = MovieObj();
MovieObj.protorype.out.type = 'movie';

var actionMovie = new MovieObj();
/* do some stuff here with your final object actionMovie */

Надеюсь, это поможет вам понять разницу между oo js и другими oo языками. Не стесняйтесь спрашивать в комментариях, если что-то не ясно (извините за мой английский).