細說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;
    }
}
複製代碼