Detailed explanation of the use of apply and call in js (with code)

This time I will bring you a detailed explanation of the use of apply and call in js (with code). What are the precautions for using apply and call in js. The following is a practical case, let's take a look.

You can look at the examples directly, or you can read the introduction first:

call and apply appear to dynamically change this. When an object does not have a certain method, but others do, we can use call or apply to operate with the methods of other objects .

call and apply both belong to a method of Function.prototype, which is implemented internally by the JavaScript engine. Because it belongs to Function.prototype, every Function object instance, that is, every method has a call , applyattribute. Since they are attributes of methods, their use is of course specific to methods. These two methods are easily confused because they have the same function, but they are used in different ways. .
It can be concluded from the above that call, apply is used for methods, in order to change the this pointer of calling the method

Simple example:

call

function A() {
  this.getName = function (xx) {
    return xx;
  }
}
function B() {
}
var a = new A();
console.log( a.getName('i am A') ); //i am A
var b = new B() ;
console.log( a.getName.call(b,'i am B') ); // i am B

There is no method in the B function, and the A function has a getName() method. a.getName() is naturally established, but what should I do if B also needs to use the getName() method? Then use call(this,'parameter')! !

You can understand this sentence again - we can use call or apply to call other objects' methods to operate. Call and apply appear to dynamically change this. , originally a.getName() this pointed to a, call dynamically pointed this to b, and became b.getName()

apply

Apply and call only differ in the use of parameters

function A() {
  this.sun = function (a ,b) {
    return a+b;
  }
}
function B() {
}
var a = new A();
console.log( a.sun(1,2) ); //3
var b = new B() ;
console.log( a.sun.call(b,2,2) ); // 4
console.log( a.sun.apply(b,[3, 3]) ); //6

General usage of call and apply

It is commonly used. The dom node selected through document.getElementsByTagName is an array-like array. It cannot apply push, pop and other methods under Array. We can pass:

var domNodes = Array.prototype.slice.call(document.getElementsByTagName("*"));

In this way, domNodes can apply all methods under Array.

I believe you have mastered the method after reading the case in this article. For more exciting information, please pay attention to other related articles on the php Chinese website!

Recommended reading:

Display CSS style in Angular 4

How does the vue component implement the guessing number function

The above is the detailed content of Detailed explanation of the use of apply and call in js (with code). For more information, please follow other related articles on the PHP Chinese website!