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 相关文章推荐
javascript操作JSON的要领总结
Dec 09 Javascript
JS将秒换成时分秒实现代码
Sep 03 Javascript
简介JavaScript中POSITIVE_INFINITY值的使用
Jun 05 Javascript
深入理解JavaScript编程中的同步与异步机制
Jun 24 Javascript
jquery实现的仿天猫侧导航tab切换效果
Aug 24 Javascript
延时加载JavaScript代码提高速度
Dec 27 Javascript
jQuery autoComplete插件两种使用方式及动态改变参数值的方法详解
Oct 24 Javascript
EasyUI 结合JS导出Excel文件的实现方法
Nov 10 Javascript
js+html制作简单验证码
Feb 16 Javascript
ant-design-vue按需加载的坑的解决
May 14 Javascript
JS监听Esc 键触发事键
Apr 14 Javascript
Vue中使用import进行路由懒加载的原理分析
Apr 01 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
多个iframe自动调整大小的问题
2006/09/18 Javascript
javascript Array.remove() 数组删除
2009/08/06 Javascript
display和visibility的区别示例介绍
2014/02/26 Javascript
jquery数组过滤筛选方法grep()简介
2014/06/06 Javascript
js 去除字符串第一位逗号的方法
2014/06/07 Javascript
浅谈 javascript 事件处理
2015/01/04 Javascript
Javascript中的Callback方法浅析
2015/03/15 Javascript
jQuery.trim() 函数及trim()用法详解
2015/10/26 Javascript
javascript常见数字进制转换实例分析
2016/04/21 Javascript
jQuery封装的屏幕居中提示信息代码
2016/06/08 Javascript
js/jquery控制页面动态加载数据 滑动滚动条自动加载事件的方法
2017/02/08 Javascript
bootstrap基本配置_动力节点Java学院整理
2017/07/14 Javascript
vue Render中slots的使用的实例代码
2017/07/19 Javascript
Vue CLI3搭建的项目中路径相关问题的解决
2018/09/17 Javascript
vue组件开发props验证的实现
2019/02/12 Javascript
uni-app实现点赞评论功能
2019/11/25 Javascript
Vue脚手架编写试卷页面功能
2020/03/17 Javascript
JavaScript ES6 Class类实现原理详解
2020/05/08 Javascript
[02:11]DOTA2上海特级锦标赛主赛事第二日RECAP
2016/03/04 DOTA
python判断windows系统是32位还是64位的方法
2015/05/11 Python
Python实现对象转换为xml的方法示例
2017/06/08 Python
python生成二维码的实例详解
2017/10/29 Python
Python中的十大图像处理工具(小结)
2019/06/10 Python
python里dict变成list实例方法
2019/06/26 Python
python suds访问webservice服务实现
2020/06/26 Python
python更新数据库中某个字段的数据(方法详解)
2020/11/18 Python
CSS3实现多重边框的方法总结
2016/05/31 HTML / CSS
Ajax实现页面无刷新留言效果
2021/03/24 Javascript
人事专员岗位职责
2013/11/20 职场文书
优秀毕业生求职信范文
2014/01/02 职场文书
2015年五一劳动节演讲稿
2015/03/18 职场文书
银行培训心得体会范文
2016/01/09 职场文书
2019年鼓励无偿献血倡议书
2019/09/17 职场文书
python获取淘宝服务器时间的代码示例
2021/04/22 Python
Mybatis-plus在项目中的简单应用
2021/07/01 Java/Android
开发微信小程序之WXSS样式教程
2022/04/18 HTML / CSS