The Apply () and call () methods and differences in JavaScript

Call () and apply () methods

1. Method definitions

Call Method:

Syntax: Call ([thisobj[,arg1[, arg2[, [,. ArgN]]])

Definition: Invokes one method of an object, replacing the current object with another object.

Description

The call method can be used to invoke a method in place of another object. The call method can change the object context of a function from the initial context to a new object specified by Thisobj.

If the Thisobj parameter is not provided, then the Global object is used as the thisobj.

Apply method:

Syntax: Apply ([Thisobj[,argarray]])

Definition: A method of applying an object that replaces the current object with another object.

Description

If Argarray is not a valid array or is not a arguments object, it will result in a TypeError.

If none of the Argarray and Thisobj parameters are provided, then the Global object is used as a thisobj and cannot be passed any parameters.

2. Usefulness and Difference

Call , apply The role is to borrow someone else's way to invoke it, just like calling yourself.

Call , apply The method difference is that, from the second parameter, the call method parameters are passed to the borrowed method as arguments, and apply will be passed directly into an array, and the argument list of the last borrowed method is the same.

3. Common examples

A

function Add (A, b) { 

alert (A+B);

}

function Sub (A, b) { 

Alert (A-B);

}

Add.call (sub,3,1);

The meaning of this example is to replace sub,add.call (sub,3,1) = = Add (3,1) with add, so the result is: alert (4); Note: The function in JS is actually an object, and the function name is a reference to a function object.

B

function Animal () {

THIS.name = "Animal";

This.showname = function () {

alert (this.name);

}

}

function Cat () {

THIS.name = "Cat";

}

var animal = new animal ();

var cat = new Cat ();

Using the call or Apply method, the ShowName () method that originally belonged to the animal object is given to the object cat.

The input result is "Cat"

Animal.showName.call (Cat, ",");

Animal.showName.apply (cat,[]);

Call means to put the animal method on the cat, the original cat is no ShowName () method, now is to put the animal ShowName () method on the cat to execute, so this.name should be cat.

C. Implementing inheritance

function Animal (name) {

THIS.name = name;

This.showname = function () {

alert (this.name);

}

}

function Cat (name) {

Animal.call (this, name);

}

var cat = new Cat ("Black cat");

Cat.showname ();

Animal.call (this) means that the Animal object is used instead of the this object, so there is no Animal of all the properties and methods in Cat, and the Cat object can directly invoke the Animal method and properties.

D, multiple inheritance

function Class10 () {

This.showsub = function (A, b) {

Alert (A-B);

}

}

function Class11 () {

This.showadd = function (A, b) {

alert (A+B);

}

}

function Class2 () { 

Class10.call (this);

Class11.call (this);

}

Very simple, using two call to achieve multiple inheritance of course, JS inheritance There are other methods, such as the use of prototype chain, this is not part of the scope of this article, just to illustrate the use of call. Said call, of course, and apply, these two methods are basically a meaning, the difference is that the second parameter of call can be any type, and the second parameter of apply must be an array, or it can be arguments. The code is as follows:

var func=new function () {this.a= "func"}

var myfunc=function (x, y) {

var a= "MyFunc";

alert (THIS.A);

Alert (x + y);

}

Myfunc.call (func, "var", "fun");//"Func" "var fun"

Myfunc.apply (func,["var", "Fun"]);//"Func" "var fun"

The Apply () and call () methods and differences in JavaScript