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


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 相关文章推荐
jquery select选中的一个小问题
Oct 11 Javascript
javascript使用eval或者new Function进行语法检查
Oct 16 Javascript
$.ajax返回的JSON无法执行success的解决方法
Sep 09 Javascript
Jquery增加鼠标中间功能mousewheel的实例代码
Sep 05 Javascript
javascript使用正则表达式检测IP地址
Dec 03 Javascript
javascirpt实现2个iframe之间传值的方法
Jun 30 Javascript
利用jsonp与代理服务器方案解决跨域问题
Sep 14 Javascript
微信小程序实现点击按钮修改字体颜色功能【附demo源码下载】
Dec 05 Javascript
JS简单获得节点元素的方法示例
Feb 10 Javascript
微信小程序实现手势滑动效果
Aug 26 Javascript
JS实现简易留言板增删功能
Feb 08 Javascript
浅谈vue 多个变量同时赋相同值互相影响
Aug 05 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
解析web文件操作常见安全漏洞(目录、文件名检测漏洞)
2013/06/29 PHP
php建立Ftp连接的方法
2015/03/07 PHP
整理php防注入和XSS攻击通用过滤
2015/09/13 PHP
php使用curl下载指定大小的文件实例代码
2017/09/30 PHP
NodeJS的模块写法入门(实例代码)
2012/03/07 NodeJs
js获取时间函数及扩展函数的方法
2016/10/30 Javascript
原生js实现商品放大镜效果
2017/01/12 Javascript
微信小程序 登陆流程详细介绍
2017/01/17 Javascript
微信小程序 image组件binderror使用例子与js中的onerror区别
2017/02/15 Javascript
详解AngularJS ui-sref的简单使用
2017/04/24 Javascript
最新Javascript程序员面试试题和解题方法
2017/11/23 Javascript
vue中eventbus被多次触发以及踩过的坑
2017/12/02 Javascript
vue2.0中set添加属性后视图不能更新的解决办法
2019/02/22 Javascript
layui form.render('select', 'test2') 更新渲染的方法
2019/09/27 Javascript
Bootstrap实现模态框效果
2019/09/30 Javascript
分享JS表单验证源码(带错误提示及密码等级)
2020/01/05 Javascript
layui使用及简单的三级联动实现教程
2020/12/01 Javascript
js正则表达式简单校验方法
2021/01/03 Javascript
[00:30]塑造者的传承礼包-戴泽“暗影之焰”套装展示视频
2014/04/04 DOTA
Python实现过滤单个Android程序日志脚本分享
2015/01/16 Python
hmac模块生成加入了密钥的消息摘要详解
2018/01/11 Python
python编程培训 python培训靠谱吗
2018/01/17 Python
Python数据分析之双色球中蓝红球分析统计示例
2018/02/03 Python
Django 导出项目依赖库到 requirements.txt过程解析
2019/08/23 Python
python多进程并行代码实例
2019/09/30 Python
判断单链表中是否存在环
2012/07/16 面试题
送给程序员的20个Java集合面试问题
2014/08/06 面试题
考试不及格检讨书
2014/01/09 职场文书
爱情保证书范文
2014/02/01 职场文书
综治工作汇报材料
2014/10/27 职场文书
民用住房租房协议书
2014/10/29 职场文书
拔河比赛队名及霸气口号
2015/12/24 职场文书
优秀家长事迹材料(2016推荐版)
2016/02/29 职场文书
创业分两种人:那么哪些适合创业?,哪些适合不适合创业呢?
2019/08/23 职场文书
Nginx快速入门教程
2021/03/31 Servers
Python数据类型最全知识总结
2021/05/31 Python