this, caller, callee的区别和用法

javaScript 复制代码
function foo() { 
    console.log(this);
    console.log(foo.caller);
    
}

function bar() {
    foo(); 
    
}

foo();

bar();

在 JavaScript 中,this 的值取决于函数被调用的方式。当一个函数作为对象的方法被调用时,this 指向该对象。当一个函数作为函数被调用时,this 默认指向全局对象(在浏览器中是 window)。

在你的代码中,foo 是一个独立的函数,所以它的 this 默认指向全局对象。当你单独调用 foo() 时,它会输出全局对象。

然而,当 foo 作为 bar 函数的一部分被调用时,foothis 并不会改变。因此,当你调用 bar() 时,foo() 中的 this 仍然指向全局对象。

所以,foo()bar() 输出的结果是一样的,都是全局对象(箭头函数另说)。

caller显示的函数的调用者,foo()直接调用返回的是null; bar()直接调用返回的是 bar函数体;

javaScript 复制代码
function foo() { 
    console.log(arguments.caller);
    
}

function () {
   console.log(arguments.caller); 
}

arguments.caller用来获取当前函数名,主要是在匿名函数递归时,函数没有名字 ,所以可以用arguments.caller来代替当前匿名函数,但是严格模式禁用的该属性

相关推荐
OpenTiny社区2 分钟前
盘点字体性能优化方案
前端·javascript
FogLetter6 分钟前
深入浅出React Hooks:useEffect那些事儿
前端·javascript
Savior`L6 分钟前
CSS知识复习4
前端·css
0wioiw021 分钟前
Flutter基础(前端教程④-组件拼接)
前端·flutter
花生侠1 小时前
记录:前端项目使用pnpm+husky(v9)+commitlint,提交代码格式化校验
前端
一涯1 小时前
Cursor操作面板改为垂直
前端
我要让全世界知道我很低调1 小时前
记一次 Vite 下的白屏优化
前端·css
1undefined21 小时前
element中的Table改造成虚拟列表,并封装成hooks
前端·javascript·vue.js
蓝倾2 小时前
淘宝批量获取商品SKU实战案例
前端·后端·api