JavaScript中对JSON对象的基本操作示例


Posted in Javascript onMay 21, 2016

JSON对象

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

//使用[]设置和获取对象的属性
var obj = new Object();
obj["3water.com"] = "https://3water.com";
alert(obj["3water.com"]);

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

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 相关文章推荐
Js切换功能的简单方法
Nov 23 Javascript
JS字符串函数扩展代码
Sep 13 Javascript
JavaScript之引用类型介绍
Aug 10 Javascript
js创建元素(节点)示例
Jan 02 Javascript
深入理解javascript原型链和继承
Sep 23 Javascript
javascript实现复选框超过限制即弹出警告框的方法
Feb 25 Javascript
jQuery使用hide方法隐藏页面上指定元素的方法
Mar 30 Javascript
jQuery页面元素动态添加后绑定事件丢失方法,非 live
Jun 16 Javascript
说说如何利用 Node.js 代理解决跨域问题
Apr 22 Javascript
javascript异步编程的六种方式总结
May 17 Javascript
自定义javascript验证框架示例【附源码下载】
May 31 Javascript
vue基于Echarts的拖拽数据可视化功能实现
Dec 04 Vue.js
iscroll碰到Select无法选择下拉刷新的解决办法
May 21 #Javascript
jQuery EasyUI Pagination实现分页的常用方法
May 21 #Javascript
总结JavaScript设计模式编程中的享元模式使用
May 21 #Javascript
在JavaScript中模拟类(class)及类的继承关系
May 20 #Javascript
基于Node.js的JavaScript项目构建工具gulp的使用教程
May 20 #Javascript
JavaScript中用let语句声明作用域的用法讲解
May 20 #Javascript
如何用JavaScript实现动态修改CSS样式表
May 20 #Javascript
You might like
PHP网站备份程序代码分享
2011/06/10 PHP
PHP将两个关联数组合并函数提高函数效率
2014/03/18 PHP
php生成二维码图片方法汇总
2016/12/17 PHP
不错的新闻标题颜色效果
2006/12/10 Javascript
善用事件代理,警惕闭包的性能陷阱。
2011/01/20 Javascript
封装了一个js图片轮换效果的函数
2011/09/28 Javascript
利用js(jquery)操作Cookie的方法说明
2013/12/19 Javascript
js中的setInterval和setTimeout使用实例
2014/05/09 Javascript
jQuery后代选择器用法实例
2014/12/23 Javascript
javascript引用类型之时间Date和数组Array
2015/08/27 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
JS生成不重复的随机数组的简单实例
2016/07/10 Javascript
JS实现的表头列头固定页面功能示例
2017/01/10 Javascript
jQuery实现ajax回调函数带入参数的方法示例
2018/06/26 jQuery
webpack DllPlugin xxx is not defined解决办法
2019/12/13 Javascript
python实现的简单窗口倒计时界面实例
2015/05/05 Python
Python实现查找匹配项作处理后再替换回去的方法
2017/06/10 Python
Python使用回溯法子集树模板解决爬楼梯问题示例
2017/09/08 Python
Python探索之实现一个简单的HTTP服务器
2017/10/28 Python
基于pandas数据样本行列选取的方法
2018/04/20 Python
Django开发的简易留言板案例详解
2018/12/04 Python
Python中按值来获取指定的键
2019/03/04 Python
Python如何使用27行代码绘制星星图
2020/07/20 Python
Python pip使用超时问题解决方案
2020/08/03 Python
用HTML5的canvas实现一个炫酷时钟效果
2016/05/20 HTML / CSS
皇家阿尔伯特英国官方商店:Royal Albert骨瓷
2019/03/25 全球购物
构造方法和其他方法的区别?怎么调用父类的构造方法
2013/09/22 面试题
2013的个人自我评价
2013/12/26 职场文书
初一生物教学反思
2014/01/18 职场文书
护理专业自我鉴定
2014/01/30 职场文书
小学综合实践活动总结
2014/07/07 职场文书
八荣八耻演讲稿
2014/09/15 职场文书
岗位竞聘报告范文
2014/11/06 职场文书
法律意见书范文
2015/05/20 职场文书
mybatis调用sqlserver存储过程返回结果集的方法
2021/05/08 SQL Server
MySQL慢查询中的commit慢和binlog中慢事务的区别
2022/06/16 MySQL