The difference between apply () and call ()

To get a deeper understanding of call() apply() These two methods, you must first know their basic role:

Changing the execution context of an object

What is the execution context?

When we write a method, we always use a keyword this , and this the point is what we call the execution context (execution Environment)

First we need to know that the this point is always to call the method of the object, how to prove that this the point is the current object? Look at the following code:

function func () {    this.a = 1;    console.log(this.a);}func();  // 1

After the method executes the console output in the code, 1 because func it is window a method under the Global object, the object that calls the method should be a global object window , so the this object pointed to in theory should bewindow

If the theory is established, and this.a==1 , in other words, the variable a is a global variable. On the console directly input a or window.a rear carriage return, you will find the output 1 , so in func this method, this the point iswindow

In a different way to verify the following:

var person = {    name: ‘xiao ming‘,    age: 18,    who: function () {        console.log( ‘my name is ‘ + this.name + ‘ , ‘ + this.age + ‘ years old‘ );        console.log( person === this);    }}person.who();// my name is xiao ming , 18 years old// true

The method in the above code who is person a property of the object, person called by the object, so this the point isperson

call()And apply()Difference

Before you know the similarities and differences, find out how these two methods are used.

Basic use

Call ()

function.call(obj[,arg1[, arg2[, [,.argN]]]]])

• callthe called object must be a functional function
• callThe first parameter will be the object that the function will point to when the context is changed, and if not passed, the default is the global objectwindow
• The second parameter starts with the ability to receive any parameter that will pass in function as a function parameter
• callthe called method executes immediately

Apply ()

function.apply(obj[,argArray])

is call basically consistent with the use of a method, but only receives two parameters, where the second parameter must be an array or an array of classes , which is a very important difference between the two methods

Array and class array small science

Arrays we all know what it is, what are its characteristics?

1. Can be called by a corner label, such asarray[0]
2. With Length propertylength
3. Can be traversed through for loops and forEach methods

Class array as the name implies, with the characteristics should be basically the same as the array, then you can know, a shape like the following object is an array of classes

var arrayLike = {    0: ‘item1‘,    1: ‘item2‘,    2: ‘item3‘,    length: 3}

An array of classes arrayLike can be called with a corner mark, have length properties, and can be traversed through a for loop

The method we often use to get a DOM node returns an array of classes, all of which are obtained by using a keyword in a method, and all of the arguments parameters of that method are also an array of classes

But the class array cannot be forEach traversed, because forEach it is a method on the array prototype chain, and the class array is not an array after all, so it cannot be used

So how can you make an array of classes work forEach ? The little friends can think about it after reading this article.

Difference

Same point

Can change the execution context of the method (execution environment), the method of one object is handed to another object to execute, and is executed immediately

Different points

callThe method can receive any parameter starting from the second parameter, and each parameter is mapped to the Func parameter of the corresponding location, which can be called by the parameter name, but if all arguments are passed as an array, they are mapped to the first parameter of the Func as a whole, after which the parameters are empty

function func (a,b,c) {}func.call(obj, 1,2,3)// function接收到的参数实际上是 1,2,3func.call(obj, [1,2,3])// function接收到的参数实际上是 [1,2,3],undefined,undefined

applyMethod has a maximum of two parameters, the second parameter receives an array or an array of classes, but is converted into a class array into the Func, and is mapped to the parameters of the func corresponding

func.apply(obj, [1,2,3])// function接收到的参数实际上是 1,2,3func.apply(obj, {    0: 1,    1: 2,    2: 3,    length: 3})// function接收到的参数实际上是 1,2,3

Two ways to choose?

With simple, according to the parameters you want to pass the choice, do not need to pass the parameter or only 1 parameters when, call when you want to pass in multiple objects, withapply

Alternatively, if you need to pass in a parameter that is already an array or an array of classes, use apply , if you need to pass in individually, you can consider using it call (if you're not too troublesome)

"Other uses--Object inheritance"

You this can also implement object inheritance because of the direction that can be changed

function superClass () {    this.a = 1;    this.print = function () {        console.log(this.a);    }}function subClass () {    superClass.call(this);    this.print();}subClass();// 1

subClassThrough call methods, inherited superClass print methods and a variables, but subClass also can extend their own other methods

The difference between apply () and call ()