js数组如何添加json数据及js数组与json的区别


Posted in Javascript onOctober 27, 2015

 JSON(JavaScript Object Notation )是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,JSON是JavaScript原生数据格式。

下面给大家介绍js数组添加json数据的两种方式。

// 第一种方式

personInfo
: [],
for(var i = 0; i < _STAGE.passengerInfoArray.length; i++){
var name = _STAGE.passengerInfoArray[i];
var person = {v:name, text:name};
this.personInfo.push(person);
}

// 第二种方式

var passengerInfo = {};
passengerInfo.psgTypeDesc = psgTypeDesc;
passengerInfo.flightPrice = flightPrice;
_STAGE.passengerInfoArray.push(passengerInfo);

js数组与 json 的区别

一,数组

     1. 定义一维数组:var s1=new Array();

                       s1=[1,2,3,4]或者s1[0]=1,s1[1]=2,s1[3]=3,s1[4]=4;
                      alert(s1[0]);

                       结果为1;

   2,,定义二维素组:var s1=new Array();

                               var s1=[[3,1],[2,3,4],3,[4,5,6,7,8]];
                                 alert(s1[1][0]);

                               结果为2;

 二,定义json对象

    1,json对象       

var status_process = {
       " name5" : '闲置期',
     "name1" : '播种期',
     "name2" : '苗期',
     "name3" : '生长期',
     "name4" : '采收期'
    }    
   alert(status_process);

      结果为:Object:Object;

  2,json字符串

              所谓json字符串,是指该字符串变量的值与json的格式相同,但是不是json对象,比如:

var s1="{";
       var s2 = " 'name5' : '闲置期',  'name1' : '播种期','name2' : '苗期','name3' : '生长期','name4' : '采收期'";
       var s3="}";
       var status_process=s1+s2 +s3;

                    虽然status_process的值符合json对象的格式,但是它不是对象,只是一个字符串(是拼凑出来的);

                   将字符串转换为json对象使用函数eval,eval("(" + status_process+ ")");

         结论:从后台传入到前台的是json字符串,不是真正的json对象,因此需要使用eval函数转换。

  3,json对象的使用       

var status_process = {
      name5 : '闲置期',
     name1 : '播种期',
     name2 : '苗期',
      name3 : '生长期',
      name4 : '采收期'
     };
     alert(status_process["name5"]);
     alert(status_process.name5);

             两个都为:闲置期

  4,json二维对象       

var status_process = {
 name5 : {name3:'空闲闲置期'},
 name1 : '播种期',
 name2 : '苗期',
 name3 : '生长期',
 name4 : '采收期'
};
alert(status_process["name5"]["name3"]);
alert(status_process.name5.name3);

  结果都为:'空闲闲置期'

Javascript 相关文章推荐
原生JS实现表单checkbook获取已选择的值
Jul 21 Javascript
给js文件传参数(详解)
Jul 13 Javascript
JavaScript中的全局对象介绍
Jan 01 Javascript
Node.js中child_process实现多进程
Feb 03 Javascript
js限制文本框只能输入整数或者带小数点的数字
Apr 27 Javascript
浅析Bootstrap验证控件的使用
Jun 23 Javascript
vue.js中mint-ui框架的使用方法
May 12 Javascript
Angularjs实现页面模板清除的方法
Jul 20 Javascript
解决vue-cli单页面手机应用input点击手机端虚拟键盘弹出盖住input问题
Aug 25 Javascript
Vue源码解析之Template转化为AST的实现方法
Dec 14 Javascript
微信小程序如何加载数据库真实数据的实现
Mar 04 Javascript
详解datagrid使用方法(重要)
Nov 06 Javascript
基于jquery实现鼠标滚轮驱动的图片切换效果
Oct 26 #Javascript
JavaScript编程中window的location与history对象详解
Oct 26 #Javascript
jquery移动端TAB触屏切换实现效果
Dec 22 #Javascript
基于jQuery实现搜索关键字自动匹配功能
Mar 26 #Javascript
以Python代码实例展示kNN算法的实际运用
Oct 26 #Javascript
Windows下用PyCharm和Visual Studio开始Python编程
Oct 26 #Javascript
php利用curl获取远程图片实现方法
Oct 26 #Javascript
You might like
用文本文件制作留言板提示(上)
2006/10/09 PHP
php不用正则采集速度探究总结
2008/03/24 PHP
PHP中使用cURL实现Get和Post请求的方法
2013/03/13 PHP
ThinkPHP实现一键清除缓存方法
2014/06/26 PHP
PHP学习笔记(二) 了解PHP的基本语法以及目录结构
2014/08/04 PHP
linux下实现定时执行php脚本
2015/02/13 PHP
php文件读取方法实例分析
2015/06/20 PHP
PHP实现链表的定义与反转功能示例
2018/06/09 PHP
jQueryUI如何自定义组件实现代码
2010/11/14 Javascript
jQuery 源码分析笔记(6) jQuery.data
2011/06/08 Javascript
jQuery中DOM树操作之复制元素的方法
2015/01/23 Javascript
Json对象和字符串互相转换json数据拼接和JSON使用方式详细介绍(小结)
2016/10/25 Javascript
安装vue-cli的简易过程
2018/05/22 Javascript
js实现GIF动图分解成多帧图片上传
2019/10/24 Javascript
[42:36]DOTA2上海特级锦标赛B组败者赛 VG VS Spirit第二局
2016/02/26 DOTA
Python批量修改文件后缀的方法
2014/01/26 Python
pycharm 使用心得(二)设置字体大小
2014/06/05 Python
Python实现网站文件的全备份和差异备份
2014/11/30 Python
Python实现的Google IP 可用性检测脚本
2015/04/23 Python
使用Python发送各种形式的邮件的方法汇总
2015/11/09 Python
Python 出现错误TypeError: ‘NoneType’ object is not iterable解决办法
2017/01/12 Python
利用Python求阴影部分的面积实例代码
2018/12/05 Python
如何查看Django ORM执行的SQL语句的实现
2020/04/20 Python
Python批量获取并保存手机号归属地和运营商的示例
2020/10/09 Python
Django配置跨域并开发测试接口
2020/11/04 Python
Django与AJAX实现网页动态数据显示的示例代码
2021/02/24 Python
欧洲高端品牌直销店:Fashionesta
2016/08/31 全球购物
Europcar比利时:租车
2019/08/26 全球购物
澳大利亚Rockwear官网:女子瑜伽、健身和运动服
2021/01/26 全球购物
联想C++笔试题
2012/06/13 面试题
空指针到底是什么
2012/08/07 面试题
九州传奇上机题
2014/07/10 面试题
元旦晚会开场白
2015/05/29 职场文书
城南旧事读书笔记
2015/06/29 职场文书
2015大学迎新晚会主持词
2015/07/16 职场文书
Python基础之元组与文件知识总结
2021/05/19 Python