将函数的实际参数转换成数组的方法


Posted in Javascript onJanuary 25, 2010

值得庆幸的是,我们可以通过数组的 slice 方法将 arguments 对象转换成真正的数组:
var args = Array.prototype.slice.call(arguments);
对于slice 方法,ECMAScript 262 中 15.4.4.10 Array.prototype.slice (start, end) 章节有备注:

The slice function is intentionally generic; it does not require that its this value be an Array object. Therefore it can be transferred to other kinds of objects for use as a method. Whether the slice function can be applied successfully to a host object is implementation-dependent.

《Pro JavaScript Design Patterns》(《JavaScript 设计模式》)的作者 Dustin Diaz 曾指出:

instead of… 
var args = Array.prototype.slice.call(arguments); // 怿飞注:下称方法一 
do this… 
var args = [].slice.call(arguments, 0); // 怿飞注:下称方法二

但二者的性能差异真的存在吗?经过个人简单测试发现:

在 arguments.length 较小的时候,方法二性能上稍有一点点优势,而在arguments.length 较大的时候,方法一却又稍有优势。

最后附上方法三,最老土的方式:

var args = []; 
for (var i = 1; i < arguments.length; i++) { 
args.push(arguments[i]); 
}

不过对于平常来说,个人建议还是使用第二种方法,但任何解决方案,没有最好的,只有最合适:
var args = [].slice.call(arguments, 0); 
理由有二:

一般的函数的 arguments.length 都在 10 以内,方法二有优势;
方法二的代码量上也比第一种少,至少可以减小一点字节 ^^

如何将 NodeList (比如:document.getElementsByTagName('div'))转换成数组呢?

解决方案简单如下:

function nodeListToArray(nodes){ 
var arr, length; 
try { 
// works in every browser except IE 
arr = [].slice.call(nodes); 
return arr; 
} catch(err){ 
// slower, but works in IE 
arr = []; 
length = nodes.length; 
for(var i = 0; i < length; i++){ 
arr.push(nodes[i]); 
} 
return arr; 
} 
}

为什么 IE 中 NodeList 不可以使用 [].slice.call(nodes) 方法转换呢?
In Internet Explorer it throws an error that it can't run Array.prototype.slice.call(nodes) because a DOM NodeList is not a JavaScript object.
Javascript 相关文章推荐
关于JavaScript的一些看法
May 27 Javascript
JavaScript高级程序设计 DOM学习笔记
Sep 10 Javascript
根据当前时间在jsp页面上显示上午或下午
Aug 18 Javascript
jQuery中:animated选择器用法实例
Dec 29 Javascript
js制作简易年历完整实例
Jan 28 Javascript
js获取表格的行数和列数的方法
Oct 23 Javascript
jQuery事件的绑定、触发、及监听方法简单说明
May 10 Javascript
javascript按钮禁用和启用的效果实例代码
Oct 29 Javascript
Vue实现移动端左右滑动效果的方法
Nov 27 Javascript
javascript 对象 与 prototype 原型用法实例分析
Nov 11 Javascript
easyUI 实现的后台分页与前台显示功能示例
Jun 01 Javascript
基于openlayers实现角度测量功能
Sep 28 Javascript
javascript中利用数组实现的循环队列代码
Jan 24 #Javascript
document.getElementById为空或不是对象的解决方法
Jan 24 #Javascript
JavaScript 未结束的字符串常量常见解决方法
Jan 24 #Javascript
php gethostbyname获取域名ip地址函数详解
Jan 24 #Javascript
setTimeout与setInterval在不同浏览器下的差异
Jan 24 #Javascript
js 模拟实现类似c#下的hashtable的简单功能代码
Jan 24 #Javascript
jQuery 1.4 15个你应该知道的新特性(译)
Jan 24 #Javascript
You might like
人大复印资料处理程序_查询篇
2006/10/09 PHP
如何在PHP中进行身份认证
2006/10/09 PHP
CI(CodeIgniter)框架介绍
2014/06/09 PHP
PHP IDE PHPStorm配置支持友好Laravel代码提示方法
2015/05/12 PHP
Laravel重定向,a链接跳转,控制器跳转示例
2019/10/22 PHP
PHP7 新增功能
2021/03/09 PHP
JavaScript 拖拉缩放效果
2008/12/10 Javascript
js 与或运算符 || &amp;&amp; 妙用
2009/12/09 Javascript
js精度溢出解决方案
2012/12/02 Javascript
JavaScript 函数replace深入了解
2013/03/14 Javascript
js实现的复制兼容chrome和IE
2014/04/03 Javascript
Javascript实现div层渐隐效果的方法
2015/05/30 Javascript
PHP结合jQuery实现的评论顶、踩功能
2015/07/22 Javascript
使用jquery获取url及url参数的简单实例
2016/06/14 Javascript
在js代码拼接dom对象到页面上的模板总结
2018/10/21 Javascript
微信小程序登录对接Django后端实现JWT方式验证登录详解
2019/07/29 Javascript
layui实现图片虚拟路径上传,预览和删除的例子
2019/09/25 Javascript
vue 使用外部JS与调用原生API操作示例
2019/12/02 Javascript
Vue在H5 项目中使用融云进行实时个人单聊通讯
2020/12/14 Vue.js
Python中的自定义函数学习笔记
2014/09/23 Python
Python中利用sorted()函数排序的简单教程
2015/04/27 Python
python实现将英文单词表示的数字转换成阿拉伯数字的方法
2015/07/02 Python
python随机数分布random测试
2018/08/27 Python
pytorch模型预测结果与ndarray互转方式
2020/01/15 Python
Python 常用日期处理 -- calendar 与 dateutil 模块的使用
2020/09/02 Python
Python中读取文件名中的数字的实例详解
2020/12/25 Python
美国玛丽莎收藏奢华时尚商店:Marissa Collections
2016/11/21 全球购物
新西兰珠宝品牌:Michael Hill
2017/09/16 全球购物
Hunter Boots美国官方网站:赫特威灵顿雨靴
2018/06/16 全球购物
建筑工程实习自我鉴定
2013/09/19 职场文书
大学生创业计划书的范文
2014/01/07 职场文书
工资收入证明样本(5篇)
2014/09/16 职场文书
村党支部书记个人对照材料汇报
2014/10/26 职场文书
北京故宫的导游词
2015/01/31 职场文书
使用Navicat Premium工具将oracle数据库迁移到MySQL
2021/05/27 Oracle
零基础学java之方法的定义与调用详解
2022/04/10 Java/Android