前言:说白了,用双引号括起来的数组就是字符串数组,也就是我们常见的JSON数据,在我们的实际开发中,很多情况下,后端返回过来的数据都是json数据,所以当我们在使用这些数据的时候,先要把它转换成js对象,再来操作。

首先我们先了解一下什么是JSON数据?

JSON (JavaScript Object Notation) 一种简单的数据格式,比Xml更轻巧。JSON 是JavaScript原生格式,这意味着在JavaScript中处理JSON数据不需要任何特殊的API 或者工具包。JSON的规则很简单:对象是一个无序的“名称/值”对集合。一个对象以"{"(左括号)开始,“}”(右括号)结束。每个"名称"后跟一个":"(冒号);“名称/值”对之间使用","(逗号)分隔。

它是一种严格的JS对象的格式,JSON属性名称必须有双引号,如果值是字符串,也必须是双引号;

JSON数据与JS对象的区别

区别 JSON JavaScript
含义 仅仅是一种数据格式 表示类的实例
传输 可以跨平台传输数据,速度快 不能传输
表现 1、值是以键值对的方式,键名和键值都必须加双引号
2、值不能是方法函数,不能是undefined / NaN
1、值也是键值对方式,键名不加双引号
2、值可以是函数、对象、字符串、数字、boolean等
相互转换 JSON转换JS对象
1、JSON.parse(Jsonstr); 不兼容IE7
2、eval("("+Jsonstr+")"); 兼容所有浏览器,但不安全
js对象转换Json
JSON.stringify(jsObj);
其他 调用JSON官网的JS,实现parse和stringify在谷歌浏览器的兼容

总而言之,你可以理解JSON是JS下的数据格式,他从属于JS,并且在处理JSON数据时可以直接使用JS内置的API方法;

接下来说正事,我昨天遇到的一个问题

加入后端返回过来的数据如下:

 data:{
	arrList:[{carousel:"[{"url":"http://img.nodebook.jpg"}]"}]

从上面代码我们可以知道,返回的是一个 data对象,data对象里面有一个arrList数组,数组里面的值又是以对象的形式存在,对象中有一个carousel属性,carousel属性的值就是 以JSON数据格式存在的。

昨天我想取到url的值,却怎么也取不到,到后来发现是我东西搞错了。
我昨天是这样取的, data.arrList[0].carousel[0].url
到后来才发现,carousel 的属性值并不是一个数组,要经过处理才能取到。

JSON转换为JS数组;
JSON.parse(data.arrList[0].carouse)[0].url 这样才能取到url的值
打印console.log(JSON.parse(data.arrList[0].carouse)[0].url)
打印结果: http://img.nodebook.jpg

附上图片:
转换之前,图片显示不出来
在这里插入图片描述
转换之后
在这里插入图片描述
在这里插入图片描述
现在图片也出来了;

前言:说白了,用双引号括起来的数组就是字符串数组,也就是我们常见的JSON数据,在我们的实际开发中,很多情况下,后端返回过来的数据都是json数据,所以当我们在使用这些数据的时候,先要把它转换成js对象,再来操作。首先我们先了解一下什么是JSON数据?JSON (JavaScript Object Notation) 一种简单的数据格式,比Xml更轻巧。JSON 是JavaScript原生格式... @ResponseBody //shopcode要与前端jskey对应 public void name(@RequestParam("shopcode") String shopcode) { // "shopcode"前台传来的json对象数组 JSONArray pic for (var p1 in res.data) { if ( res.data.hasOwnProperty(p1)){ this.list_new.push(res.data[p1]) console.log(p1)
Vue项目读本地json文件数据的方法如下: 创建一个json文件,比如data.json,并保存在项目目录下的static文件夹里 在Vue组件引入json文件,例如: <script> import data from '@/static/data.json' export default { data() { return { jsonData: data </script> 在模板使用json数据:
这两天在学习vue,主要是为了实现前后端的分离,因此数据的传输是必不可少的一个环节。 为了快速入门,参考了vue官网的视频,这个过程由于引入vue.js的问题走了一些弯路,这个我们以后再来探讨,因为现在主要讲的是JSON数组JSON对象。 在这个截图(截了好几次才完美截下),红框部分是从API获数据,间的语法等我们也在以后再讨论。 我发现照着这个模板来做的话,可以正常获到数据,然而...
public class Main { public static void main(String[] args) { String jsonStr = "[{\"name\":\"Tom\",\"age\":18},{\"name\":\"Jerry\",\"age\":20}]"; Gson gson = new Gson(); Person[] persons = gson.fromJson(jsonStr, Person[].class); for (Person person : persons) { System.out.println(person.getName() + " " + person.getAge()); class Person { private String name; private int age; public String getName() { return name; public void setName(String name) { this.name = name; public int getAge() { return age; public void setAge(int age) { this.age = age; 输出结果为: Tom 18 Jerry 20