The role and difference of the call () method and the Apply () method in JavaScript

ECMAScript specification all functions contain two non-inherited methods, call () and apply (), which are called functions in a specific scope, can change the scope of the function, and is actually the object that changes the reference of "this" in the function body.

Call (Thisobject[,arg1,arg2,arg3 ...]):

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

Description: The call method can be used to invoke a method in place of another object, which changes a function object context from the initial context to a new object specified by Thisobj, and if the Thisobject parameter is not provided, the global object is used for Thisobject.

Apply (Thisobject[,argarray])

Interpretation: Invokes one of the object's methods, and the other object replaces the current 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 will be used as the thisobj.

The difference:

The arguments passed by the two are different, and the arguments passed by call are enumerated, and the form of the Apply pass parameter is an array.

Both functions:

1. Calling function, passing parameters

 function   add (x, y) { return  x + y;  function   Myaddcall (x, y) { 
   
    return  add.call (
    this     
     function   myaddapply (x, y) { 
     
      return 
      add.apply (
    this     
     10, 20)); //  output result:    Console.log (myaddapply ( 20, 20)); //  output result:  
   

2, changing the scope of the function

var name = ' Lilei ';     var obj = {name: ' Hmm '};     function Student () {        returnthis. Name;    }    Console.log (Student.call (This));    // Output Lilei     Console.log (Student. Call (obj));     // Output Hmm

3. Simulating the inheritance of classes in Java

    functionFlyer (fname,speed) { This. fname=fname;  This. speed=Speed ;  This. fly=function() {Console.log ( This. fname+ "at speed:" + This. speed+ "Flight");//If you use the parent object's construction method, the construction method cannot be placed in the prototype object because the __proto__ of the subtype is independent of the prototype of the parent type      }}functionPlane (fname,speed,capacity) { This. capacity=capacity; Flyer.call ( This, Fname,speed); Delete  This. Fly;//If there is a constructor with the same name in the parent type, you need to first delete the constructor in the parent object       This. fly=function() {Console.log ( This. fname+ "equipped" + This. capacity+ "Passenger at speed:" + This. speed+ "Flight"); }}vara380=NewPlane ("A380", 1000,555);

The role and difference of the call () method and the Apply () method in JavaScript