this和闭包研究

本文深入探讨JavaScript中this关键字的行为及作用域规则,包括全局上下文、对象方法、构造函数及事件处理程序等不同场景下的表现,并提供实际应用案例。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

1.在window上写:this === window // 返回true
2.this的作用域取决于谁最后调用了this,谁就是this指向的对象。
2.1
var obj={
a:function(){
console.log(this)
},
b:3
}
obj.a()
// {b: 3, a: ƒ}

2.2
var obj={
a:{
aa:function(){
console.log(this)
},
},
b:3
}
obj.a.aa()
// {aa: ƒ}

3.自执行函数作用域在全局,this指向window
3.1匿名自执行函数
var p={};
p.Fun=function(){
return this
}();
console.log(p.Fun)
// Window

3.2或者有名字的自执行函数
var p={};
p.Fun=function text(){
return this
}();
console.log(p.Fun)
//Window

4.当发生嵌套时,内部this容易丢失,然后指向window
4.1
var obj={
a:function(){
console.log(this)
function geta(){
console.log(‘geta’,this)
}
geta.(this)
},
b:3
}
obj.a()
//Window
4.2通过call,或者that=this修改指向
var obj={
a:function(){
console.log(this)
function geta(){
console.log(‘geta’,this)
}
geta.call(this)
},
b:3
}
obj.a()

5.三.什么情况下this的指向会被改变
这些情况大致可以分为两类:

5.1.关键字类。主要有new,return
5.2.函数类。 主要有call,apply,bind

6.应用场景
6.1 setTimeout(function(){console.log(this)},3000)的this指向window

var obj={
a:function(){
setTimeout(function(){console.log(‘set’,this)},1000)
},
b:3
}
obj.a()
// Window
所以需要改成
setTimeout((function(){console.log(‘set’,this)}).bind(this),1000)
或者用es6的箭头函数 setTimeout(()=>{console.log(‘set’,this)},1000)

6.2借用方法。伪数组没有方法,可以借用数组上的方法
Object.prototype.toString.call([])
“[object Object]”

// 伪数组 有数字下标 有length 能for循环遍历 不能使用数组的方法
var obj = {
0:“zs”,
1:15,
2:“sing”,
length:3
}
console.log([].push.call(obj,“哈哈哈”,“嘿嘿嘿”))

6.3借用方法
var obj={
a:function(){
console.log(this)
},
b:3
}
var obj2={
aa:function(){
console.log(this)
},
bb:3
}
undefined
obj.a.call(obj2)
// {bb: 3, aa: ƒ}


闭包
var data=function(){
return{
name:“zhangsan”,
age:20
}
}
var a=data();
var b=data();
a.age=18
console.log(a,b) //{name: “zhangsan”, age: 18} {name: “zhangsan”, age: 20}

vue的组件data也是return,为了防止污染全局

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

前端段

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值