在前端开发中，我们经常使用控制台来输出调试信息。控制台对象有一个很方便的方法叫做 console.log()，它可以输出文本、数字、布尔值等等基础数据类型和对象。除此之外，console 还提供了许多其他的方法，比如 console.warn() 可以输出警告信息，console.error() 可以输出错误信息，console.table() 可以将对象打印成表格。然而，在某些情况下，我们可能会看到一个奇怪的错误："Uncaught TypeError: Illegal invocation"，这个错误信息通常是由于我们没有正确地使用 apply() 方法所导致的。
apply() 是什么？
在介绍错误原因之前，我们先来了解一下 apply() 方法。apply() 是 JavaScript 中的一个函数方法，它可以改变函数执行时的上下文（即 this 指向）并且传递参数。语法如下：
function.apply(thisArg, [argsArray])
其中，thisArg 表示要绑定到函数上下文中的对象，如果函数不需要指定上下文，则可以传递 null 或 undefined；argsArray 是一个数组或者类数组对象，其中包含要作为参数传递给函数的所有参数。
下面是一个简单的示例，它演示了如何使用 apply() 方法来调用一个函数并改变上下文：
-- -------------------- ---- -------
----- ------ - -
---------- -
------ ------------------ ------------------
--
--
----- ---- - -
---------- -------
--------- ------
--
----------------------------------------- -- -- ----- ----在这个示例中，我们定义了一个 person 对象和一个 john 对象。person 对象有一个 fullName() 方法，它返回 firstName 和 lastName 属性组成的字符串。我们通过 apply() 方法将 john 对象作为上下文传递给 fullName() 方法，并成功输出了 "John Doe"。
错误原因
当我们使用 console.log() 或其他控制台方法时，它们实际上是挂载在 console 对象上的函数。这些函数的执行上下文默认是 console 对象本身。如果我们尝试将这些方法应用到其他对象上，就会出现 "Uncaught TypeError: Illegal invocation" 错误。
例如，下面的代码尝试将 console.log() 应用到一个新创建的空对象上：
const obj = {};
console.log.apply(obj, ['Hello world']); // Uncaught TypeError: Illegal invocation虽然这个例子看起来有些愚蠢，但它确实可以帮助我们理解错误的原因。由于 console.log() 函数的上下文必须是 console 对象，所以我们不能将它应用到其他对象上。
如何避免错误
为了避免 "Uncaught TypeError: Illegal invocation" 错误，我们需要确保在使用 apply() 方法时，被应用的函数上下文正确。这意味着我们必须将控制台方法应用到 console 对象本身，而不是其他任何对象。
下面是一个示例，演示了如何将 console.log() 应用到 console 对象本身：
const args = ['Hello world']; console.log.apply(console, args);
在这个示例中，我们将参数数组 [ 'Hello world' ] 传递给 apply() 方法，并指定 console 对象作为上下文。通过这种方式，我们成功地将参数输出到控制台中。
结论
在前端开发中，控制台日志是一种非常有用的调试工具。然而，在使用 apply() 方法时可能会出现 "
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/14792