使用JSON作为函数的参数的优缺点


Posted in Javascript onOctober 27, 2016

一直对json不太懂,最近看了一些介绍才发现,原来这个东西这么好用,下面就为大家介绍一下

1、我们可以随时为一个函数添加/删除参数或在任意参数位置添加新参数,而不会像传统参数一样必须按照规定的顺序书写,而且每次添加或删除函数某个参数都要函数内容进行修改。而使用JSON作为参数可以不用考虑参数顺序。
看下面代码演示:

<script type="text/javascript">
 <!--
 //普通方法
 function commonArg(name,age,desc){
  var userinfo="name: "+name+","+"age: "+age+"\ndescription: "+desc;
  alert(userinfo);
 }
 commonArg("yemoo",22,"a boy!")//每次调用都必须按照规定的参数顺序书写,如果写成commonArg(22,"yemoo","desc")则返回信息就不对,每次都必须记忆每个参数意义及顺序
 
 //JSON参数法
 function jsonArg(info){
  var userinfo="name: "+info.name+"\tage: "+info.age+"\ndescription: "+info.desc;
  alert(userinfo);
 }
 jsonArg({name:"blue",age:22,desc:"a gril?"});
 jsonArg({desc:"not a people!",name:"sss",age:0});
 //参数位置可以随意写
 //-->
 </script>

普通函数缺点很明显:必须记忆参数意义和顺序。而使用JSON的方法则不需要。

2、使用者对函数的调用非常方便,特别是在只需要传入其中几个或一个参数时。
看下面的代码演示:

<script type="text/javascript">
 <!--
 //普通方法
 function commonArg(name,age,desc){
  var userinfo="name: "+(name||"empty")+"\tage: "+(age||0)+"\ndescription: "+desc||"empty";
  alert(userinfo);
 }
 //当只需要设定后面的参数时前面每个参数都需要设置为null
 commonArg("tempUser");
 commonArg(null,null,"a boy!");
 commonArg(null,20);
 
 //JSON参数法
 function jsonArg(info){
  var userinfo="name: "+(info.name||"empty")+"\tage: "+(info.age||0)+"\ndescription: "+(info.desc||"empty");
  alert(userinfo);
 }
 //每次只需要设置需要设定参数项
 jsonArg({name:"tempUser"});
 jsonArg({desc:"a boy!"});
 jsonArg({age:20});
 //-->
 </script>

JSON方法优点很明显:每次只需传入需要的参数即可,而不用考虑其他参数。
JSON真是一个好用的东西,不用在ajax方面还是在js的其他方面都体现了其方便灵活的特性,的确应该好好去挖掘和学习json。

Javascript 相关文章推荐
Microsfot .NET Framework4.0框架 安装失败的解决方法
Aug 14 Javascript
js冒泡、捕获事件及阻止冒泡方法详细总结
May 08 Javascript
Jquery幻灯片特效代码分享--打开页面随机选择切换方式(3)
Aug 15 Javascript
jQuery UI设置固定日期选择特效代码分享
Aug 27 Javascript
js实现兼容PC端和移动端滑块拖动选择数字效果
Feb 16 Javascript
javascript 中事件冒泡和事件捕获机制的详解
Sep 01 Javascript
详解如何实现一个简单的 vuex
Feb 10 Javascript
Vue 实现拖动滑块验证功能(只有css+js没有后台验证步骤)
Aug 24 Javascript
原生JS实现前端本地文件上传
Sep 08 Javascript
35个最好用的Vue开源库(史上最全)
Jan 03 Javascript
微信小程序云开发之使用云存储
May 17 Javascript
ant design vue 表格table 默认勾选几项的操作
Oct 31 Javascript
Javascript 获取鼠标当前的位置实现方法
Oct 27 #Javascript
JavaScript实现使用Canvas绘制图形的基本教程
Oct 27 #Javascript
js 实现一些跨浏览器的事件方法详解及实例
Oct 27 #Javascript
jQuery 检查某个元素在页面上是否存在实例代码
Oct 27 #Javascript
基于JS快速实现导航下拉菜单动画效果附源码下载
Oct 27 #Javascript
简单理解vue中el、template、replace元素
Oct 27 #Javascript
深入理解JavaScript定时机制
Oct 27 #Javascript
You might like
php mssql扩展SQL查询中文字段名解决方法
2012/10/15 PHP
CodeIgniter集成smarty的方法详解
2016/05/26 PHP
php操作路径的经典方法(必看篇)
2016/10/04 PHP
JavaScript中“+=”的应用
2007/02/02 Javascript
执行iframe中的javascript方法
2008/10/07 Javascript
firefox事件处理之自动查找event的函数(用于onclick=foo())
2010/08/05 Javascript
用循环或if语句从json中取数据示例
2014/08/18 Javascript
JavaScript动态添加style节点的方法
2015/06/09 Javascript
JS给Array添加是否包含字符串的简单方法
2016/10/29 Javascript
深入理解js中的加载事件
2017/02/08 Javascript
js图片放大镜效果实现方法详解
2020/10/28 Javascript
Node.js发送HTTP客户端请求并显示响应结果的方法示例
2017/04/12 Javascript
微信小程序picker组件简单用法示例【附demo源码下载】
2017/12/05 Javascript
利用原生js实现html5小游戏之打砖块(附源码)
2018/01/03 Javascript
vue组件实现可搜索下拉框扩展
2020/10/23 Javascript
webstorm+vue初始化项目的方法
2018/10/18 Javascript
vue 集成 vis-network 实现网络拓扑图的方法
2019/08/07 Javascript
JS面向对象编程基础篇(二) 封装操作实例详解
2020/03/03 Javascript
Python采用socket模拟TCP通讯的实现方法
2014/11/19 Python
Python中的with语句与上下文管理器学习总结
2016/06/28 Python
Python2随机数列生成器简单实例
2017/09/04 Python
Python实现利用最大公约数求三个正整数的最小公倍数示例
2017/09/30 Python
python 设置xlabel,ylabel 坐标轴字体大小,字体类型
2019/07/23 Python
Python Sympy计算梯度、散度和旋度的实例
2019/12/06 Python
python如何实现单链表的反转
2020/02/10 Python
jupyter notebook 恢复误删单元格或者历史代码的实现
2020/04/17 Python
Python中bisect的用法及示例详解
2020/07/20 Python
CSS3 please 跨浏览器的CSS3产生器
2010/03/14 HTML / CSS
PAUL HEWITT手表美国站:德国北部时尚生活配饰品牌,船锚元素
2017/11/18 全球购物
Antonioli美国在线商店:时尚前卫奢华
2019/07/29 全球购物
幼儿教师考核制度
2014/01/25 职场文书
大学社团活动策划书
2014/01/26 职场文书
网络管理员岗位职责
2014/03/17 职场文书
酒店端午节活动方案
2014/08/26 职场文书
圣贤教育改变命运观后感
2015/06/16 职场文书
Python matplotlib绘制雷达图
2022/04/13 Python