怎么理解 [].slice.call()

在es5标准中,我们经常需要把arguments对象转换成真正的数组。

所以我们经常可以看见以下转换方式:
[].slice.call(arguments)

怎么理解[].slice.call(arguments)

[].slice.call(arguments)等价于:Array.prototype.slice.call(arguments)[].__proto__.slice.call(arguments)

Array.prototype.slice.call(arguments)原本调用slice的是Array.prototype,而call(arguments)使得调用slice方法的对象改成arguments,你可以想象成

Array.prototype.slice.call(arguments) ~ arguments.slice()

arguments原型对象是Object.prototype,并没有slice方法,slice方法从哪里来?这是因为call(arguments)不仅是改变了this的指向,还使得arguments对象继承了Array.prototype中的slice方法。

在这里我们可以自定义一个mySlice()方法来更好的理解:

 Array.prototype.mySlice = function(){
    
    
     var start = 0;
     var end = this.length;
     var temp =[];

     if(arguments.length === 1){
    
    
         start = arguments[0];
     }else if(arguments.length ===2){
    
    
         start = arguments[0];
         end = arguments[1];
     }
     for(var i = start; i < end; i++){
    
    
         // fakeArr[0]
         // fakeArr[1]
         // fakeArr[2]
         temp.push(this[i]);

     }
     //最后得到真正的数组
     return temp;
 }

//伪数组
 var fakeArr = {
    
    
     0:'a',
     1:'b',
     2:'c',
     length: 3
 }
 
var newArr =  [].mySlice.call(fakeArr); //this指向 fakeArr
 console.log(newArr); // ["a", "b", "c"]

猜你喜欢

转载自blog.csdn.net/cake_eat/article/details/109013156