Array.prototype.slice.call()方法详解
在很多时候经常看到Array.prototype.slice.call()方法,比如Array.prototype.slice.call(arguments),下面讲一下其原理:
1、基本讲解
1.在JS里Array是一个类 slice是此类里的一个方法 ,那么使用此方法应该Array.prototype.slice这么去用
slice从字面上的意思很容易理解就是截取(当然你不是英肓的话) 这方法如何使用呢?
arrayObj.slice(start, [end])很显然是截取数组的一部分。2.我们再看call
 call([thisObj[,arg1[arg2[[argN]]]]]) 
thisObj是一个对象的方法  
  arrg1~argN是参数
那么Array.prototype.slice.call(arguments,1);这句话的意思就是说把调用方法的参数截取出来。  
  如:
 function test(a,b,c,d)
   {
      var arg = Array.prototype.slice.call(arguments,1);
      alert(arg);
   }
   test("a","b","c","d"); //b,c,d
2、疑惑解答
先给个例子,这是jqFloat插件里的代码:
if (element.data('jDefined')) {
    if (options && typeof options === 'object') {
        methods.update.apply(this, Array.prototype.slice.call(arguments, 1));
    }
} else {
    methods.init.apply(this, Array.prototype.slice.call(arguments, 1));
}
多次用到 Array.prototype.slice.call(arguments, 1),不就是等于 arguments.slice(1) 吗?像前者那样写具体的好处是什么?这个很多js新手最疑惑的地方。那为什么呢?
因为arguments并不是真正的数组对象,只是与数组类似而已,所以它并没有slice这个方法,而Array.prototype.slice.call(arguments, 1)可以理解成是让arguments转换成一个数组对象,让arguments具有slice()方法。要是直接写arguments.slice(1)会报错。
typeof arguments==="Object" //而不是 "Array"
3、真正原理
Array.prototype.slice.call(arguments)能将具有length属性的对象转成数组,除了IE下的节点集合(因为ie下的dom对象是以com对象的形式实现的,js对象与com对象不能进行转换) 
如:
var a={length:2,0:'first',1:'second'};//类数组,有length属性,长度为2,第0个是first,第1个是second
console.log(Array.prototype.slice.call(a,0));// ["first", "second"],调用数组的slice(0);
var a={length:2,0:'first',1:'second'};
console.log(Array.prototype.slice.call(a,1));//["second"],调用数组的slice(1);
var a={0:'first',1:'second'};//去掉length属性,返回一个空数组
console.log(Array.prototype.slice.call(a,0));//[]
function test(){
  console.log(Array.prototype.slice.call(arguments,0));//["a", "b", "c"],slice(0)
  console.log(Array.prototype.slice.call(arguments,1));//["b", "c"],slice(1)
}
test("a","b","c");
补充: 
将函数的实际参数转换成数组的方法
方法一:var args = Array.prototype.slice.call(arguments);
方法二:var args = [].slice.call(arguments, 0);
方法三:
var args = [];
for (var i = 1; i < arguments.length; i++) {
    args.push(arguments[i]);
}
最后,附个转成数组的通用函数
var toArray = function(s){
    try{
        return Array.prototype.slice.call(s);
    } catch(e){
        var arr = [];
        for(var i = 0,len = s.length; i < len; i++){
            //arr.push(s[i]);
               arr[i] = s[i];  //据说这样比push快
        }
         return arr;
    }
}
版权声明:本文为小平果原创文章,转载请注明:http://blog.csdn.net/i10630226
Array.prototype.slice.call()方法详解的更多相关文章
- [转] 对Array.prototype.slice.call()方法的理解
		
在看别人代码时,发现有这么个写法:[].slice.call(arguments, 0),这到底是什么意思呢? 1.基础 1)slice() 方法可从已有的数组中返回选定的元素. start:必需.规 ...
 - 对Array.prototype.slice.call()方法的理解
		
在看别人代码时,发现有这么个写法:[].slice.call(arguments, 0),这到底是什么意思呢? 1.基础 1)slice() 方法可从已有的数组中返回选定的元素. start:必需.规 ...
 - 对Array.prototype.slice.call()方法的理解在看别人代码时,发现有这么个写法:[].slice.call(arguments, 0),这到底是什么意思呢?
		
1.基础 1)slice() 方法可从已有的数组中返回选定的元素. start:必需.规定从何处开始选取.如果是负数,那么它规定从数组尾部开始算起的位置.也就是说,-1 指最后一个元素,-2 指倒数第 ...
 - JavaScript中的Array.prototype.slice.call()方法学习
		
JavaScript中的Array.prototype.slice.call(arguments)能将有length属性的对象转换为数组(特别注意: 这个对象一定要有length属性). 但有一个例外 ...
 - Array.prototype.slice.call()方法的理解
		
1.基础1)slice() 方法可从已有的数组中返回选定的元素. start:必需.规定从何处开始选取.如果是负数,那么它规定从数组尾部开始算起的位置.也就是说,-1 指最后一个元素,-2 指倒数第二 ...
 - 【笔记】js Array.prototype.slice.call(arguments) 将函数的参数转换为数组方法的见解
		
我们知道函数里面的参数实际上是一个以数组形式储存的对象 但它并非一个数组 如果我们要将它转换为数组可以调用Array.prototype.slice() 这个方法 分析一下这个方法: Array.pr ...
 - 理解Array.prototype.slice.call(arguments)
		
在很多时候经常看到Array.prototype.slice.call()方法,比如Array.prototype.slice.call(arguments),下面讲一下其原理: 1.基本讲解 1.在 ...
 - classlist和array.prototype.slice.call
		
1.classlist document.getElementById("myDIV").classList.add("mystyle"); classList ...
 - 详解 Array.prototype.slice.call(arguments)
		
首先,slice有两个用法,一个是String.slice,一个是Array.slice,第一个返回的是字符串,第二个返回的是数组 在这里我们看第二个方法 1.在JS里Array是一个类 slice是 ...
 
随机推荐
- Redis配置信息
			
# Redis configuration file example # Note on units: when memory size is needed, it is possible to sp ...
 - mac os 中如何修改顶栏图标的顺序
			
很简单哦! 按住 cmd键同时鼠标选中那个图标,直接拖到你想要的位置即可.
 - LeetCode(36)- Implement Stack using Queues
			
题目: Implement the following operations of a stack using queues. push(x) -- Push element x onto stack ...
 - How to configure ODBC DSN in Client to access remote DB2 for Windows
			
 How to configure ODBC DSN in Client to access remote DB2 for Windows MA Gen feng (Guangdong Unito ...
 - 基于event 实现的线程安全的优先队列(python实现)
			
event 事件是个很不错的线程同步,以及线程通信的机制,在python的许多源代码中都基于event实现了很多的线程安全,支持并发,线程通信的库 对于优先队列的堆实现,请看<python下实现 ...
 - 学习MQ(二)基本概念
			
学习MQ(二)基本概念 这次简单罗列一下MQ的基本概念,还有我对它们的理解 1.queue manager 队列管理器,这是MQ系统中最上层的一个概念.每一个queue manager都有一个侦听器, ...
 - Python的基本数据数字、字符串、布尔值及其魔法
			
基本数据类型介绍 若要把Pyhton的基本数据类型:数字(int).字符串(str).布尔(bool).列表(list).元组(tuple).字典(dict)都分为一个个不同的角色 如:战士,魔法师, ...
 - python单线程,多线程和协程速度对比
			
在某些应用场景下,想要提高python的并发能力,可以使用多线程,或者协程.比如网络爬虫,数据库操作等一些IO密集型的操作.下面对比python单线程,多线程和协程在网络爬虫场景下的速度. 一,单线程 ...
 - Js  浅克隆详解
			
浅克隆:不仅赋值,而且赋予了内存地址深度克隆:赋值,内存地址不同var a = [1,2,3]; var b = a; a = [4,5,6]; alert(b); //[1,2,3] 面试时被问到这 ...
 - vue-cli的webpack模版,相关配置文件dev-server.js与webpack.config.js配置解析
			
1.下载vue-cli npm install vue-cli -g vue-cli的使用与详细介绍,可以到github上获取https://github.com/vuejs/vue-cli 2.安装 ...