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 相关文章推荐
jQuery中on()方法用法实例详解
Feb 06 Javascript
JavaScript控制图片加载完成后调用回调函数的方法
Mar 20 Javascript
js模拟淘宝网的多级选择菜单实现方法
Aug 18 Javascript
js clearInterval()方法的定义和用法
Nov 11 Javascript
Bootstrap每天必学之滚动监听
Mar 16 Javascript
Boostrap模态窗口的学习小结
Mar 28 Javascript
详解Angularjs 如何自定义Img的ng-load 事件
Feb 15 Javascript
vue插件开发之使用pdf.js实现手机端在线预览pdf文档的方法
Jul 12 Javascript
jQuery中DOM操作原则实例分析
Aug 01 jQuery
JS中如何轻松遍历对象属性的方式总结
Aug 06 Javascript
《javascript设计模式》学习笔记五:Javascript面向对象程序设计工厂模式实例分析
Apr 08 Javascript
如何使用原生Js实现随机点名详解
Jan 06 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
PHP 登录记住密码实现思路
2013/05/07 PHP
ThinkPHP实现更新数据实例详解(demo)
2016/06/29 PHP
利用php_imagick实现复古效果的方法
2016/10/18 PHP
PHP解密支付宝小程序的加密数据、手机号的示例代码
2021/02/26 PHP
兼容IE和FF的图片上传前预览js代码
2013/05/28 Javascript
Node.js中的模块机制学习笔记
2014/11/04 Javascript
mvc 、bootstrap 结合分布式图简单实现分页
2016/10/10 Javascript
jquery 多个radio的click事件实例
2016/12/03 Javascript
vue动态路由实现多级嵌套面包屑的思路与方法
2017/08/16 Javascript
Angular2+如何去除url中的#号详解
2017/12/20 Javascript
Koa2微信公众号开发之消息管理
2018/05/16 Javascript
浅谈开发eslint规则
2018/10/01 Javascript
vue子路由跳转实现tab选项卡
2019/07/24 Javascript
vue仿ios列表左划删除
2019/09/26 Javascript
使用p5.js临摹动态图形
2019/10/23 Javascript
Vue 图片压缩并上传至服务器功能
2020/01/15 Javascript
JavaScript 严格模式(use strict)用法实例分析
2020/03/04 Javascript
详解element-ui动态限定的日期范围选择器代码片段
2020/07/03 Javascript
微信小程序实现日历小功能
2020/11/18 Javascript
vue 项目@change多个参数传值多个事件的操作
2021/01/29 Vue.js
[01:51]开启你的城市传奇 完美世界城市挑战赛开始报名
2018/10/09 DOTA
Python网络编程之TCP与UDP协议套接字用法示例
2018/02/02 Python
Python 中使用 PyMySQL模块操作数据库的方法
2019/11/10 Python
Django restframework 框架认证、权限、限流用法示例
2019/12/21 Python
利用Opencv实现图片的油画特效实例
2021/02/28 Python
HTML5表格_动力节点Java学院整理
2017/07/11 HTML / CSS
html5+css3气泡组件的实现
2014/11/21 HTML / CSS
HTML5打开手机扫码功能及优缺点
2017/11/27 HTML / CSS
怎样声明接口
2014/09/19 面试题
会计专业自荐信
2014/06/03 职场文书
大学毕业生推荐信
2014/07/09 职场文书
2014年协会工作总结
2014/11/22 职场文书
房地产销售员岗位职责
2015/04/11 职场文书
国情备忘录观后感
2015/06/04 职场文书
党员公开承诺书(2016最新版)
2016/03/24 职场文书
学习nginx基础知识
2021/09/04 Servers