10分钟学会js处理json的常用方法


Posted in Javascript onDecember 06, 2020

一、json定义

JSON ( JavaScript Object Notation) ,它是一串字符串 只不过元素会使用特定的符号标注。

  • {} 双括号表示对象
  • [] 中括号表示数组
  • "" 双引号内是属性或值
  • : 冒号表示后者是前者的值(这个值可以是字符串、数字、也可以是另一个数组或对象)

JSON 语法是 JavaScript 对象表示法语法的子集。
数据在名称/值对中、数据由逗号分隔、花括号保存对象、方括号保存数组

JSON 值可以是:数字(整数或浮点数)、字符串(在双引号中)、逻辑值(true 或 false)、数组(在方括号中)、对象(在花括号中)、null

所以 {"name": "Michael"} 可以理解为是一个包含name为Michael的对象

二、为什么用json

  1. JSON是纯文本格式,是独立于语言和平台的。
  2. 生成和解析相对于XML而言要简单。
  3. 读写的速度更快。

三、JS 内置两个Json方法

1、对象转化为字符串

任何把 JavaScript 变成 Json ,就是把这个对象序列化为Json字符串,然后才可以通过网络传递;

JSON.stringify( {} , [ ] , "")

//参数一 :要序列化的数据(object)
//参数二 :控制对象的键值,只想输出指定的属性,传入一个数组
//参数三 :序列化后,打印输出的格式(一个Tab ,可以更直观查看json)

例子:

10分钟学会js处理json的常用方法

2、字符串转换为对象

如果我们收到一个JSON格式的字符串,只需要把它反序列化成一个JavaScript对象,就可以在JavaScript中直接使用这个对象了

JSON.parse( json.DATA )

//传入json字符串

10分钟学会js处理json的常用方法

四、全局替换字符串

这里我们需要用JS实现replaceAll的功能, 将所有的 ' xa" ' 替换成 ' " ' .
代码如下,这里的gm是固定的,g表示global,m表示multiple,也可以使用正则表达式

10分钟学会js处理json的常用方法

五、遍历json对象和json数组

1、遍历JSON对象

代码如下:

var packJson = {"name":"Liza", "password":"123"} ;
for(var k in packJson ){//遍历packJson 对象的每个key/value对,k为key
alert(k + " " + packJson[k]);
}

10分钟学会js处理json的常用方法

10分钟学会js处理json的常用方法

2、遍历JSON数组

代码如下:

var packJson = [{"name":"Liza", "password":"123"}, {"name":"Mike", "password":"456"}];
for(var i in packJson){//遍历packJson 数组时,i为索引
alert(packJson[i].name + " " + packJson[i].password);
}

10分钟学会js处理json的常用方法

10分钟学会js处理json的常用方法

附录

学习本就是一个不断模仿、练习、再到最后面自己原创的过程。

虽然可能从来不能写出超越网上通类型同主题博文,但为什么还是要写?
于自己而言,博文主要是自己总结。假设自己有观众,毕竟讲是最好的学(见下图)。

于读者而言,笔者能在这个过程get到知识点,那就是双赢了。
当然由于笔者能力有限,或许文中存在描述不正确,欢迎指正、补充!
感谢您的阅读。如果本文对您有用,那么请点赞鼓励。

10分钟学会js处理json的常用方法

到此这篇关于10分钟学会js处理json的常用方法的文章就介绍到这了,更多相关js处理json方法内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
推荐 21 款优秀的高性能 Node.js 开发框架
Aug 18 Javascript
完美兼容各大浏览器的jQuery仿新浪图文淡入淡出间歇滚动特效
Nov 12 Javascript
jquery选择器需要注意的问题
Nov 26 Javascript
简易的投票系统以及js刷票思路和方法
Apr 07 Javascript
深入理解关于javascript中apply()和call()方法的区别
Apr 12 Javascript
jQuery实现点击弹出背景变暗遮罩效果实例代码
Jun 24 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
JS构造一个html文本内容成文件流形式发送到后台
Jul 31 Javascript
JavaScript中变量、指针和引用功能与操作示例
Aug 04 Javascript
jQuery中DOM常见操作实例小结
Aug 01 jQuery
详解JavaScript数据类型和判断方法
Sep 04 Javascript
Vue项目中如何封装axios(统一管理http请求)
May 02 Vue.js
JavaScript中的几种继承方法示例
Dec 06 #Javascript
js调用网络摄像头的方法
Dec 05 #Javascript
浅谈Vue使用Elementui修改默认的最快方法
Dec 05 #Vue.js
vue+element_ui上传文件,并传递额外参数操作
Dec 05 #Vue.js
JavaScript实现浏览器网页自动滚动并点击的示例代码
Dec 05 #Javascript
解决vue下载后台传过来的乱码流的问题
Dec 05 #Vue.js
js获取图片的base64编码并压缩
Dec 05 #Javascript
You might like
短波收音机简介
2021/03/01 无线电
PHP 源代码压缩小工具
2009/12/22 PHP
javascript 小型动画组件与实现代码
2010/06/02 PHP
php源码分析之DZX1.5随机数函数random用法
2015/06/17 PHP
详解PHP中的PDO类
2015/07/06 PHP
php pthreads多线程的安装与使用
2016/01/19 PHP
PHP通过调用新浪API生成t.cn格式短网址链接的方法详解
2019/02/20 PHP
php 下 html5 XHR2 + FormData + File API 上传文件操作实例分析
2020/02/28 PHP
Jquery 弹出层插件实现代码
2009/10/24 Javascript
JSONP获取Twitter和Facebook文章数的具体步骤
2014/02/24 Javascript
AngularJS自动表单验证
2016/02/01 Javascript
Javascript对象字面量的理解
2016/06/22 Javascript
Boostrap基础教程之JavaScript插件篇
2016/09/08 Javascript
理解JavaScript原型链
2016/10/25 Javascript
JavaScript实现Fly Bird小游戏
2016/12/15 Javascript
jQuery Validate验证表单时多个name相同的元素只验证第一个的解决方法
2016/12/24 Javascript
js实现3D旋转效果
2020/08/18 Javascript
[02:54]辉夜杯主赛事第二日败者组 iG.V赛后采访
2015/12/26 DOTA
35个Python编程小技巧
2014/04/01 Python
socket + select 完成伪并发操作的实例
2017/08/15 Python
基于python实现百度翻译功能
2019/05/09 Python
Python机器学习算法库scikit-learn学习之决策树实现方法详解
2019/07/04 Python
Python数据库小程序源代码
2019/09/15 Python
python语言线程标准库threading.local解读总结
2019/11/10 Python
python 实现矩阵按对角线打印
2019/11/29 Python
python实现低通滤波器代码
2020/02/26 Python
CSS3新属性transition-property transform box-shadow实例学习
2013/06/06 HTML / CSS
运动鞋、足球鞋和慕尼黑球衣:Sport Münzinger
2019/08/26 全球购物
Richards网上商店:当代时尚,遍布巴西
2019/11/03 全球购物
char型变量中能不能存贮一个中文汉字
2015/07/08 面试题
物业管理毕业生个人的求职信
2013/11/30 职场文书
灰雀教学反思
2014/04/28 职场文书
2015驻村干部工作总结
2015/04/07 职场文书
少先大队干部竞选稿
2015/11/20 职场文书
小学信息技术教学反思
2016/02/16 职场文书
golang中字符串MD5生成方式总结
2021/07/04 Golang