1. 程式人生 > >call()和apply()、bind()方法的區別;對Array.prototype.slice.call()方法的理解

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));            }     }; }

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值為數字)轉成陣列。