Understand the apply method in javascript

In JavaScript, the apply() method is a very useful method. It can be used to call a function and set the function's this value and parameters. This article will handwrite an apply() method to better understand how it works.

First, let us understand the syntax of the apply() method. It takes two parameters: the first parameter is the function to be called, and the second parameter is an array or array-like object containing the parameters to be passed to the function. As shown below:

function myFunc(arg1, arg2) {
  console.log(this.name + arg1 + arg2);
}

const obj = {name: 'John'};
const args = [1, 2];

myFunc.apply(obj, args);
// 输出：John12

In the above example, we used the apply() method to call the myFunc() function. We set this value to obj and store the argument list in the args array. The output of the myFunc() function is the result of adding the name attribute of obj to the two parameters.

Now, let us write an apply() method by hand. We can do this by creating a function called myApply(), which simulates the specific functionality of the apply() method. To simulate the apply() method, we will first need to check whether the given function exists and ensure that the second parameter is an array or array-like object and that the length of the object is not null. The following is the code of myApply() function:

Function.prototype.myApply = function(context, args) {
  if (typeof this !== 'function') {
    throw new TypeError('The current object is not a function.');
  }

  if (!Array.isArray(args) && !((args.length !== null) && (args !== ''))) {
    throw new TypeError('The second argument is not an array or array-like object.');
  }

  const fn = Symbol('fn');
  context = context || window;
  context[fn] = this;

  const result = context[fn](...args);
  delete context[fn];

  return result;
}

In the above code, we first check whether the function to be called exists, and throw a type error if it does not exist. Next we check if the second parameter is an array or array-like object, and if not, a type error will be thrown. If both parameters are valid, we create a unique Symbol as a temporary property of the context object, bind the function to the context object, call it by passing the args argument, and store the result in the result variable. Finally, we remove this temporary property from the context object and return the result.

Next, we can use the myApply() function to call the function, as shown in the following code:

function myFunc(arg1, arg2) {
  console.log(this.name + arg1 + arg2);
}

const obj = {name: 'John'};
const args = [1, 2];

myFunc.myApply(obj, args);
// 输出：John12

In this example, we use the myApply() method to call myFunc ()function. We set this value to obj and store the argument list in the args array. The output of the myFunc() function is the result of adding the name attribute of obj to the two parameters.

In this article, we hand-wrote an apply() method and used it to call a function. We looked at how to check if a function exists and how to avoid passing illegal arguments. With this example, you should be able to better understand how the apply() method works, and the steps required to write it by hand.

The above is the detailed content of Understand the apply method in javascript. For more information, please follow other related articles on the PHP Chinese website!