javascript 利用arguments实现可变长参数


Posted in Javascript onNovember 21, 2016

javascript arguments解释,实现可变长参数。

在C#中,有可变长参数params[],但是在js中,如何实现这种可变参数呢?

一、可变长参数

arguments是非常好的解决方法,一直不知道javascript有这个东西。

先来看看应用场景,使用arguments传入任意个数的参数到js函数里的写法。

function Test() {
  console.log(arguments[0]);
  console.log(arguments[1]);
  console.log(arguments[2]);
};
Test(1, 2, 3);

输出 1 2 3;

当然,你也可以在javascript函数里放一个数组,但是它是固定长度的。

二、不要直接修改arguments对象

arguments对象类似于数组,但实际上它也并不是数组,使用call方法,可能将数组的shift函数用到它身上,但是尽量不要尝试去改动arguments。很容易造成混乱。

如果确实要修改,可以将arguments的内容复制到一个新数组上,然后在新数组上进行修改。

var args = [].slice.call(arguments);

用变量绑定arguments,实现跨函数访问

arguments变量是被隐式绑定到每个函数体内的,注意是每一个函数内部。

一个迭代器的例子能够说明这个问题;

function values() {
 //values有自己的arguments
 var i = 0, n = arguments.length;
 return {
  hasNext: function () {
   return i < n;  //hasNext 有自己的arguments
  },
  next: function () {
   if(i >= n)
   {
    throw new Error("已经是最后一个元素!");
   }
   return arguments[i++];  //next 有自己的arguments
  }
 }
}
 
var it = values(1, 2, 3, 4, 5, 6, 7);
console.log(it.next());  //undefined
console.log(it.next());  //undefined
console.log(it.next());  //undefined

如果要访问外层函数的arguments,那么只能通过局部变量绑定的方式,在内层就能够访问,上面的例子可以改造成

function values() {
 //values有自己的arguments
 var i = 0, n = arguments.length, ourterArgs = arguments;
 return {
  hasNext: function () {
   return i < n;  //hasNext 有自己的arguments
  },
  next: function () {
   if(i >= n)
   {
    throw new Error("已经是最后一个元素!");
   }
   return ourterArgs[i++];  //ourterArgs 外层保存的 arguments
  }
 }
}
 
var it = values(1, 2, 3, 4, 5, 6, 7);
console.log(it.next());  //1
console.log(it.next());  //2
console.log(it.next());  //3

以上所述是本文的全部内容,希望对大家有所帮助,谢谢对三水点靠木的支持!

Javascript 相关文章推荐
一个cssQuery对象 javascript脚本实现代码
Jul 21 Javascript
40个有创意的jQuery图片、内容滑动及弹出插件收藏集之一
Dec 31 Javascript
jQuery实现MSN中文网滑动Tab菜单效果代码
Sep 09 Javascript
JQUERY的AJAX请求缓存里的数据问题处理
Feb 23 Javascript
实例讲解使用原生JavaScript处理AJAX请求的方法
May 10 Javascript
js改变html的原有内容实现方法
Oct 05 Javascript
微信小程序加载更多 点击查看更多
Nov 29 Javascript
写给小白看的JavaScript异步
Nov 29 Javascript
如何解决webpack-dev-server代理常切换问题
Jan 09 Javascript
Node.js Event Loop各阶段讲解
Mar 08 Javascript
ElementUI之Message功能拓展详解
Oct 18 Javascript
vue模块移动组件的实现示例
May 20 Javascript
js 点击a标签 获取a的自定义属性方法
Nov 21 #Javascript
浅谈JS读取DOM对象(标签)的自定义属性
Nov 21 #Javascript
AngularJS Phonecat实例讲解
Nov 21 #Javascript
浅谈React 属性和状态的一些总结
Nov 21 #Javascript
JavaScript中关于for循环删除数组元素内容时出现的问题
Nov 21 #Javascript
jQuery用FormData实现文件上传的方法
Nov 21 #Javascript
遍历js中对象的属性和值的实例
Nov 21 #Javascript
You might like
php中数据的批量导入(csv文件)
2006/10/09 PHP
精美漂亮的php分页类代码
2013/04/02 PHP
PHP使用DirectoryIterator显示下拉文件列表的方法
2015/03/13 PHP
Zend Framework教程之Zend_Form组件实现表单提交并显示错误提示的方法
2016/03/21 PHP
php大小写转换函数(strtolower、strtoupper)用法介绍
2017/11/17 PHP
Laravel 5.2 文档 数据库 ―― 起步介绍
2019/10/21 PHP
Display SQL Server Version Information
2007/06/21 Javascript
js 调整select 位置的函数
2008/02/21 Javascript
一些主流JS框架中DOMReady事件的实现小结
2011/02/12 Javascript
原生js 秒表实现代码
2012/07/24 Javascript
在JavaScript并非所有的一切都是对象
2013/04/11 Javascript
JavaScript实现节点的删除与序号重建实例
2015/08/05 Javascript
js实现简单的省市县三级联动效果实例
2016/02/18 Javascript
JS 调用微信扫一扫功能
2016/12/22 Javascript
vue2中filter()的实现代码
2017/07/09 Javascript
纯JavaScript实现实时反馈系统时间
2017/10/26 Javascript
微信小程序左右滑动的实现代码
2017/12/15 Javascript
关于HTML5的data-*自定义属性的总结
2018/05/05 Javascript
ionic使用angularjs表单验证(模板验证)
2018/12/12 Javascript
JavaScript 九种跨域方式实现原理
2019/02/11 Javascript
用原生JS实现爱奇艺首页导航栏代码实例
2019/09/19 Javascript
[51:17]Mineski vs Secret 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.22
2019/09/05 DOTA
让 python 命令行也可以自动补全
2014/11/30 Python
python获取中文字符串长度的方法
2018/11/14 Python
pandas dataframe的合并实现(append, merge, concat)
2019/06/24 Python
python3 实现函数写文件路径的正确方法
2019/11/27 Python
Python:type、object、class与内置类型实例
2019/12/25 Python
python实现音乐播放和下载小程序功能
2020/04/26 Python
python subprocess pipe 实时输出日志的操作
2020/12/05 Python
高中军训广播稿
2014/01/14 职场文书
导购员的岗位职责
2014/02/08 职场文书
期末学生评语大全
2014/04/24 职场文书
含预算的公司户外活动方案
2014/08/16 职场文书
“四风”问题的主要表现和危害思想汇报
2014/09/19 职场文书
2015年师德表现自我评价
2015/03/05 职场文书
Java存储没有重复元素的数组
2022/04/29 Java/Android