JavaScript之this学习心得
this在运行时绑定,并不是在编写时绑定,它的上下文取决于函数调用的各种条件。this既不指向自身,也不指向函数的词法作用域。this是在函数被调用时发生的绑定,指向什么完全取决于函数在哪里被调用。
this绑定规则
1. 默认绑定:this绑定在函数调用的位置。只在非严格模式下,才能绑定到调用位置,严格模式下与调用位置无关。
function foo(){ console.log(this.a); } var a = 2; foo(); // 2
2. 隐式绑定:this绑定需要考虑调用位置是否有上下文对象,或者说是否被某个对象拥有或者包含。this绑定到函数引用的上下文对象上。
function foo(){ console.log(this.a); } var obj1 = { a:1, foo:foo }; var obj2 = { a:2, obj1:obj1 }; obj2..obj1.foo(); // 1
注:对象属性引用链中只有最顶层或者说最后一层会影响调用位置。
隐式丢失:被隐式绑定的对象会丢失,然后采用默认绑定,从而把this绑定到全局对象或undefined上,取决于是否是严格模式。其根源是函数对象传递是传的引用,不是复制,与中间经过的各种历程无关,只是与初始定义有关 。
function foo(){ console.log(this.a); } var obj = { a:0, foo:foo }; var bar = obj.foo; // 函数别名 var a = "global"; bar(); // "global"
3. 显式绑定:使用函数的call()/apply()方法进行this绑定。它们的第一个参数是一个对象,会把这个对象绑定到this。
function foo(){ console.log(this.a); } var obj = { a:0, }; foo.call(obj); // 0
call(obj,var1,var2,···),apply(obj,[var1,var2,···])
4. new绑定:使用new调用函数(构造函数调用),将this绑定到新构建的对象上。
function foo(){ this.a = a; } var bar = new foo(0); console.log(bar.a); // 0
new操作的执行过程:
- 创建一个全新的对象;
- 新对象被执行[[原型]]连接;
- 新对象绑定到函数调用的this;
- 若函数没有返回其他对象,那么new表达式中的函数调用会自动返回这个新对象。
this绑定判断流程
- 由new调用?绑定到新建的对象;
- 由call/apply/bind调用?绑定到指定的对象;
- 由上下文对象调用?绑定到那个上下文对象;
- 默认:在严格模式下绑定到undefined,否则绑定到全局对象。
数据冰冷的,但我们要让数据温暖起来,改变我们的生活!
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· 开发者必知的日志记录最佳实践
· SQL Server 2025 AI相关能力初探
· winform 绘制太阳,地球,月球 运作规律
· 震惊!C++程序真的从main开始吗?99%的程序员都答错了
· AI与.NET技术实操系列(五):向量存储与相似性搜索在 .NET 中的实现
· 超详细:普通电脑也行Windows部署deepseek R1训练数据并当服务器共享给他人
· 【硬核科普】Trae如何「偷看」你的代码?零基础破解AI编程运行原理