web-dev-qa-db-fra.com

data.map n'est pas une fonction

Je me frappe la tête contre une erreur, je ne peux pas résoudre le problème. J'ai le suivant;

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"
        }
    }
]}

et le jQuery suivant

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);
    });
});

pourtant je reçois une erreur que map.data n'est pas défini en tant que fonction? En le regardant, je ne sais pas ce qui ne fonctionne pas car je l'ai copié dans un nouveau projet à partir de code utilisé précédemment. La seule chose différente est la source JSON. Le précédent n'avait pas les {"produits": partie avant les crochets []. Est-ce que c'est ça qui me jette?

jqueryjson
47
mrcat

Objets, {}, en JavaScript n'a pas la méthode .map(), c'est seulement pour Arrays , []. 

Donc, pour que votre code fonctionne, changez data.map() en data.products.map() puisque products est un tableau sur lequel vous pouvez effectuer une itération.

78
Henrik Andersson

La bonne façon de parcourir les objets est

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

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

Lire ici pour plus de détails

29
user3930374

data n'est pas un tableau, c'est un objet avec un tableau de produits, donc itérer sur data.products

var allProducts = data.products.map(function (item) {
    return new getData(item);
});
2
Arun P Johny
this.$http.get('https://pokeapi.co/api/v2/pokemon')
.then(response => {
   if(response.status === 200)
   {
      this.usuarios = response.data.results.map(usuario => {
      return { name: usuario.name, url: usuario.url, captched: false } })
          }
    })
.catch( error => { console.log("Error al Cargar los Datos: " + error ) } )
0
Fernando Betancourt

Vous pouvez toujours faire ce qui suit: 

const SomeCall = request.get(res => { 

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

Store.forEach(item => { DoSomethingNeat 
});
});
0
Daniel Ryan Snell

Si vous souhaitez mapper un objet, vous pouvez utiliser Lodash. Assurez-vous simplement qu'il est installé via NPM ou Yarn et importez-le.

Avec Lodash:

Lodash fournit une fonction _.mapValues pour mapper les valeurs et conserver les clés.

_.mapValues({ one: 1, two: 2, three: 3 }, function (v) { return v * 3; });

// => { one: 3, two: 6, three: 9 }
0
Bill King

data doit être un objet Json, veuillez vous assurer de ce qui suit:

data = $ .parseJSON (data);

Maintenant, vous pouvez faire quelque chose comme:

data.map (function (...) { ...});

J'espère que cela aidera quelqu'un

0
Kenlly Acosta