利用JavaScript中对JSON对象的基本操作示例（图文教程）-js教程-PHP中文网

利用JavaScript中对JSON对象的基本操作示例（图文教程）

亚连

发布： 2018-05-21 13:37:20

原创

1262人浏览过

json格式本就发自于javascript中的对象和数组,所以js操作起来自然也是最为简单原始,接下来我们就来看一些常用的javascript中对json对象的基本操作示例

JSON对象

1、对象的属性：
对象的属性是有键值对组成的，其中key为一个字符串，value可以为任何的Javascript对象。

//使用[]设置和获取对象的属性
var obj = new Object();
obj["www.jb51.net"] = "http://www.jb51.net";
alert(obj["www.jb51.net"]);

登录后复制

2、变量既是属性：
Javascript引擎在初始化时会构建一个全局对象，所有的变量都是这个全局对象的属性。为了引用这个全局对象，可以再顶级作用域中这样获取：

立即学习“Java免费学习笔记（深入）”；

var global = this;

登录后复制

在Javascript中，任何独立的函数或者变量都属于这个对象的属性，即：

function test(){}

登录后复制

相当于：

window.test = function(){}

登录后复制

3、使用对象：
声明对象的三种方式：

① 通过new操作符创建一个Object对象，然后动态地添加属性，从无到有构造一个对象
② 定义对象的类圆形，然后使用new操作符来批量构造新的对象

//创建一个对象
function User(username, password){
  this.username = username;
  this.password = password;
  this.getUsername = function(){
    return this.username;
  }
  this.getPassword = function(){
    return this.password;
  }
}
var arthinking = new User("Jason", "123");
alert(arthinking.getUsername());
alert(arthinking.getPassword());

登录后复制

③ 使用JSON构造对象
JSON即Javascript对象表示方法（Javascript Object Notation），也就是通过字面量来表示一个对象：

//JSON形式创建一个对象
var arthinking = {
  username : "Jason",
  password : "123",
  favorite : {
    sports : "football",
    music : "Guitar"
  }
}
alert(arthinking.username);
alert(arthinking.favorite.sports);

登录后复制

解析由服务器返回的JSON格式数据
单个JSON对象：

[{a:'1',b'2'},{a:'3',b'4'}]

登录后复制

多个JSON对象：

{
"usergroups":[{a:'001',b:'arthinking'},a:'002',b:'Jason'}],
"groups":[{c:'001',d:'IT宅'}]
}

登录后复制

可以根据这种格式先从后台封装好需要传递的数据，前台获取到后可以这样解析获取数据：

//假设response.responseText为返回的JSON字符串
//可以使用eval()函数把JSON字符串转换成Javascript语句
//再通过”.”导航获取具体属性，length属性为对象的长度
var obj = eval( "(" + response.responseText + ")" );
for(var i = 0; i<obj.usergroups.length; i++){
  var groupid = obj.usergroups[i].a;
  var usergroup=obj.groups;
  for(var j=0; j<usergroup.length; j++){
    if(usergroup[j].c == groupid){
      alert(groupid);
 }
  }
}

登录后复制

上面是我整理给大家的，希望今后会对大家有帮助。

javascript实现Java中的Map对象功能的（详细解答，附上代码）

JavaScript创建对象的七种方式（总结，必读）

JavaScript构造函数及new运算符（重点，必读）

以上就是利用JavaScript中对JSON对象的基本操作示例（图文教程）的详细内容，更多请关注php中文网其它相关文章！