细说Array.prototype.slice.call

前言

总以为这个方法比较眼熟，可是不知道这个方法是干什么用的，那咱们今天就来剖析一下这个方法

基本语法的讲解

• Array.prototype.slice() Array是一个构造函数，原型中带有的slice方法就是咱们日常用来切割数组用的，以后会返回一个数组，不清楚的朋友能够去MDN上看一下，MDN之slice

• call和apply call和apply、bind这已是老生常谈的问题了，是能够改变this指向的，这里就简单点打个比方吧。

function Food(){}
Food.prototype.say = function(){
  console.log(this.color)
}
var fish = new Food()
var o = {
  color: 'red'
}
fish.say.call(o);  //red
复制代码

答疑解惑

Array.prototype.slice.call那么这个有什么用呢，咱们来看个例子：

function test(a,b,c,d) { 
  var arg = Array.prototype.slice.call(arguments,1); 
  console.log(arg); 
} 
test("a","b","c","d"); //b,c,d
复制代码

看到这儿，可能有些人会说那能不能写arguments.slice(1)，固然不能，这样的话会报错，由于arguments是类数组对象，并无slice这个方法。 关于arguments对象

真正的机制

Array.prototype.slice.call()能把类数组对象转化成数组，固然像传统的dom对象和js对象都是行不通的，咱们接下来举个例子：

var a={length:2,0:'lai',1:'hua'};//类数组,有length属性，长度为2，第0个是lai，第1个是hua
console.log(Array.prototype.slice.call(a,0));// ["lai", "hua"],调用数组的slice(0);
复制代码

这个例子做证了咱们的观点 接下来看一个实用的例子，这个例子看懂了，这个知识点也就懂了：

function bind(func, thisArg) {
    var nativeBind = Function.prototype.bind;
    var slice = Array.prototype.slice;
    if (nativeBind && func.bind === nativeBind) {
        return nativeBind.apply(func, slice.call(arguments, 1));
    }

    var args = slice.call(arguments, 2);
    return function () {
        return func.apply(thisArg, args.concat(slice.call(arguments)));
    };
}
复制代码

上面这个式本身对bind的封装，能够兼容比较老的浏览器。

补充

最后补充一个通用的将类数组转化成数组的方法，由于考虑到可能有些不支持Array.prototype.slice，或者环境冲突的状况将这个原生方法覆盖：

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[i] = s[i];
        }
         return arr;
    }
}
复制代码