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 dom 操作详解 js加强
Jul 13 Javascript
构造函数+原型模式构造js自定义对象(最通用)
May 12 Javascript
javascript从image转换为base64位编码的String
Jul 29 Javascript
javascript实现点击按钮弹出一个可关闭层窗口同时网页背景变灰的方法
May 13 Javascript
javascript使用 concat 方法对数组进行合并的方法
Sep 08 Javascript
bootstrap网格系统使用方法解析
Jan 13 Javascript
微信小程序 开发经验整理
Feb 15 Javascript
angular十大常见问题
Mar 07 Javascript
微信小程序之绑定点击事件实例详解
Jul 07 Javascript
微信小程序开发之animation循环动画实现的让云朵飘效果
Jul 14 Javascript
微信通过页面(H5)直接打开本地app的解决方法
Sep 09 Javascript
vue+iview 实现可编辑表格的示例代码
Oct 31 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
正则表达式语法
2006/10/09 Javascript
PHP抓取网页、解析HTML常用的方法总结
2015/07/01 PHP
PHP中的流(streams)浅析
2015/07/02 PHP
php解析xml 的四种简单方法(附实例)
2016/07/11 PHP
PHP保留两位小数的几种方法
2019/07/24 PHP
改变javascript函数内部this指针指向的三种方法
2010/04/23 Javascript
jquery操作select option 的代码小结
2011/06/21 Javascript
jQuery ajax 路由和过滤器使用说明
2011/08/02 Javascript
wangEditor编辑器失去焦点后仍然可以在原位置插入图片分析
2015/05/06 Javascript
如何实现移动端浏览器不显示 pc 端的广告
2015/10/15 Javascript
举例讲解JavaScript substring()的使用方法
2015/11/09 Javascript
javascript显示倒计时控制按钮的简单实现
2016/06/07 Javascript
jQuery 移动端拖拽(模块化开发,触摸事件,webpack)
2016/10/28 Javascript
bootstrapValidator表单验证插件学习
2016/12/30 Javascript
浅谈javascript中的 “ &amp;&amp; ” 和 “ || ”
2017/02/02 Javascript
用react-redux实现react组件之间数据共享的方法
2018/06/08 Javascript
JavaScript基于对象方法实现数组去重及排序操作示例
2018/07/10 Javascript
[01:04]DOTA2:伟大的Roshan雕塑震撼来临
2015/01/30 DOTA
在Python 2.7即将停止支持时,我们为你带来了一份python 3.x迁移指南
2018/01/30 Python
纯python实现机器学习之kNN算法示例
2018/03/01 Python
Django基于ORM操作数据库的方法详解
2018/03/27 Python
pandas修改DataFrame列名的方法
2018/04/08 Python
用python简单实现mysql数据同步到ElasticSearch的教程
2018/05/30 Python
详解如何管理多个Python版本和虚拟环境
2019/05/10 Python
带你彻底搞懂python操作mysql数据库(cursor游标讲解)
2020/01/06 Python
Tensorflow中批量读取数据的案列分析及TFRecord文件的打包与读取
2020/06/30 Python
python关于倒排列的知识点总结
2020/10/13 Python
使用jquery实现HTML5响应式导航菜单教程
2014/04/02 HTML / CSS
英语硕士生求职简历的自我评价
2013/10/15 职场文书
家佳咖啡店创业计划书
2013/12/27 职场文书
2014村务公开实施方案
2014/02/25 职场文书
校庆标语集锦
2014/06/25 职场文书
高速铁道技术专业求职信
2014/08/09 职场文书
六一儿童节新闻稿
2015/07/17 职场文书
《我们的民族小学》教学反思
2016/02/19 职场文书
matlab xlabel位置的设置方式
2021/05/21 Python