返回顶部
首页 > 资讯 > 前端开发 > html >json2.js怎么用
  • 674
分享到

json2.js怎么用

2024-04-02 19:04:59 674人浏览 泡泡鱼
摘要

这篇文章给大家分享的是有关JSON2.js怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。json2.js主要功能是做什么的?json2.js提供了json的序列化和反序列化

这篇文章给大家分享的是有关JSON2.js怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。

json2.js主要功能是做什么的?

json2.js提供了json的序列化和反序列化方法,可以将一个json对象转换成json字符串,也可以将一个json字符串转换成一个json对象。

json2.js在浏览器不支持json.parse的内置方法时,最有效。json2.js会创建一个内部的全局变量,提供json对象与字符串之间的转换。

由于eval已经不提倡使用了,并存在一定的危险,建议使用内置parse json的方法,或者直接使用json2.js。

json2.js的源码地址:

https://GitHub.com/douglascrockford/JSON-js

Visual Studio用户可以直接通过Nuget来获得。

使用方法很简单:

1、引用json2.js:

<script type="text/javascript" src="/CoreResource/JS/json2.min.js"></script>

2、JSON.stringify() 序列化方法

方法用于将javaScript 的json数据转化为json格式的文本串。主要用于向服务端返回数据。

var jsonObj = { "id": "01", "name": "Tom" };
JSON.stringify(jsonObj);

3、JSON.parse()反序列化方法

var jsonString = {"id": "01", "name": "Tom" };
JSON.parse(jsonString);

用于将json格式的文本串转化为javaScript 的json数据,例如:

var records = 
{
  "table": "GPS_MANAGER",
  "token": "32sdfj-349sfdnfs32-fsdf348imfg323-df34",
  "pk": "GPS_LONgitUDE,GPS_LATITUDE",
  "rows": [
    {
      "type": "modify",
      "columns": [
        {
          "GPS_LONGITUDE": "GPS_LONGITUDE",
          "old": "",
          "new": "112.9152287"
        },
        {
          "GPS_LATITUDE": "GPS_LATITUDE",
          "old": "",
          "new": "22.6689977"
        },
        {
          "GPSMARK": "GPSMARK",
          "old": "",
          "new": "1"
        },
        {
          "RTUNAME": "RTUNAME",
          "old": "",
          "new": "大边岩站"
        },
        {
          "RTUID": "RTUID",
          "old": "",
          "new": "13525"
        },
        {
          "NOTE": "NOTE",
          "old": "",
          "new": "undefined"
        },
        {
          "Y": "Y",
          "old": "",
          "new": "2508146.500000"
        },
        {
          "X": "X",
          "old": "",
          "new": "696776.812500"
        },
        {
          "GPS_HEIGHT": "GPS_HEIGHT",
          "old": "",
          "new": "0"
        },
        {
          "GPS_GUID": "GPS_GUID",
          "old": "",
          "new": "1381c526-2d90-442f-889c-731485a960c1"
        }
      ]
    }
  ]
}
var jsonObj = JSON.parse(records );

然后就可以通过前端javascript代码解析json文本传递过来的数据,json是一种以key:value的复合格式存储数据的协议,这样简化了数据传递量,比较xml更能减轻客户端负载。

但是个人感觉json数据格式没有xml文件那样一目了然!

3. Json验证工具

(1). Json文本在线验证工具JSONLint:Http://jsonlint.com/
通过此在线工具验证json格式文本串是否符合json数据格式。

Json格式查看器json viewer 1.1 汉化中文绿色版

下面是其他网友的补充

需要加载json2.js

这是个人在最近使用json时做的总结,拿出来给没接触过的小弟们晒晒,适用与没接触过json的人员,其中json2。js请到json官网下载。

<script> 
//直接声明json数据结构 
var myJSONObject = {"bindings": [ 
    {"ircEvent": "PRIVMSG", "method": "newURI", "regex": "^http://.*"}, 
    {"ircEvent": "PRIVMSG", "method": "deleteURI", "regex": "^delete.*"}, 
    {"ircEvent": "PRIVMSG", "method": "randomURI", "regex": "^random.*"} 
  ] 
};
 
//声明字符串,可对比一下json文本与我们正常文本的区别
 
var nORMalstring='[{persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]}]';
var jsontext='[{"persons":[{"name":"jordan","sex":"m","age":"40"}, {"name":"bryant","sex":"m","age":"28"}, {"name":"McGrady","sex":"m","age":"27"} ]}]';
 
//调用eval函数转换为json对象,
 
var myE = eval(normalstring);
document.writeln(myE '<br><br>');
 
//将json对象转换为字符串
var text = JSON.stringify(myE);
//对比转换后的json文本与声明的文本区别
document.writeln('转换后的json文本:' text '<br><br>声明的json格式文本' jsontext '<br><br>声明的普通格式文本' normalstring '<br><br>');
 
//当安全比较重要的时候使用JSON解析就好一些。JSON解析只会识别JSON文本并且它更安全,下面调用json的parse函数对文本数据转换生成json数据结构
 
var myData = JSON.parse(jsontext);
document.writeln(myData '<br><br>');
 
//下面是对json对象的增删查改操作
//声明json对象
 
var jsonObj2={persons:[{name:"jordan",sex:"m",age:"40"}, {name:"bryant",sex:"m",age:"28"}, {name:"McGrady",sex:"m",age:"27"} ]};
var persons=jsonObj2.persons;
var str="";
var person={name:"yaoMing",sex:"m",age:"26"};
//以下为json对象的操作,去掉注释可以查看操作结果
//jsonObj2.persons.push(person);//数组最后加一条记录
//jsonObj2.persons.pop();//删除最后一项
//jsonObj2.persons.shift();//删除第一项
jsonObj2.persons.unshift(person);//数组最前面加一条记录 只要适合Javascript的方法都是可以用在JSON对象的数组中的!所以还有另外的方法splice( )进行crud操作! //删除
//jsonObj2.persons.splice(0,2);//开始位置,删除个数
//替换不删除
var self={name:"tom",sex:"m",age:"24"};
var brother={name:"Mike",sex:"m",age:"29"};
jsonObj2.persons.splice(1,0,self,brother,self);//开始位置,删除个数,插入对象
//替换并删除
//jsonObj2.persons.splice(0,1,self,brother);//开始位置,删除个数,插入对象
for(var i=0;i<persons.length;i ){ var cur_person=persons[i]; str =cur_person.name "'sex is " cur_person.sex " and age is " cur_person.age "<br><br>"; }
document.writeln(str);
//转换为json文本
var myjsonobj = JSON.stringify(jsonObj2);
document.writeln(myjsonobj);
</script>

 3、增强功能:

比如说,我们的数据非常复杂,还有类似头像,昵称,个人签名之类的信息。
可是我保存在本地,只需要用户名,和性别,肿么破呢?
也许你会说 so easy, 遍历数据重新提取下即可。
例如:

data = [
  {name: , sex:, age: },
  {name: , sex:, age: },
  {name: , sex:, age: }
]; ( i=, new_data=[]; i<data.length; i++) {
  new_data.push({
    name: data[i].name,
    sex: data[i].sex
  });
} str_json = .stringify(new_data);
console.log(str_json);
var data = [
  {name: "王尼玛", sex:1, age: 30},
  {name: "王尼美", sex:0, age: 20},
  {name: "王大锤", sex:1, age: 30}
];
for (var i=0, new_data=[]; i<data.length; i++) {
  new_data.push({
    name: data[i].name,
    sex: data[i].sex
  });
}
var str_json = JSON.stringify(new_data);
console.log(str_json);

确实分分钟搞定。

其实我们只需要用 stringify 第二个参数即可简单处理这种问题。

 data = [
  {name: , sex:, age: },
  {name: , sex:, age: },
  {name: , sex:, age: }
]; str_json = .stringify(data, [, ]);
console.log(str_json);
var data = [
  {name: "王尼玛", sex:1, age: 30},
  {name: "王尼美", sex:0, age: 20},
  {name: "王大锤", sex:1, age: 30}
];
var str_json = JSON.stringify(data, ["name", "sex"]);
console.log(str_json);

第二个参数只要传入需要的keys数组,就非常轻松的就完成这种处理了。

当然如果我们要更纠结的处理,比如要把 1,0 修改为男女,那么第二个参数可以用回调函数来处理。

 data = [
  {name: , sex:, age: },
  {name: , sex:, age: },
  {name: , sex:, age: }
]; str_json = .stringify(data, 
   (k === ) {     [, ][v];
  }   v;
});
console.log(str_json);
var data = [
  {name: "王尼玛", sex:1, age: 30},
  {name: "王尼美", sex:0, age: 20},
  {name: "王大锤", sex:1, age: 30}
];
var str_json = JSON.stringify(data, function (k, v) {
  if (k === "sex") {
    return ["女", "男"][v];
  }
  return v;
});
console.log(str_json);

感谢各位的阅读!关于“json2.js怎么用”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!

--结束END--

本文标题: json2.js怎么用

本文链接: https://lsjlt.com/news/77587.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

猜你喜欢
  • json2.js怎么用
    这篇文章给大家分享的是有关json2.js怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。json2.js主要功能是做什么的?json2.js提供了json的序列化和反序列化...
    99+
    2024-04-02
  • 怎么使用JS
    本篇内容主要讲解“怎么使用JS”,感兴趣的朋友不妨来看看。本文介绍的方法操作简单快捷,实用性强。下面就让小编来带大家学习“怎么使用JS”吧!1. Function 构造函数Function()构造函数虽然不...
    99+
    2024-04-02
  • js中typeof怎么用
    这篇文章主要介绍了js中typeof怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。typeoftypeof 对于原始类型来说,除了 n...
    99+
    2024-04-02
  • js闭包怎么用
    这篇文章主要为大家展示了“js闭包怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js闭包怎么用”这篇文章吧。首先引用来自官网文档的定义:closure i...
    99+
    2024-04-02
  • js中return怎么用
    这篇文章将为大家详细讲解有关js中return怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。JavaScript是什么JavaScript是一种直译式的脚本语言,其解释器被称为JavaScript引...
    99+
    2023-06-14
  • js中replaceall怎么用
    小编给大家分享一下js中replaceall怎么用,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!JavaScript是什么JS是JavaScript的简称,它是一...
    99+
    2023-06-14
  • JS中URL.createObjectURL怎么用
    这篇文章主要为大家展示了“JS中URL.createObjectURL怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JS中URL.createObjectURL怎么用”这篇文章吧。前言UR...
    99+
    2023-06-29
  • js中entries()怎么用
    这篇文章主要为大家展示了“js中entries()怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js中entries()怎么用”这篇文章吧。1、entires() 方法语法详解entrie...
    99+
    2023-06-25
  • js中Array.from怎么用
    这篇文章给大家分享的是有关js中Array.from怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。Array.from可以从类似的数组或可迭代对象中创建一个新的、浅拷贝的数组实例。Array.from接收三...
    99+
    2023-06-25
  • js中Array.of怎么用
    这篇文章将为大家详细讲解有关js中Array.of怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。Array.of用于将参数依次转换成数组中的一个,然后返回这个新的数组,无论这个参数是数字还是其他。当...
    99+
    2023-06-25
  • js中==与===怎么用
    这篇文章将为大家详细讲解有关js中==与===怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。== 与 ===这段代码的打印结果是啥结果是 a == c,看到这个结果我难以置信。== 和 === 的区...
    99+
    2023-06-27
  • html怎么调用js
    html 通过两种方法调用 javascript:使用带 src 属性的 标签嵌入外部 javascript 文件。使用不带 src 属性的 标签直接内嵌 javascript 代码...
    99+
    2024-05-16
  • JS作用域链怎么用
    这篇文章主要为大家展示了“JS作用域链怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JS作用域链怎么用”这篇文章吧。具体内容如下1、所有全局变量和函数都是...
    99+
    2024-04-02
  • js中对象怎么用
    这篇文章给大家分享的是有关js中对象怎么用的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。对象1 使用解构删除不必要属性有时候你不希望保留某些对象属性,也许是因为它们包含敏感信息或...
    99+
    2024-04-02
  • JS库之ParticlesJS怎么用
    这篇文章将为大家详细讲解有关JS库之ParticlesJS怎么用,小编觉得挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。particles.jsA lightweight Java...
    99+
    2024-04-02
  • js中new Date()怎么用
    这篇文章主要介绍了js中new Date()怎么用,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。js new Date() 测试var&nb...
    99+
    2024-04-02
  • js中的bind怎么用
    这篇文章主要为大家展示了“js中的bind怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“js中的bind怎么用”这篇文章吧。bind方法是EcmaScri...
    99+
    2024-04-02
  • JS中Ext.apply怎么使用
    在JavaScript中,Ext.apply方法用于将一个对象的属性复制到另一个对象。使用Ext.apply的基本语法如下:Ext....
    99+
    2023-09-15
    JS
  • JS运算符怎么用
    这篇文章主要为大家展示了“JS运算符怎么用”,内容简而易懂,条理清晰,希望能够帮助大家解决疑惑,下面让小编带领大家一起研究并学习一下“JS运算符怎么用”这篇文章吧。算术运算符对数值类型的变量及常量进行算数运算。也是最简单和最常用的运算符号。...
    99+
    2023-06-29
  • js trim函数怎么用
    Javascript中的trim()函数用于去除字符串两端的空格或指定的字符。使用语法:string.trim(...
    99+
    2023-09-12
    js
软考高级职称资格查询
推荐阅读
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作