call()和apply()、bind()方法的区别;对Array.prototype.slice.call()方法的理解

1、call()和apply()就是改变函数的执行上下文,也就是this值。他们两个是Function对象的方法,每个函数都能调用。

function apply1(num1, num2){
    return sum.apply(this, [num1, num2]);
}
function call1(num1, num2){
    return sum.call(this, num1, num2);

}

call的第二部分参数要一个一个传,apply要把这些参数放到数组中。这就是他们的区别!它们的第二个参数都可以传arguments。

2、bind是新创建一个函数,然后把它的上下文绑定到bind()括号中的参数上,然后将它返回。

所以,bind后函数不会执行,而只是返回一个改变了上下文的函数副本,而call和apply是直接执行函数。

var button = document.getElementById("button"),
    text = document.getElementById("text");
button.onclick = function() {
    alert(this.id); // 弹出text
}.bind(text);

但由于ie6~ie8不支持该方法,所以若想在这几个浏览器中使用,我们就要模拟该方法,这也是面试常考的问题,模拟的代码如下:

if (!function() {}.bind) {  //判断是否存在bind方法,若不存在,向Function对象的原型中添加自定义的bind方法
    Function.prototype.bind = function(context) {
        var self = this;  //所以原型中的this值就明朗了,指向调用它的对象。它也不指向a,而指向b。
              args = Array.prototype.slice.call(arguments)     

        return function() {
            return self.apply(context, args.slice(1));   
        }
    };
}

3、对Array.prototype.slice.call()方法的理解

1)slice() 方法可从已有的数组中返回选定的元素。

start:必需。规定从何处开始选取。如果是负数,那么它规定从数组尾部开始算起的位置。也就是说,-1 指最后一个元素,-2 指倒数第二个元素,以此类推。

end:可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数,那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数,那么它规定的是从数组尾部开始算起的元素。

返回一个新的数组,包含从 start 到 end (不包括该元素)的 arrayObject 中的元素。该方法并不会修改数组,而是返回一个子数组。

2)call()和apply()方法都是在特定的作用域中调用函数,实际上等于设置函数体内this对象的值。

3)arguments对象指数与数组类似(它并不是Array的实例)

4)Array.prototype.slice.call()可以理解为:改变数组的slice方法的作用域,在特定作用域中去调用slice方法,call()方法的第二个参数表示传递给slice的参数即截取数组的起始位置。

Array.prototype.slice.call(arguments)能将具有length属性的对象(key值为数字)转成数组。 

猜你喜欢

转载自blog.csdn.net/Judy_qiudie/article/details/82697996