data.map不是函数


101

我为无法解决的错误而b之以鼻。我有以下内容;

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":[]括号之前的部分。这是什么让我失望吗?


64
请不要再ash头了-我们会解决这个问题的
马克C.15年

map.data或data.map?
depperm 2015年

Answers:


172

{}JavaScript中的对象没有方法.map()。仅适用于数组[]

因此,为了使您的代码正常工作,请更改data.map()为,data.products.map()因为products您可以对其进行迭代。


iwow它能正常工作,非常感谢,我也有同样的问题,数据之前还有一行
Anoop PS

61

迭代对象的正确方法是

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

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

在这里阅读详细信息


10
有时您可能会在寻找值而不是键> Object.values(someObject).map(function(item)... //而不是键
Ram

5

简单的答案是将“数据”放入一对方括号(即[data]):

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

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

     });

在这里,[data]是一个数组,可以在其上使用“ .map”方法。这个对我有用! 在此处输入图片说明



1

如果要映射对象,则可以使用Lodash。只需确保通过NPM或Yarn安装并导入即可。

使用Lodash:

Lodash提供了_.mapValues映射值和保留键的功能。

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

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

0

您始终可以执行以下操作:

const SomeCall = request.get(res => { 

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

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

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

您好Fernando,欢迎来到Stack Overflow!这是仅英文网站。我已将您的答案部分用英语发布的内容进行了编辑。随时翻译并重新添加。
鲸鱼巫师皮卡

0

数据需要是Json对象,为此,请确保遵循以下条件:

data = $.parseJSON(data);

现在您可以执行以下操作:

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

希望对您有所帮助


-1

$.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调用中进行的,因此仅执行了一次。

By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.