JavaScript篇：函数间的悄悄话：callee和caller的那些事儿

大家好，我是江城开朗的豌豆，一名拥有6年以上前端开发经验的工程师。我精通HTML、CSS、JavaScript等基础前端技术，并深入掌握Vue、React、Uniapp、Flutter等主流框架，能够高效解决各类前端开发问题。在我的技术栈中，除了常见的前端开发技术，我还擅长3D开发，熟练使用Three.js进行3D图形绘制，并在虚拟现实与数字孪生技术上积累了丰富的经验，特别是在虚幻引擎开发方面，有着深入的理解和实践。

我一直认为技术的不断探索和实践是进步的源泉，近年来，我深入研究大数据算法的应用与发展，尤其在数据可视化和交互体验方面，取得了显著的成果。我也注重与团队的合作，能够有效地推动项目的进展和优化开发流程。现在，我担任全栈工程师，拥有CSDN博客专家认证及阿里云专家博主称号，希望通过分享我的技术心得与经验，帮助更多人提升自己的技术水平，成为更优秀的开发者。

技术qq交流群：906392632

大家好，我是小杨，一个做了6年前端的老司机。今天想和大家聊聊JavaScript中两个比较有意思的属性------arguments.callee和function.caller。别看它们平时不显山不露水，但在某些场景下还真能帮上大忙！

一、`arguments.callee`：我是谁？

先说说arguments.callee，它指向当前正在执行的函数本身。这个特性在匿名函数中特别有用。

javascript 复制代码

// 举个栗子：计算阶乘
function factorial(n) {
  if (n <= 1) return 1;
  return n * arguments.callee(n - 1);  // 这里用arguments.callee代替函数名
}

console.log(factorial(5)); // 输出120

以前我写递归函数时，如果函数名改了，还得手动修改递归调用的地方，用了arguments.callee就不用担心这个问题了。

不过要注意，在严格模式下('use strict')是不能使用arguments.callee的，ES6的箭头函数中也没有这个属性。

二、`function.caller`：谁在叫我？

再来说说function.caller，它指向调用当前函数的函数。这个属性可以帮助我们追踪函数的调用链。

javascript 复制代码

function outer() {
  inner();
}

function inner() {
  console.log(inner.caller); // 会输出outer函数的代码
}

outer();

记得有一次我调试一个复杂项目时，有个函数莫名其妙被调用了，用console.trace()又觉得信息太多，这时候caller属性就帮了大忙，让我一眼就看出是谁调用了这个函数。

三、使用场景与注意事项

虽然这两个属性很方便，但现在已经不推荐使用了，原因有几点：

严格模式下会报错
影响JavaScript引擎的优化
现代JavaScript有更好的替代方案

比如递归函数可以用命名函数表达式：

javascript 复制代码

const factorial = function me(n) {
  if (n <= 1) return 1;
  return n * me(n - 1);  // 使用命名函数表达式
};

而调用栈追踪可以用console.trace()或者Error对象的stack属性。

四、总结

虽然callee和caller曾经是JavaScript中的"黑科技"，但随着语言发展，现在已经有更好的替代方案了。作为开发者，我们既要了解这些特性（说不定哪天维护老代码就用上了），也要知道更现代的解决方案。

你还知道哪些JavaScript中的"老古董"特性？欢迎在评论区分享你的经验！

JavaScript篇：函数间的悄悄话：callee和caller的那些事儿

一、arguments.callee：我是谁？

二、function.caller：谁在叫我？

三、使用场景与注意事项

四、总结

一、`arguments.callee`：我是谁？

二、`function.caller`：谁在叫我？