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 常用操作代码
Mar 14 Javascript
今天是星期几的4种JS代码写法
Sep 17 Javascript
jQuery 获取浏览器所在的IP地址的小例子
Nov 08 Javascript
简单分析javascript面向对象与原型
May 21 Javascript
javascript中利用柯里化函数实现bind方法【推荐】
Apr 29 Javascript
解决bootstrap导航栏navbar在IE8上存在缺陷的方法
Jul 01 Javascript
jQuery操作之效果详解
May 19 jQuery
React学习笔记之事件处理(二)
Jul 02 Javascript
原生js实现仿window10系统日历效果的实例
Oct 31 Javascript
jquery应用实例分享_实现手风琴特效
Feb 01 jQuery
vue-cli2.0转3.0之项目搭建的详细步骤
Dec 11 Javascript
JavaScript实现像雪花一样的Hexaflake分形
Jul 07 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音乐采集(部分代码)
2007/02/14 PHP
php仿ZOL分页类代码
2008/10/02 PHP
PHP中的strtr函数使用介绍(str_replace)
2011/10/20 PHP
PHP常用技巧总结(附函数代码)
2012/02/04 PHP
PHP循环结构实例讲解
2014/02/10 PHP
解决Laravel 不能创建 migration 的问题
2019/10/09 PHP
背景音乐每次刷新都可以自动更换
2007/02/01 Javascript
封装的原生javascript弹出层代码
2010/09/24 Javascript
js下关于onmouseout、事件冒泡的问题经验小结
2010/12/09 Javascript
基于Jquery的标签智能验证实现代码
2010/12/27 Javascript
js的alert样式如何更改如背景颜色
2014/01/22 Javascript
Blocksit插件实现瀑布流数据无限( 异步)加载
2014/06/20 Javascript
jquery实现的点击翻书效果代码
2015/11/04 Javascript
JavaScript实现点击按钮直接打印
2016/01/06 Javascript
AngularJs Scope详解及示例代码
2016/09/01 Javascript
JSP防止网页刷新重复提交数据的几种方法
2016/11/19 Javascript
JS实现颜色梯度与渐变效果完整实例
2016/12/30 Javascript
angular十大常见问题
2017/03/07 Javascript
JavaScript简介_动力节点Java学院整理
2017/06/26 Javascript
vue-scroller记录滚动位置的示例代码
2018/01/17 Javascript
自己动手封装一个React Native多级联动
2018/09/19 Javascript
uni-app 支持多端第三方地图定位的方法
2020/01/03 Javascript
Jquery cookie插件实现原理代码解析
2020/08/04 jQuery
Python实现压缩与解压gzip大文件的方法
2016/09/18 Python
Python标准库06之子进程 (subprocess包) 详解
2016/12/07 Python
Face++ API实现手势识别系统设计
2018/11/21 Python
python3+selenium自动化测试框架详解
2019/03/17 Python
python 创建一维的0向量实例
2019/12/02 Python
python一些性能分析的技巧
2020/08/30 Python
俄罗斯奢侈品牌衣服、鞋子和配饰的在线商店:INTERMODA
2020/07/17 全球购物
JSF面试题:如何管量web层中的Bean,用什么标签。如何通过jsp页面与Bean绑定在一起进行处理?
2012/10/05 面试题
青年教师典范事迹材料
2014/01/31 职场文书
模具毕业生推荐信
2014/02/15 职场文书
通用自荐信范文
2014/03/14 职场文书
个人求职意向书
2015/05/11 职场文书
介绍信应该怎么开?
2019/04/03 职场文书