Array.prototype.slice.apply的使用方法


Posted in Javascript onMarch 17, 2010
function test(){  
 //将参数转为一个数组  
  var args = Array.prototype.slice.apply(arguments);  
 alert(args);  
}

arguments在JavaScript语法中是函数特有的一个对象属性(Arguments对象),用来引用调用该函数时传递的实际参数。这个对象很象数组,拥有length属性且使用下标的形式来获取其元素,但它又并非真正的Array对象。更多关于Arguments对象的资料请参阅《JavaScript权威指南》。

所以,直接调用arguments.slice()将返回一个"Object doesn't support this property or method"错误,因为arguments不是一个真正的数组。而以上代码调用Array.prototype.slice.apply(arguments)的意义就在于它能将函数的参数对象转化为一个真正的数组。JavaScript脚本引擎如何实现我们不得而知,但这种方式确实是有效的,而且在主流浏览器上都测试通过。另一方面也可推知Arguments对象和Array对象的亲缘关系。如果你在编写JavaScript的时候,常常碰到需要将arguments对象转成Array来处理的情形,这个技巧可以帮上忙。 

这个技巧来自鼎鼎大名的DouglasCrockford。推而广之,Array其他的原型方法也可以应用在arguments上,比如: 
var arg0 = Array.prototype.shift.apply(arguments);

shift也是Array的一个实例方法,用于获取并返回数组的第一个元素。当然如上的调用虽然可执行,但却纯属多余,不如直接调用arguments[0]来的简单直接。再推而广之,我们也可以对很多形似Array的Collection对象应用这个技巧,比如Array.prototype.slice.apply(document.getElementsByTagName('div')); 不过很遗憾,IE并不支持这样的调用,Firefox和Opera则都能得到正确的结果。 

Prototype1.4中增加的$A()方法也常用来将arguments转为数组,我们看它的实现: 

var $A = Array.from = function(iterable) {  
 if(!iterable) return[];  
  if(iterable.toArray) {  
returniterable.toArray();  
 } else {  

varresults = [];  

for(vari=0; i<iterable.length; i++)  

results.push(iterable[i]);  

returnresults;  
 }  
}

Prototype用一个for循环来构造新数组,这样是为了保证最大限度的兼容性。
Javascript 相关文章推荐
js实现双向链表互联网机顶盒实战应用实现
Oct 28 Javascript
jQuery基础框架浅入剖析
Dec 27 Javascript
node.js中的fs.rename方法使用说明
Dec 16 Javascript
JQuery插件Quicksand实现超炫的动画洗牌效果
May 03 Javascript
JS实现点击复选框将按钮或文本框变为灰色不可用的方法
Aug 11 Javascript
js实现跨域的多种方法
Dec 25 Javascript
JavaScript实现Base64编码转换
Apr 23 Javascript
原生js实现图片放大缩小计时器效果
Jan 20 Javascript
vue-resourse将json数据输出实例
Mar 08 Javascript
使用vue-cli导入Element UI组件的方法
May 16 Javascript
jquery实现动态添加附件功能
Oct 23 jQuery
webpack+express实现文件精确缓存的示例代码
Jun 11 Javascript
javascript 打开页面window.location和window.open的区别
Mar 17 #Javascript
input 输入框内的输入事件详细分析
Mar 17 #Javascript
Jquery Ajax学习实例5 向WebService发出请求,返回泛型集合数据的异步调用
Mar 17 #Javascript
javascript中的undefined 与 null 的区别  补充篇
Mar 17 #Javascript
javascript+iframe 实现无刷新载入整页的代码
Mar 17 #Javascript
js select常用操作控制代码
Mar 16 #Javascript
js实现的日期操作类DateTime函数代码
Mar 16 #Javascript
You might like
SONY ICF-SW55的电路分析
2021/03/02 无线电
目录,文件操作详谈―PHP
2006/11/25 PHP
什么是MVC,好东西啊
2007/05/03 PHP
php+mysqli使用面向对象方式查询数据库实例
2015/01/29 PHP
PHP session会话操作技巧小结
2016/09/27 PHP
RSA实现JS前端加密与PHP后端解密功能示例
2019/08/05 PHP
JS 容错处理代码, 屏蔽错误信息
2021/03/09 Javascript
js 图片缩放(按比例)控制代码
2009/05/27 Javascript
express的中间件bodyParser详解
2014/12/04 Javascript
在Javascript中处理数组之toSource()方法的使用
2015/06/09 Javascript
基于jquery实现图片相关操作(重绘、获取尺寸、调整大小、缩放)
2015/12/25 Javascript
学习JavaScript设计模式之中介者模式
2016/01/14 Javascript
JS简单实现点击复制链接的方法
2016/08/03 Javascript
简单几步实现返回顶部效果
2016/12/05 Javascript
javascript基础知识讲解
2017/01/11 Javascript
Node.js五大应用性能技巧小结(必须收藏)
2017/08/09 Javascript
使用svg实现动态时钟效果
2018/07/17 Javascript
TypeScript中的方法重载详解
2019/04/12 Javascript
微信小程序环境下将文件上传到OSS的方法步骤
2019/05/31 Javascript
vue中在vuex的actions中请求数据实例
2019/11/08 Javascript
详解Python 数据库 (sqlite3)应用
2016/12/07 Python
Python入门之三角函数tan()函数实例详解
2017/11/08 Python
Python安装selenium包详细过程
2019/07/23 Python
python3 图片 4通道转成3通道 1通道转成3通道 图片压缩实例
2019/12/03 Python
python+selenium定时爬取丁香园的新型冠状病毒数据并制作出类似的地图(部署到云服务器)
2020/02/09 Python
tensorflow dataset.shuffle、dataset.batch、dataset.repeat顺序区别详解
2020/06/03 Python
深入了解python列表(LIST)
2020/06/08 Python
PyCharm上安装Package的实现(以pandas为例)
2020/09/18 Python
2014信息技术专业毕业生自我评价
2014/01/17 职场文书
前厅收银主管岗位职责
2014/02/04 职场文书
党章培训心得体会
2014/09/04 职场文书
优秀教师先进材料
2014/12/16 职场文书
禁毒主题班会教案
2015/08/14 职场文书
七夕情人节问候语
2015/11/11 职场文书
纪律委员竞选稿
2015/11/19 职场文书
了解Kubernetes中的Service和Endpoint
2022/04/01 Servers