js apply/call/caller/callee/bind使用方法与区别分析

JS中的apply、call、caller、callee以及bind是函数对象的5个方法，它们可以帮助我们更加灵活地调用函数、改变函数的this指向以及传递参数。本文将详细讲解它们的使用方法和区别分析。

apply和call方法

apply和call方法用于调用一个函数，并且可以指定函数的this指向，同时还可以将参数以数组或者类数组的形式传递给函数。

apply方法

apply方法的语法格式为：

function.apply(thisArg[, argsArray])

其中，thisArg表示函数的this指向，argsArray表示传递给函数的参数数组。

例如，我们可以通过apply方法将Array的push方法应用于另一个对象上，代码如下：

let obj1 = {
  length: 0
};

let arr1 = [1, 2, 3];

Array.prototype.push.apply(obj1, arr1);

console.log(obj1);
// {0: 1, 1: 2, 2: 3, length: 3}

在以上示例中，我们使用apply方法将Array原型对象上的push方法应用到obj1对象上，并传入arr1数组作为参数列表。由于obj1对象并没有push方法，但是通过这种方式我们可以成功地将arr1数组中的元素添加到obj1对象中。

call方法

call方法的语法格式与apply方法类似，但是它的第二个参数是一个可以逐个列举出传递给函数的参数列表。

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

例如，我们可以通过call方法将对象的属性和方法应用于另一个对象上，代码如下：

let obj2 = {
  name: 'Tom'
};

let obj3 = {
  name: 'Jerry',
  sayHello: function() {
    console.log('Hello ' + this.name);
  }
};

obj3.sayHello.call(obj2);
// Hello Tom

在以上示例中，我们使用call方法将obj2对象应用于obj3的sayHello方法上，从而使得在sayHello方法中this指向了obj2对象。

caller和callee方法

caller和callee方法用于获取函数的引用和调用当前函数的函数的引用，通常用于调试和递归操作。

caller方法

caller方法返回一个函数对象的引用，它代表调用当前函数的函数。

例如，我们可以使用一个递归函数来演示caller方法，代码如下：

function recursion(n) {
  if(n === 0) {
    console.log('stop');
  } else {
    console.log(recursion.caller);
    recursion.caller(n - 1);
  }
}

recursion(3);

在以上示例中，我们使用recursion.caller方法获取调用递归函数的函数的引用，并进行了多次递归操作。

callee方法

callee方法返回当前正在执行的函数的引用，通常用于递归操作。

例如，我们可以使用一个递归函数来演示callee方法，代码如下：

function fib(n) {
  if (n <= 2) {
    return 1;
  }
  return fib.callee(n - 1) + fib.callee(n - 2);
}

console.log(fib(10));

在以上示例中，我们使用fib.callee方法获取当前正在执行的函数的引用，并进行了对斐波那契数列的递归操作。

bind方法

bind方法可以创建一个新的函数，并且绑定指定的this对象，同时返回一个新的函数对象。

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

例如，我们可以使用bind方法来创建一个新的函数，并指定其this指向：

let obj4 = {
  message: 'Hello world!'
};

let displayMessage = function() {
  console.log(this.message);
}.bind(obj4);

displayMessage();
// Hello world!

在以上示例中，我们使用bind方法创建了一个新的函数displayMessage，并将其this指向obj4对象。这样，在调用displayMessage函数的时候，其this指向obj4对象。