Question

我希望我的JavaScript从外部JSON文件读取，该文件是n个对象的数组，并且n大。因此，最好是，我想写一个数组，每个对象占一行。但是，我发现只有在所有内容都放在一行中时它才起作用。任何线路中断都会把事情弄糟。我想知道为什么。下面，我使用一个简化的示例进行说明。奇怪！

起作用的data.json文件。

data = '[{"name": "Ashwin","age": "20"},{"name": "Abhinandan","age": "21"}]';

无效的data.json文件。

data = '[{"name": "Ashwin","age": "20"},
         {"name": "Abhinandan","age": "21"}]';

带有javascript的.html

<script type="text/javascript" src="data.json"></script>
<script>
var mydata = JSON.parse(data);
alert(mydata[0].name);
alert(mydata[0].age);
alert(mydata[1].name);
alert(mydata[1].age);
</script>

Answer 1

如果不使用反斜杠字符将转义字符转义，则不能在JS字符串文字中使用换行符。您可以使用换行符，而无需在JS字符串模板中转义它们。这两个示例都显示在下面的代码段中：

let data = '[{"name": "Ashwin","age": "20"},\
         {"name": "Abhinandan","age": "21"}]';
         
console.log(JSON.parse(data));

data = `[{"name": "Ashwin","age": "20"},
         {"name": "Abhinandan","age": "21"}]`;
         
console.log(JSON.parse(data));

Answer 2

您所拥有的是无效的JSON文件。相反，您有一个js文件。有两种解决方法：

使用正确的JSON文件：

data.json：

[
    {"name": "Ashwin","age": "20"},
    {"name": "Abhinandan","age": "21"}
]

html：

<script>
fetch('data.json').then(function(result){
    var mydata = JSON.parse(result);
    alert(mydata[0].name);
    alert(mydata[0].age);
    alert(mydata[1].name);
    alert(mydata[1].age);
});
</script>

或者只是使用javascript传递数据

data.js：

// Notice that the code below is not JSON,
// it is a regular javascript array assigned
// to a global variable (no "var"):
data = [
    {"name": "Ashwin","age": "20"},
    {"name": "Abhinandan","age": "21"}
];

// Notice also that unlike JSON, this file
// can contain comments and other code!

html：

<script type="text/javascript" src="data.js"></script>
<script>
// Notice that since you've imported an array and not
// a JSON data you don't need to JSON.parse:
alert(data[0].name);
alert(data[0].age);
alert(data[1].name);
alert(data[1].age);
</script>

正确的JSON格式：JSON数组中的每个项目都不允许换行吗？

2 个答案: