Question

我有一个对象，其中我只想读取id。

我正在尝试使用此代码读取对象。

.header-wrapper {
    width: 100%;
    height: 80px;
    z-index: 10;
    position: relative;
    min-height: 80px;
}

但它给了我错误

SyntaxError：JSON.parse：JSON数据第1行第1列的意外字符

完整的HTML代码。

var d = JSON.parse(data);
    for (var i = 0; i < 4; i++) {
        arr.push(d['maps'][i].age);
        }

下面是我的对象定义：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title> </title>
     <script src="https://cdn.plot.ly/plotly-latest.min.js"></script>
     <script src="js/jquery.js" ></script>
     <script src="js/test.json"></script>
</head>
<body>
     <div id="myDiv"><!-- Plotly chart will be drawn inside this DIV --></div>
  <script>
    <!-- JAVASCRIPT CODE GOES HERE -->
    var arr = [];
    var d = JSON.parse(data);
    for (var i = 0; i < 4; i++) {
        arr.push(d['maps'][i].age);
        }

    console.log(arr)    
    var trace1 = {
  x: arr, 
  y: [10, 15, 13, 17], 
  type: 'scatter'
};
var trace2 = {
  x: arr, 
  y: [16, 5, 11, 9], 
  type: 'scatter'
};
var data = [trace1, trace2];
Plotly.newPlot('myDiv', data);
  </script>
</body>
</html>

对象有什么问题？还是我的代码？

Answer 1

按照以下示例，我无法复制您的问题。 我怀疑您的本地文件缺少开头/结尾引号，导致解析器出现问题。

编辑：您的实际问题似乎是尝试使用data解析对象（JSON.parse()）。 JSON.parse()需要一个字符串。你已经有了一个有效的对象。

var data = `
{
    "maps": [
        {
            "id": "1",
            "iscategorical": "0"
        },
        {
            "id": "2",
            "iscategorical": "0"
        },
        {
            "id": "3",
            "iscategorical": "0"
        }
    ]
}
`;

data
> "{
>     "maps": [
>         {
>             "id": "1",
>             "iscategorical": "0"
>         },
>         {
>             "id": "2",
>             "iscategorical": "0"
>         },
>         {
>             "id": "3",
>             "iscategorical": "0"
>         }
>     ]
> }"

var out = JSON.parse(data);

out['maps'].map(({id}) => id);
> ["1", "2", "3"]

Answer 2

好吧，看看你的代码，我注意到该对象没有＆＃34; age＆＃34;地图中的值，您通过三个项目循环4次。我没有收到您报告的错误。看看这个片段并告诉我你的想法：

＆＃13;

var data = '{ "maps": [{"id": "1","iscategorical": "0"},{"id": "2", "iscategorical": "0"}, {"id": "3", "iscategorical": "0" }]}';

var arr = [];
var d = JSON.parse(data);
for (var i = 0; i < 3; i++) {
    arr.push(d['maps'][i].id);
}

console.log(arr);

＆＃13;

Answer 3

由于您从.json文件中提取，因此您不应该使用JSON.parse（）对其进行反序列化。仅当json数据存储为字符串时才会使用此方法。

以这种方式尝试您的代码：

var d = data;
for (var i = 0; i < 4; i++) {
    arr.push(d['maps'][i].age);
}

你也在迭代你的for循环4次（零索引），但你的json只有三个项目。这会引发错误。而是使用length属性来确定循环次数。

for (var i = 0; i < d.length; i++) {
    arr.push(d['maps'][i].age);
}

此外，没有年龄＆＃39;你的json示例的参数，因此会抛出错误。

如何读取对象的特定属性

3 个答案: