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 相关文章推荐
JavaScript中圆括号()和方括号[]的特殊用法疑问解答
Aug 06 Javascript
jquery遍历select元素(实例讲解)
Dec 31 Javascript
使用JavaScript的ActiveXObject对象检测应用程序是否安装的方法
Apr 15 Javascript
jQuery浏览器CSS3特写兼容实例
Jan 19 Javascript
JS+CSS实现自适应选项卡宽度的圆角滑动门效果
Sep 15 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
Aug 02 Javascript
jquery结合html实现中英文页面切换
Nov 29 Javascript
JavaScript使用原型和原型链实现对象继承的方法详解
Apr 05 Javascript
利用n工具轻松管理Node.js的版本
Apr 21 Javascript
CSS3+JavaScript实现翻页幻灯片效果
Jun 28 Javascript
在vue中解决提示警告 for循环报错的方法
Sep 28 Javascript
Node.js事件的正确使用方法
Apr 05 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 七大优势分析
2009/06/23 PHP
php 小乘法表实现代码
2009/07/16 PHP
处理单名多值表单的详解
2013/06/08 PHP
php代码调试利器firephp安装与使用方法分析
2018/08/21 PHP
Laravel5.1框架路由分组用法实例分析
2020/01/04 PHP
Firefox/Chrome/Safari的中可直接使用$/$$函数进行调试
2012/02/13 Javascript
Ajax提交与传统表单提交的区别说明
2014/02/07 Javascript
Javascript连接多个数组不用concat来解决
2014/03/24 Javascript
Node.js事件驱动
2015/06/18 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
JS 终止执行的实现方法
2016/11/24 Javascript
微信小程序上滑加载下拉刷新(onscrollLower)分批加载数据(一)
2017/05/11 Javascript
JavaScript实现百度搜索框效果
2020/03/26 Javascript
在小程序中使用Echart图表的示例代码
2018/08/02 Javascript
VUE2.0 ElementUI2.0表格el-table自适应高度的实现方法
2018/11/28 Javascript
如何让微信小程序页面之间的通信不再变困难
2019/06/03 Javascript
vue使用swiper实现中间大两边小的轮播图效果
2019/11/24 Javascript
在Vue中使用HOC模式的实现
2020/08/23 Javascript
Vue看了就会的8个小技巧
2021/01/21 Vue.js
[01:53]2016完美“圣”典风云人物:Maybe专访
2016/12/05 DOTA
python简单实现刷新智联简历
2016/03/30 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
python判断字符串以什么结尾的实例方法
2020/09/18 Python
详解Python GUI编程之PyQt5入门到实战
2020/12/10 Python
加拿大购物频道:The Shopping Channel
2016/07/21 全球购物
将"引用"作为函数返回值类型的格式、好处和需要遵守的规则
2016/02/09 面试题
软件测试题目
2013/02/27 面试题
为什么需要版本控制?
2013/08/08 面试题
历史系毕业生自荐信
2013/10/28 职场文书
会计助理岗位职责
2014/02/17 职场文书
党的群众路线教育实践方案
2014/05/11 职场文书
禁毒宣传工作方案
2014/05/23 职场文书
我的中国梦演讲稿600字
2014/08/19 职场文书
2015年社区服务活动总结
2015/03/25 职场文书
乡镇团委工作总结2015
2015/05/26 职场文书
圣贤教育改变命运观后感
2015/06/16 职场文书