将对象添加到扩展数组的JS集合中（继承？）

debugcn 发表于 Dev

amlmf1

注意：是的，也有类似的问题，但是我很难将集合传递给函数。

$j = jQuery.noConflict();

// objects.json shows: {"objects": ["hello", "hi", "yo"]}

function ObjectCollection() {

}

ObjectCollection.prototype = [];


ObjectCollection.prototype.fetch = function() {
 var parent = this;
 $j.getJSON("objects.json", function(data) {
     $j.each(data.objects, function(i, customObject) {
        var myCustomObject = new CustomObject(customObject);
        parent.push(myCustomObject);
     });

     console.log(parent); // array exists

 });
      console.log(parent); // its gone!

};


function CustomObject(name) {
    this.name = name;
}

function doSomethingWithCollection(objectCollection) {
    this.objectCollection = objectCollection;
    this.objectCollection.fetch();
    console.log(this.objectCollection); // shows object collection with object in console
    console.log(this.objectCollection.length); // equals 0?? should be 3!
    this.objectCollection.forEach(function(object) {
        // it wont iterate
        console.log(object);


    });
}
var collection = new ObjectCollection;
// if i uncomment the next two lines, the code will work
// var object = new CustomObject('myName');
// collection.push(object);
doSomethingWithCollection(collection);

编辑...好吧，我的问题是这样的：https : //jsfiddle.net/qd42fknL/

请不要建议插件。我想创建自己的对象收集器。

我的代码怎么了？

我开了个小提琴...

如果我使用函数之外的对象启动集合，则它将起作用，所以这是一个继承问题。这是怎么回事？

阿德南·乌默（Adnan umer）

编辑

我意识到问题根本不在于继承。这里的问题是您正在发送ajax请求，并且在它实际完成之前，您正在执行console.log。因此，这会产生错误的结果。

有两种解决方案可以解决此问题。

使用同步ajax请求（但不建议这样做）
等待异步ajax请求首先完成。

这是使用异步ajax调用的可行解决方案。

$j = jQuery.noConflict();

function ObjectCollection() { }
ObjectCollection.prototype = [];

ObjectCollection.prototype.fetch = function(callback) {
    var parent = this;
    $j.getJSON("objects.json", function(data) {
        $j.each(data.objects, function(i, customObject) {
            var myCustomObject = new CustomObject(customObject);
            parent.push(myCustomObject);
        });

        callback(); // notify request is completed
   });
};

function CustomObject(name) {
    this.name = name;
}

function doSomethingWithCollection(objectCollection) {
    this.objectCollection = objectCollection;
    var that = this;

    this.objectCollection.fetch(function () {

        // do this only after ajax finishes 
        console.log(that.objectCollection);
        console.log(that.objectCollection.length);
        that.objectCollection.forEach(function(object) {
            console.log(object);
        });
    });
}

var collection = new ObjectCollection;
doSomethingWithCollection(collection);

这是小提琴https://jsfiddle.net/qd42fknL/2/

本文收集自互联网，转载请注明来源。

如有侵权，请联系[email protected] 删除。