Data.map 不是函数

Question

我正在尝试为一个学校项目建立一个网站。我设置了所有内容，但出现错误“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}`);
});

当我连接到医生页面时，我会加载一个包含所有医生的 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/

Answer 1

要映射 json 对象...data 必须是对象...不是字符串。

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

这里是用.map()方法链接的：

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

但你本可以做（同样的事情）：

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

记住taplar提到的检查变量类型的有用技巧：

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

typeof() 是一个很好的调试技巧...有时需要在某些情况下使用它以避免错误（例如，如果脚本使用不同的源）。

;)

Answer 2

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

你可以自己解析数据

var stuff = JSON.parse(data);

你可以自己手动解析。

你可以让 jQuery 显式解析它

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

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

你可以让jQuery隐式解析它

这是通过在响应上设置Content-Type: application/json 来完成的。当 jQuery 得到响应时，它会检查这个 header 以尝试智能地猜测响应是什么并处理它。

根据这个堆栈溢出帖子，Proper way to return JSON using node or Express，您可以在节点中这样做...

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