js中apply和call的理解与使用方法

下面是关于“js中apply和call的理解与使用方法”的完整攻略：

一、概述

在 JavaScript 中，call() 和 apply() 都是 Function 原型对象上的方法，主要用于改变函数运行时的上下文对象（即 this 指向）。

在使用时，两者的区别主要在于传递参数的方式不同。call() 接收的是一个参数列表，而 apply() 接收的是一个参数数组。

二、使用方法

1. call()

call() 方法的基本语法为：

function.call(thisArg, arg1, arg2, ...)

其中，thisArg 表示要调用函数的上下文对象，arg1、arg2、... 表示要传递给函数的参数列表。

下面是一个示例，用 call() 改变一个函数的上下文对象：

const obj1 = {
  name: 'Jack'
}
const obj2 = {
  name: 'Tom'
}
function sayName() {
  console.log(this.name)
}
sayName.call(obj1) // 输出 Jack
sayName.call(obj2) // 输出 Tom

在上面的示例中，sayName() 函数被分别调用了两次，使用了两个不同的上下文对象 obj1 和 obj2。这是通过 call() 方法来实现的。

2. apply()

apply() 方法的基本语法为：

function.apply(thisArg, [arg1, arg2, ...])

其中，参数和 call() 方法相同，只是参数以数组的形式传递。

下面是一个示例，用 apply() 调用一个函数并传递数组参数：

const arr = [1, 2, 3, 4, 5]
function sum(arr) {
  let result = 0
  for (let i = 0; i < arr.length; i++) {
    result += arr[i]
  }
  return result
}
const total = sum.apply(null, [arr])
console.log(total) // 输出 15

在上面的示例中，sum() 函数被调用了一次，使用的是 apply() 方法。apply() 方法将数组 arr 作为参数传递给 sum() 函数。

三、总结

在实际开发中，call() 和 apply() 方法应用广泛，可以使用它们来改变函数的上下文对象，方便地实现函数复用。同时，还可以利用 apply() 方法来传递数组参数。

在使用时，需要注意上下文对象和参数的类型及顺序。如果不传入上下文对象，默认指向全局对象 window。

希望这份攻略能够帮助大家更好地使用 call() 和 apply() 方法。