javascript apply、bind、call Method

apply() method

Calls the function, substituting the specified object for the this value of the function, and the specified array for the arguments of the function.

 apply([thisObj[,argArray]])

Parameters

---

thisObj

Optional. The object to be used as the this object.

argArray

Optional. A set of arguments to be passed to the function.

unction callMe(arg1, arg2){
    var s = "";

    s += "this value: " + this;
    s += "<br />";
    for (i in callMe.arguments) {
        s += "arguments: " + callMe.arguments[i];
        s += "<br />";
    }
    return s;
}

document.write("Original function: <br/>");
document.write(callMe(1, 2));
document.write("<br/>");

document.write("Function called with apply: <br/>");
document.write(callMe.apply(3, [ 4, 5 ]));

// Output: 
// Original function: 
// this value: [object Window]
// arguments: 1
// arguments: 2

// Function called with apply: 
// this value: 3
// arguments: 4
// arguments: 5

 bind() method

For a given function, creates a bound function that has the same body as the original function. In the bound function, the this object resolves to the passed in object. The bound function has the specified initial parameters.

 

function.bind(thisArg[,arg1[,arg2[,argN]]])

Parameters

---

function

Required. A function object.

thisArg

Required. An object to which the this keyword can refer inside the new function.

arg1[,arg2[,argN]]]

Optional. A list of arguments to be passed to the new function.

Return Value

---

A new function that is the same as the function function, except for the thisArg object and the initial arguments.

// Define the original function.
var checkNumericRange = function (value) {
    if (typeof value !== 'number')
        return false;
    else
        return value >= this.minimum && value <= this.maximum;
}

// The range object will become the this value in the callback function.
var range = { minimum: 10, maximum: 20 };

// Bind the checkNumericRange function.
var boundCheckNumericRange = checkNumericRange.bind(range);

// Use the new function to check whether 12 is in the numeric range.
var result = boundCheckNumericRange (12);
document.write(result);

// Output: true

The following code shows how to use the arg1[,arg2[,argN]]] arguments. The bound function uses the parameters specified in the bind method as the first and second parameters. Any parameters specified when the bound function is called are used as the third, fourth (and so on) parameters.

// Define the original function with four parameters.
var displayArgs = function (val1, val2, val3, val4) {
    document.write(val1 + " " + val2 + " " + val3 + " " + val4);
}

var emptyObject = {};

// Create a new function that uses the 12 and "a" parameters
// as the first and second parameters.
var displayArgs2 = displayArgs.bind(emptyObject, 12, "a");

// Call the new function. The "b" and "c" parameters are used
// as the third and fourth parameters.
displayArgs2("b", "c");
// Output: 12 a b c 

Notice: Not supported in the following document modes: Quirks, Internet Explorer 6 standards, Internet Explorer 7 standards, Internet Explorer 8 standards.

call() method

Calls a method of an object, substituting another object for the current object.

 

call([thisObj[, arg1[, arg2[,  [, argN]]]]])

Parameters

---

thisObj

Optional. The object to be used as the current object.

arg1, arg2, , argN

Optional. A list of arguments to be passed to the method.

 

function callMe(arg1, arg2){
    var s = "";

    s += "this value: " + this;
    s += "<br />";
    for (i in callMe.arguments) {
        s += "arguments: " + callMe.arguments[i];
        s += "<br />";
    }
    return s;
}

document.write("Original function: <br/>");
document.write(callMe(1, 2));
document.write("<br/>");

document.write("Function called with call: <br/>");
document.write(callMe.call(3, 4, 5));

// Output: 
// Original function: 
// this value: [object Window]
// arguments: 1
// arguments: 2

// Function called with call: 
// this value: 3
// arguments: 4
// arguments: 5