代码之家 › 专栏 › 技术社区 › Mattia Surricchio

data.map不是函数

node.js json jquery javascript

Mattia Surricchio · 技术社区 · 6 年前

我想为学校的一个项目建立一个网站。我设置了所有内容,但得到错误“data.map不是函数”。实际上我不是专家,我只是想理解和复制老师给我们的代码(在node.js中几乎什么都没做)。

我使用node.js构建了服务器

const express = require("express");
const app = express();
const process = require("process");
const bodyParser = require("body-parser");

let serverPort = process.env.PORT || 5000;

app.use(express.static(__dirname + "/public"));

app.set("port", serverPort);

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));

app.get('/doctors', function(req,res){
    var config = require('./doctor.json');
    res.send(JSON.stringify(config));
})

/* Start the server on port 3000 */
app.listen(serverPort, function() {
    console.log(`Your app is ready at port ${serverPort}`);
});

当我连接到doctor页面时,我加载一个包含所有医生的json文件并将其发送回客户端。这是json

[{
        "id": 0,
        "born": 2010,
        "tag": "cat",
        "name": "Eleanore"
    }, {
        "id": 1,
        "born": 2010,
        "tag": "dog",
        "name": "Katelin"
    }, {
        "id": 2,
        "born": 2012,
        "tag": "dog",
        "name": "Shea"
    }, {
        "id": 3,
        "born": 2011,
        "tag": "cat",
        "name": "Stephen"
    }, {
        "id": 4,
        "born": 2011,
        "tag": "cat",
        "name": "Rosanne"
    }, {
        "id": 5,
        "born": 2011,
        "tag": "cat",
        "name": "Alexa"
    }
]

然后加载json并动态创建项。这是我的客户端代码:

$.get('/doctors', function (data) {
    $("<div class='row' id='dottori' ></div>").appendTo(".team");

    data.map(addElement);
});

function addElement(doctor){
    console.log("Adding doctor");
    $("#dottori").append('<p> '+doctor.name+'</p>');

我不断地得到这个错误,即使我将json文件进行了字符串化(与我的教授所做的相同),您也可以在这里找到原始代码: https://bitbucket.org/polimi-hyp-2017-10173412/polimi-hyp-2018-project/src/master/

2 回复 | 直到 6 年前

Louys Patrice Bessette 6 年前

映射json 对象 … data 一定是个物体…不是绳子。

它是作为字符串接收的…所以你只需要把它解析成一个对象。

在这里,它和 .map() 方法:

JSON.parse(data).map(addElement);

但你也可以做同样的事:

var dataObj = JSON.parse(data);
dataObj.map(addElement);

记住检查变量类型的有用技巧 taplar :

console.log(typeof(variable-to-check));

typeof() 是一个很好的调试技巧…有时在某些情况下,为了避免错误(比如脚本使用不同的源代码),有必要使用它。

;)

Taplar 6 年前

数据接收人 $.ajax() ,以及它的任何包装器方法都将以文本形式接收响应。如果要将此响应作为从json解析的对象处理,则必须执行以下操作之一。

你可以自己分析数据

var stuff = JSON.parse(data);

你可以自己手动解析它。

您可以让jquery显式地解析它

$.ajax({ url: ..., contentType: 'json' })

提供 contentType 值为的参数 json 将告诉jquery响应应该是json,并在将其提供给回调之前自动解析它。

您可以让jquery隐式地解析它。

这是通过设置 Content-Type: application/json 关于回应。当jquery得到响应时,它将检查这个头,试图智能地猜测响应是什么并处理它。

根据这个堆栈溢出柱, Proper way to return JSON using node or Express ,您可以在节点中通过…

res.setHeader('Content-Type', 'application/json');