What are the uses of the call() method and apply() method in Javascript? (Code attached)

The apply() method and call() method in JavaScript are methods of the Function object. Each Function object will have an apply() method and a call() method. Then, the apply() method and the call() method are in What is its usage and function in JavaScript? This article will talk about the usage of apply() method and call() method.

The syntax of apply() method and call() method:

/*apply()方法*/
function.apply(thisObj[, argArray])
/*call()方法*/
function.call(thisObj[, arg1[, arg2[, [,...argN]]]]);

Function: Borrow the method of another object without copying. (Can be used to call a method instead of another object, changing the object context of a function from the initial context to the new object specified by thisObj)

apply() method and call() method Basic usage:

function add(a,b){
  return a+b;  
}
function sub(a,b){
  return a-b;  
}
var a1 = add.apply(sub,[4,2]);　　//sub调用add的方法
var a2 = sub.apply(add,[4,2]);
alert(a1);  //6     
alert(a2);  //2

/*call的用法*/
var a1 = add.call(sub,4,2);

apply() method and call() method Implement inheritance:

function Animal(name){
  this.name = name;
  this.showName = function(){
        alert(this.name);    
    }    
}

function Cat(name){
  Animal.apply(this,[name]);    
}

var cat = new Cat("咕咕");
cat.showName();

/*call的用法*/
Animal.call(this,name);

apply() method and call() method Implement multiple inheritance:

    function Class10(){
      this.showSub = function(a,b){
            alert(a - b);
        }   
    }
    
    function Class11(){
      this.showAdd = function(a,b){
            alert(a + b);
        }  
    }
    
    function Class12(){
      Class10.apply(this);
      Class11.apply(this);   
      // Class10.call(this);
      //Class11.call(this);  
    }
    
    var c2 = new Class12();
    c2.showSub(3,1);    //2
    c2.showAdd(3,1);    //4

The function of the Call() method: change the pseudo array into a real array

The pseudo array is a json object containing the length attribute It is not a real array. In fact, it is simulating a collection (describing collection data)

For example:

var json = {1:’苹果’，2:’香蕉’,3:’菠萝’,length:3}
Var arr = [‘苹果’,’香蕉’,’菠萝’]

His characteristics:

1. All keys It is 1, 2, 3, 4, 5
2. It contains a length attribute

How to convert a pseudo array into a real array

/*我们通过如下方式将其转换成数组*/
/*slice：截取数组，返回的还是数组，这里截取全部*/
var domNodes=Array.prototype.slice.call(divs);
/*这样domNodes就可以应用Array下所有方法*/

apply() Method usage tips:

1. Math.max can achieve the largest item in the array:

Because Math.max does not support Math.max ([param1,param2]) is an array, but it supports Math.max(param1,param2...), so you can solve var max=Math.max.apply(null,array) according to the characteristics of apply, so that You can easily get the largest item in an array (apply will convert an array into a parameter-by-parameter method and pass it to the method).

When calling this block, the first parameter is given to null. This is because there is no object to call this method. I just need to use this method to help me calculate and get the returned result, so I pass it directly. A null passes.

You can also use this method to get the minimum item in the array: Math.min.apply(null,array)

2. Array.prototype.push can achieve two Merging of arrays

The same push method does not provide push to an array, but it provides push(param1,param2...paramN). You can also use apply to convert this array, that is:

   var arr1=new Array("1","2","3");
    var arr2=new Array("4","5","6");
    Array.prototype.push.apply(arr1,arr2);    
    //得到合并后数组的长度，因为push就是返回一个数组的长度

It can also be understood that arr1 calls the push method, and the parameter is an array converted into a collection of parameter lists through apply

Usually under what circumstances, you can use apply similar to Math. Special usages such as max: Generally, the target function only requires n parameter lists and does not receive an array. This problem can be solved cleverly by applying.

Recommended related articles:

Comparison of the use of call method and apply method in JavaScript_Basic knowledge

call and apply method in JavaScript A brief discussion on _javascript skills

The above is the detailed content of What are the uses of the call() method and apply() method in Javascript? (Code attached). For more information, please follow other related articles on the PHP Chinese website!