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没有块级作用域
May 22 Javascript
很棒的js选项卡切换效果
Jul 15 Javascript
AngularJs Managing Service Dependencies详解
Sep 02 Javascript
浅谈jQuery效果函数
Sep 16 Javascript
微信小程序 数据遍历的实现
Apr 05 Javascript
JS排序之快速排序详解
Apr 08 Javascript
JS传参及动态修改页面布局
Apr 13 Javascript
Vue Ajax跨域请求实例详解
Jun 20 Javascript
angularjs使用div模拟textarea文本框的方法
Oct 02 Javascript
vue组件定义,全局、局部组件,配合模板及动态组件功能示例
Mar 19 Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 Javascript
SpringBoot+Vue开发之Login校验规则、实现登录和重置事件
Oct 19 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控制网页过期时间的代码
2008/09/28 PHP
PHP采集腾讯微博的实现代码
2012/01/19 PHP
Ajax提交表单时验证码自动验证 php后端验证码检测
2016/07/20 PHP
Yii2 加载css、js 载静态资源的方法
2017/03/10 PHP
Laravel5.7 数据库操作迁移的实现方法
2019/04/12 PHP
PHP使用phpunit进行单元测试示例
2019/09/23 PHP
用js实现多域名不同文件的调用方法
2007/01/12 Javascript
jquery中获取元素的几种方式小结
2011/07/05 Javascript
JS代码优化技巧之通俗版(减少js体积)
2011/12/23 Javascript
将字符串转换成gb2312或者utf-8编码的参数(js版)
2013/04/10 Javascript
jquery+正则实现统一的表单验证
2015/09/20 Javascript
jQuery+CSS3实现3D立方体旋转效果
2015/11/10 Javascript
JavaScript的History API使搜索引擎抓取AJAX内容
2015/12/07 Javascript
javascript获取select标签选中的值
2016/06/04 Javascript
BootStrap网页中代码显示用法详解
2016/10/21 Javascript
浅谈javascript中的数据类型转换
2016/12/27 Javascript
jQuery中库的引用方法
2018/01/06 jQuery
微信小程序云开发之使用云数据库
2019/05/17 Javascript
微信小程序简单的canvas裁剪图片功能详解
2019/07/12 Javascript
浅谈vue中get请求解决传输数据是数组格式的问题
2020/08/03 Javascript
解决vue scoped html样式无效的问题
2020/10/24 Javascript
Python中replace方法实例分析
2014/08/20 Python
Python多线程编程(一):threading模块综述
2015/04/05 Python
Python max内置函数详细介绍
2016/11/17 Python
python文件名和文件路径操作实例
2017/09/29 Python
python绘制直方图和密度图的实例
2019/07/08 Python
Python综合应用名片管理系统案例详解
2020/01/03 Python
Python Matplotlib绘图基础知识代码解析
2020/08/31 Python
安装Anaconda3及使用Jupyter的方法
2020/10/27 Python
在阿尔卑斯山或希腊度过快乐假期:Alpine Elements
2019/12/28 全球购物
全球领先的中国制造商品在线批发平台:DHgate
2020/01/28 全球购物
Ibatis中如何提高SQL Map的性能
2013/05/11 面试题
百度软件工程师职位
2013/02/14 面试题
博士生入学考试推荐信
2013/11/17 职场文书
客户答谢会致辞
2015/07/30 职场文书
Python基于百度API识别并提取图片中文字
2021/06/27 Python