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 相关文章推荐
初窥JQuery(二) 事件机制(1)
Nov 25 Javascript
页面只能打开一次Cooike如何实现
Dec 04 Javascript
JQuery 使用attr方法实现下拉列表选中
Oct 13 Javascript
js获取数组的最后一个元素
Apr 14 Javascript
JS实现的打字机效果完整实例
Jun 20 Javascript
JS图片放大效果简单实现代码
Sep 08 Javascript
用Angular实时获取本地Localstorage数据,实现一个模拟后台数据登入的效果
Nov 09 Javascript
用p5.js制作烟花特效的示例代码
Mar 21 Javascript
AngularJs1.x自定义指令独立作用域的函数传入参数方法
Oct 09 Javascript
React+TypeScript+webpack4多入口配置详解
Aug 08 Javascript
小程序实现投票进度条
Nov 20 Javascript
原理深度解析Vue的响应式更新比React快
Apr 04 Javascript
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技术开发技巧分享
2010/03/23 PHP
PHP多线程抓取网页实现代码
2010/07/22 PHP
php中explode与split的区别介绍
2012/10/03 PHP
解析php中call_user_func_array的作用
2013/06/07 PHP
Yii把CGridView文本框换成下拉框的方法
2014/12/03 PHP
tp5框架使用composer实现日志记录功能示例
2019/01/10 PHP
PHP快速导出百万级数据到CSV或者EXCEL文件
2020/11/27 PHP
一些常用的JS功能函数代码
2009/06/23 Javascript
IE Firefox 使用自定义标签的区别
2009/10/15 Javascript
extJs 常用到的增,删,改,查操作代码
2009/12/28 Javascript
用jQuery扩展自写的 UI导航
2010/01/13 Javascript
JQuery写动态树示例代码
2013/07/31 Javascript
js实现弹窗插件功能实例代码分享
2013/12/12 Javascript
JavaScript实现的简单拖拽效果
2015/06/01 Javascript
jquery衣服颜色选取插件效果代码分享
2015/08/28 Javascript
跟我学习javascript的call(),apply(),bind()与回调
2015/11/16 Javascript
提升jQuery的性能需要做好七件事
2016/01/11 Javascript
bootstrap Validator 模态框、jsp、表单验证 Ajax提交功能
2017/02/17 Javascript
15个简单的JS编码标准让你的代码更整洁(小结)
2020/07/16 Javascript
JavaScript实现沿五角星形线摆动的小圆实例详解
2020/07/28 Javascript
[01:02:32]DOTA2-DPC中国联赛 正赛 iG vs PSG.LGD BO3 第二场 2月26日
2021/03/11 DOTA
Python中无限元素列表的实现方法
2014/08/18 Python
python将txt等文件中的数据读为numpy数组的方法
2018/12/22 Python
圣彼得堡鲜花配送:Semicvetic
2020/09/15 全球购物
大二学生学习个人自我评价
2014/01/19 职场文书
护理专科自荐书范文
2014/02/18 职场文书
商务日语专业毕业生自荐信
2014/03/27 职场文书
贷款委托书范本
2014/04/08 职场文书
企业安全生产演讲稿
2014/05/09 职场文书
科技节口号
2014/06/19 职场文书
统计学教授推荐信
2014/09/18 职场文书
中秋客户感谢信
2015/01/22 职场文书
党支部鉴定意见
2015/06/02 职场文书
解决Jupyter-notebook不弹出默认浏览器的问题
2021/03/30 Python
Java字符串逆序方法详情
2022/03/21 Java/Android
python绘制简单直方图(质量分布图)的方法
2022/04/21 Python