js基础进阶--关于Array.prototype.slice.call(arguments) 的思考

欢迎访问我的个人博客:http://www.xiaolongwu.cn

Array.prototype.slice.call(arguments)的作用为:强制转化arguments为数组格式,一般出现在框架活插件的源码中

如何理解

上面的代码等价于[ ].slice.call(arguments)

或者随便一个数组调用都行 [1,2,4].slice.call(arguments)

因为,前面的调用者的作用只是沿着原型链向上找,最终找到Array为止,slice为Array原型上的一个方法

slice内部的实现原理大概是这样的

Array.prototype.slice = function(start,end){
     var result = new Array();
     start = start || 0;        // 如果不传则取默认值
     end = end || this.length;  // 如果不传则取默认值
     
     //this指向调用的对象,当用了call后,能够改变this的指向,也就是指向传进来的对象,这是关键
     for(var i = start; i < end; i++){
          result.push(this[i]);
     }
     return result;
}

数组和字符串都有slice方法

如果对slice不是很了解,请看这篇文章:slice()与splice()的用法和区别你清楚吗?

call方法的作用为:改变调用者的this指向并且执行调用者,

    function fn(a){
        console.log(this.a);
        console.log(this);
    }
        
    var obj = {
        a : 2
    }

    fn.call(obj); //  2 
                  //  {a : 2} 
    // 解释一下 fn的this指针指向了obj ,并且执行了fn函数
 

如果对call方法还是没理解,请看这边文章 js基础--深入理解call、apply、bind

arguments 为函数实参的一个集合,数据类型为对象类型

写一个例子吧

    function ary(){
        console.log(arguments,typeof arguments,arguments instanceof Object)
        
        // 自己实操一下  看看上面这行代码能打印出什么
        
        return [11,12].slice.call(arguments);
        
        //这里的[11,12]可以被替换为任意的数组,不影响结果
    }

        var a11 = ary(1,2,3,4,5,6,888,9,222);
        
        console.log(a11);   [1, 2, 3, 4, 5, 6, 888, 9, 222]
        console.log(typeof a11);            //"object"
        console.log(a11 instanceof Array);  //ture
        
        

github资源地址:https://github.com/关于Array.prototype.slice.call(arguments) 的思考.md

我的个人博客:http://www.xiaolongwu.cn

csdn博客地址:https://blog.csdn.net/wxl1555

如果您对我的博客内容有疑惑或质疑的地方,请在下方评论区留言,或邮件给我,共同学习进步。

邮箱:[email protected]

猜你喜欢

转载自www.cnblogs.com/wuxiaolong555/p/9045157.html
今日推荐