有关JavaScript中call()和apply() 的一些理解

call()方法和apply()方法，在上层应用中用的不是很多，但在底层写JS框架的时候却常常看到。然后度娘谷哥一番，也发现好多达人写出了自己的理解和笔记，但始终还是云里雾里，于是去W3C学习了下 在W3C网上研究这两个方法的时候，看到一个词语，叫“对象冒充”，这个概念本人觉得还是挺重要的，让我对这两个方法理解起来更加直观。 call()方法，看下官方给出的例子 function sayColor(sPrefix,sSuffix) { alert(sPrefix + this.color + sSuffix); }; var obj = new Object(); obj.color = 在JavaScript中，`call()` 和 `apply()` 是两种非常重要的函数调用方式，它们都用于改变函数内部 `this` 的指向。在上层应用中可能使用较少，但在编写底层框架时，它们扮演着不可或缺的角色。这两者的核心作用是实现“对象冒充”，即在调用函数时指定 `this` 关键字所指的对象。 我们来看 `call()` 方法。`call()` 方法的语法是： ```javascript func.call(thisArg, arg1, arg2, ..., argN); ``` 这里的 `thisArg` 将被设置为函数内部的 `this`，`arg1, arg2, ..., argN` 是传递给函数的参数。在例子中： ```javascript function sayColor(sPrefix, sSuffix) { alert(sPrefix + this.color + sSuffix); }; var obj = new Object(); obj.color = "blue"; sayColor.call(obj, "The color is ", "a very nice color indeed."); ``` `call()` 方法将 `obj` 作为 `sayColor` 函数内部的 `this`，所以 `this.color` 被解析为 `"blue"`，最终输出 `"The color is blue, a very nice color indeed."`。 接下来，我们讨论 `apply()` 方法。`apply()` 的语法与 `call()` 相似，只是传递参数的方式有所不同： ```javascript func.apply(thisArg, [argsArray]); ``` `argsArray` 必须是一个数组或类数组对象，它的元素会被作为单独的参数传递给函数。继续使用上面的例子： ```javascript sayColor.apply(obj, ["The color is ", "a very nice color indeed."]); ``` 这里 `["The color is ", "a very nice color indeed."]` 作为 `argsArray`，`sayColor` 函数内部的 `sPrefix` 和 `sSuffix` 分别对应数组的第一个和第二个元素，所以结果同样是 `"The color is blue, a very nice color indeed."`。 尽管 `call()` 和 `apply()` 在改变 `this` 指向方面有共同之处，但它们的主要区别在于参数传递方式：`call()` 直接按位置传递参数，而 `apply()` 使用数组传递。这种差异在处理动态数量的参数时尤其有用。例如，如果你不确定会有多少个参数，可以使用 `apply()` 并在参数列表中传递一个包含所有参数的数组。 在实际应用中，`call()` 和 `apply()` 还常用于继承、扩展原生对象、以及创建通用的函数工具等场景。它们是JavaScript灵活性的重要体现，熟练掌握这两个方法对于深入理解JavaScript的面向对象编程至关重要。通过对象冒充，开发者可以灵活地控制函数的执行环境，实现更加复杂的逻辑。在编写框架或者库时，这些技巧经常被用来实现各种高级功能，如方法绑定、类的模拟等。因此，无论是为了提升代码质量，还是为了更好地驾驭JavaScript，对 `call()` 和 `apply()` 的理解都是必不可少的。