data.map не является функцией

Question

Я избиваю голову против ошибки, которую я не могу решить, как исправить. У меня есть следующее:

JSON

{"products": 
[ 
    { 
     "product_id" : "123", 
     "product_data" : { 
      "image_id" : "1234", 
      "text" : "foo", 
      "link" : "bar", 
      "image_url" : "baz" 
     } 
    },{ 
     "product_id" : "456", 
     "product_data" : { 
      "image_id" : "1234", 
      "text" : "foo", 
      "link" : "bar", 
      "image_url" : "baz" 
     } 
    } 
]} 

и следующий JQuery

function getData(data) { 
    this.productID = data.product_id; 
    this.productData = data.product_data; 
    this.imageID = data.product_data.image_id; 
    this.text = data.product_data.text; 
    this.link = data.product_data.link; 
    this.imageUrl = data.product_data.image_url; 
} 

$.getJSON("json/products.json").done(function (data) { 

    var allProducts = data.map(function (item) { 
     return new getData(item); 
    }); 
}); 

пока я получаю сообщение об ошибке, что map.data не определен как функция? Глядя на это, я не знаю, что не работает, поскольку я скопировал это в новый проект из ранее использованного кода. Единственное отличие - это источник json. У предыдущего не было {"products": part перед [] скобками. Это то, что меня выбрасывает?

Answer 1

Объекты, {}, в JavaScript не имеет метод .map(), это только для Arrays, [].

Так что для того, чтобы ваш код работал, измените data.map() на data.products.map(), так как products - это массив, в который вы можете выполнить итерацию.

Answer 2

data не является массивом, это объект с массивом продуктов, чтобы перебрать data.products

var allProducts = data.products.map(function (item) { 
    return new getData(item); 
}); 

Answer 3

Существует ошибка на $.map() вызов, попробуйте следующее:

function getData(data) { 
     this.productID = data.product_id; 
     this.productData = data.product_data; 
     this.imageID = data.product_data.image_id; 
     this.text = data.product_data.text; 
     this.link = data.product_data.link; 
     this.imageUrl = data.product_data.image_url; 
    } 

    $.getJSON("json.json?sdfsdfg").done(function (data) { 

     var allPosts = $.map(data,function (item) { 

      for (var i = 0; i < item.length; i++) { 
       new getData(item[i]); 
      }; 

     }); 

    }); 

Ошибка в вашем коде было то, что вы сделали return в своем вызове AJAX, поэтому он выполнялся только один раз.

Answer 4

Правильный способ перебора объектов

Object.keys(someObject).map(function(item)... 
Object.keys(someObject).forEach(function(item)...; 

// ES way 
Object.keys(data).map(item => {...}); 
Object.keys(data).forEach(item => {...}); 

Read here for details

Answer 5

Вы всегда можете сделать следующее:

const SomeCall = request.get(res => { 

const Store = []; 
Store.push(res.data); 

Store.forEach(item => { DoSomethingNeat 
}); 
});