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


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 相关文章推荐
JScript中的undefined和&quot;undefined&quot;的区别
Mar 08 Javascript
[原创]站长必须要知道的javascript广告代码
May 30 Javascript
jQuery live
May 15 Javascript
IE下JS读取xml文件示例代码
Aug 05 Javascript
JavaScript中cookie工具函数封装的示例代码
Oct 11 Javascript
JavaScript之json_动力节点Java学院整理
Jun 29 Javascript
使用vue2实现带地区编号和名称的省市县三级联动效果
Nov 05 Javascript
Vue源码探究之状态初始化
Nov 14 Javascript
Vue源码解析之数据响应系统的使用
Apr 24 Javascript
vue 实现超长文本截取,悬浮框提示
Jul 29 Javascript
Vue elementui字体图标显示问题解决方案
Aug 18 Javascript
原生JS生成指定位数的验证码
Oct 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
destoon安装出现Internal Server Error的解决方法
2014/06/21 PHP
ThinkPHP水印功能实现修复PNG透明水印并增加JPEG图片质量可调整
2014/11/05 PHP
PHP通过内置函数memory_get_usage()获取内存使用情况
2014/11/20 PHP
php去除字符串中空字符的常用方法小结
2015/03/17 PHP
php版微信公众平台开发之验证步骤实例详解
2016/09/23 PHP
php封装实现钉钉机器人报警接口的示例代码
2020/08/08 PHP
浅谈javascript 面向对象编程
2009/10/28 Javascript
JavaScript 滚轮事件使用说明
2010/03/07 Javascript
javascript温习的一些笔记 基础常用知识小结
2011/06/22 Javascript
JavaScript建立一个语法高亮输入框实现思路
2013/02/26 Javascript
Jquery validation remote 验证的缓存问题解决方法
2014/03/25 Javascript
删除javascript中注释语句的正则表达式
2014/06/11 Javascript
jQuery中nextAll()方法用法实例
2015/01/07 Javascript
jQuery实现表格文本框淡入更改值后淡出效果
2016/09/27 Javascript
使用jQuery卸载全部事件的思路详解
2017/04/03 jQuery
详解ECMAScript6入门--Class对象
2017/04/27 Javascript
vue router使用query和params传参的使用和区别
2017/11/13 Javascript
JavaScript高级函数应用之分时函数实例分析
2018/08/03 Javascript
图文详解vue框架安装步骤
2019/02/12 Javascript
[46:02]DOTA2上海特级锦标赛D组资格赛#2 Liquid VS VP第二局
2016/02/28 DOTA
[38:42]完美世界DOTA2联赛循环赛 Matador vs Forest BO2第二场 11.05
2020/11/05 DOTA
压缩包密码破解示例分享(类似典破解)
2014/01/17 Python
详解python的几种标准输出重定向方式
2016/08/15 Python
通过Python 接口使用OpenCV的方法
2018/04/02 Python
python之信息加密题目详解
2019/06/26 Python
Python3 selenium 实现QQ群接龙自动化功能
2020/04/17 Python
python中的插入排序的简单用法
2021/01/19 Python
使用CSS3配合IE滤镜实现渐变和投影的效果
2015/09/06 HTML / CSS
详解html5 shiv.js和respond.min.js
2018/01/24 HTML / CSS
澳大利亚购买健身器材网站:Gym Direct
2019/12/19 全球购物
Python中pass语句的作用是什么
2016/06/01 面试题
养殖人员的创业计划书范文
2013/12/26 职场文书
安全生产月标语
2014/10/07 职场文书
埃及王子观后感
2015/06/16 职场文书
「海贼王」112.9万粉丝纪念图标公布
2022/03/21 日漫
【海涛解说】暗牧也疯狂,牛蛙成配角
2022/04/01 DOTA